Blogger Template 3 – Psychedelic Party
I’ve been doing a lot of templates lately… I’m publishing them one by one and this is the first of the series.
You can view the live demo here.
Highlight the XML Code in the text box and copy and replace your current blogger code.
/* Variable definitions body { /* Header #header-wrapper { } #header-inner { #header { #header h1 { #header a { #header a:hover { #header .description { #header img { /* Outer-Wrapper #main-wrapper { #sidebar-wrapper { } h2 { /* Posts .post { .post h3 a, .post h3 a:visited, .post h3 strong { .post h3 strong, .post h3 a:hover { .post-body { .post-body blockquote { .post-footer { .comment-link { /* Comments #comments-block { .feed-links { #blog-pager-newer-link { #blog-pager-older-link { #blog-pager { /* Sidebar Content .sidebar ul { .sidebar .widget, .main .widget { .main .Blog { /* Profile .profile-data { .profile-datablock { .profile-textblock { .profile-link { /* Footer
====================
default="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal bold 78% Verdana, sans-serif">
default="normal normal 300% Gigi" value="normal bold 359% Trebuchet, Trebuchet MS, Arial, sans-serif">
default="normal normal 90% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal bold 99% Trebuchet, Trebuchet MS, Arial, sans-serif">
default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 86% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif">
*/
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
text-decoration:underline;
}
a img {
border-width:0;
}
———————————————–
*/
width:745px;
height:300px;
margin:0 auto 10px;
border:3px solid $bordercolor;
background-image: url(http://img360.imageshack.us/img360/209/psychedelic1je8.jpg);
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}
margin: 5px;
border: 0px solid $bordercolor;
text-align: left;
color:$pagetitlecolor;
}
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:normal;
letter-spacing:.2em;
font: $pagetitlefont;
}
color:$pagetitlecolor;
text-decoration:none;
}
color:$pagetitlecolor;
}
margin-right: 300px;
padding:0 20px 15px;
max-width:600px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}
margin-$startSide: auto;
margin-$endSide: auto;
}
———————————————– */
#outer-wrapper {
width: 750px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
width: 500px;
border:3px solid $bordercolor;
background-image:url(http://img360.imageshack.us/img360/9153/psychedelicside1dg8.jpg);
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
width: 225px;
margin-right: 0px;
border:3px solid $bordercolor;
background-image:url(http://img360.imageshack.us/img360/9153/psychedelicside1dg8.jpg);
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#footer-wrapper {
width: 725px;
margin:0 auto;
text-align:center;
font: $descriptionfont;
/* Headings
———————————————– */
margin:1.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;
}
———————————————–
*/
h2.date-header {
margin:1.5em 0 .5em;
margin-left: 10px;
margin-right: 10px;
}
margin:.5em 0 1.5em;
margin-left: 10px;
margin-right: 10px;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
}
.post h3 {
margin:.25em 0 0;
margin-left: 10px;
margin-right: 10px;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}
display:block;
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}
color:$textcolor;
}
margin:0 .75em;
line-height:1.6em;
}
line-height:1.3em;
}
margin: .75em 0;
color:$sidebarcolor;
text-transform:uppercase;
letter-spacing:.1em;
font: $postfooterfont;
line-height: 1.4em;
}
margin-$startSide:.6em;
}
.post img {
padding:4px;
border:1px solid $bordercolor;
}
.post blockquote {
margin:1em 20px;
}
.post blockquote p {
margin:.75em 0;
}
———————————————– */
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color: $sidebarcolor;
}
margin:1em 0 1.5em;
line-height:1.6em;
}
#comments-block .comment-author {
margin:.5em 0;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}
clear: both;
margin-left: 10px;
margin-right: 10px;
line-height: 2.5em;
}
float: $startSide;
}
float: $endSide;
}
text-align: center;
}
———————————————– */
.sidebar {
color: $sidebartextcolor;
margin-left: 10px;
margin-right: 10px;
line-height: 1.5em;
}
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:15px;
text-indent:-25px;
line-height:1.5em;
}
border-bottom:1px dotted $bordercolor;
margin:0 0 1.5em;
padding:0 0 1.5em;
}
border-bottom-width: 0;
}
———————————————– */
.profile-img {
float: $startSide;
margin-top: 0;
margin-$endSide: 5px;
margin-bottom: 5px;
margin-$startSide: 0;
padding: 4px;
border: 1px solid $bordercolor;
}
margin:0;
text-transform:uppercase;
letter-spacing:.1em;
font: $postfooterfont;
color: $sidebarcolor;
font-weight: bold;
line-height: 1.6em;
}
margin:.5em 0 .5em;
}
margin: 0.5em 0;
line-height: 1.6em;
}
font: $postfooterfont;
text-transform: uppercase;
letter-spacing: .1em;
}
———————————————– */
#footer {
width:660px;
clear:both;
margin:0 auto;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}
]]>
![]()
