Get manámaná's template at 8-nov-2006

As requested by AJX in Hacking this blog below is the template I actually use at manámaná without the text styles and inserted comments in the header and other jpeg images inserted. The original template was the Underwater for Blogger Beta by Hans Oosting from Beautiful Beta over a work by Ramani's Hackosphere, I've only modified styles from text, columns, borders, paddings, headers, etc., for adapting it visually to my desired blog style. If you use it please make a
reference note to Beautiful Beta .

Bear in mind that I'm a CSS learner and thus my designer approach has a try-claim to heavens-rectify style so I won't probably be able to answer your questions. Also consider that I've already inserted some widgets and hacks in my template that you don't have in your blog so it may well need some adaptation. And remember
always backup your style before trying this one!

Important: I've only inserted here the section <head>, I've not touched the rest of the template yet. If you want the complete template please download Underwater and substitute its <head> section with mine:

<head>
<title><data:blog.pageTitle/></title>
<b:include data='blog' name='all-head-content'/>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Underwater
Designer: Hans Oosting
Artwork: Vladstudio
Date: 23 Sep 2006
-----------------------------------------------
Styles modified by Noir (thanks Hans for your great work!)
-----------------------------------------------
*/
/* Variable definitions
====================
<Variable name="bodyBgColor" description="Main Background
Color"
type="color" default="#666666" value="#666666">
<Variable name="mainBgColor" description="Blog Background
Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="borderColor" description="Border Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="headerTextColor" description="Blog Header
Text Color"
type="color" default="#ffffff" value="#666666">
<Variable name="descriptionTextColor" description="Blog Description
Text Color"
type="color" default="#999999" value="#999999">
<Variable name="sidebarTitleTextColor" description="Sidebar
Title Text Color"
type="color" default="#666666" value="#666666">
<Variable name="dateHeaderColor" description="Date Header
Color"
type="color" default="#996633" value="#7f7f7f">
<Variable name="postHeaderColor" description="Post Header
Color"
type="color" default="#AA2F51" value="#AA2F51">
<Variable name="textColor" description="Text Color"
type="color" default="#000000" value="#000000">
<Variable name="linkColor" description="Link Color"
type="color" default="#AA2F51" value="#AA2F51">
<Variable name="visitedlinkColor" description="Visited Link
Color" type="color" default="#D56685" value="#D56685">
<Variable name="bqBgColor" description="Blocquote Background
Color" type="color" default="#ffcc66" value="#e6e6e6">
<Variable name="bqTextColor" description="Blocquote Text Color"
type="color" default="#660000" value="#666666">
<Variable name="bodyFont" description="Text Font"
type="font" default="normal normal 90% Arial, sans-serif;"
value="normal normal 77% Arial, sans-serif">
<Variable name="headerFont" description="Blog Header Font"
type="font" default="normal normal 210% Verdana, Arial, Sans-serif;"
value="italic bold 392% Arial, sans-serif">
<Variable name="descriptionFont" description="Blog Description
Font"
type="font" default="normal normal 210% Verdana, Arial, Sans-serif;"
value="italic bold 150% Arial, sans-serif">
<Variable name="sbHeaderFont" description="Sidebar Header
Font" type="font" default="normal normal 210% Verdana, Arial,
Sans-serif;" value="italic bold 165% Arial, sans-serif">
<Variable name="dateHeaderFont" description="Date Header Font"
type="font" default="normal normal 210% Verdana, Arial, Sans-serif;"
value="normal normal 101% Arial, sans-serif">
<Variable name="postHeaderFont" description="Post Header Font"
type="font" default="normal normal 210% Verdana, Arial, Sans-serif;"
value="italic bold 147% Arial, sans-serif">
*/
/* BODY
---------------------- */
body {
background-color: $mainBgColor;
/*
Substitute the URL for your chosen header URL and retire the forwardslashes
ad asteriscs. Image at this example from the original Underworld template of
Beautiful Beta http://beautifulbeta.blogspot.com/.
background: url(http://home.planet.nl/~hansoosting/images/bubblebg.jpg) repeat-x
fixed;
*/
margin: 0;
padding: 0;
text-align: center;
font: $bodyFont;
color: $textColor;
}
/* OUTER WRAPPER
----------------------- */
#outer-wrapper {
width: 98%;
margin: 0 1% 0 1%;
background-color: $mainBgColor;
border: 1px solid #cccccc;
}a:link {
color: $linkColor;
}
a:visited {
color: $visitedlinkColor;
}
a img {
border-width: 0;
}
/* HEADER
----------------------------------------------- */
#header-wrapper {
margin-top: 10px;
padding: 0;
background-color: transparent;
text-align: left;
}
#header {
width: 98%;
height: 100px;
background-color: $bodyBgColor;
/*
Substitute the URL for your chosen header URL and retire the forwardslashes
ad asteriscs. Image at this example from a header of http://mmana.blogspot.com
background: url(http://photos1.blogger.com/blogger2/1287/4081/1600/header_06.1.gif)
left;
/*
margin: 0 auto;
color: $headerTextColor;
padding: 0;
border: 3px solid $borderColor;
}
#header h1 {
padding-top: 10px;
margin: 0 14px .1em;
line-height: 1.2em;
font: $headerFont;
color: $headerTextColor;
}
#header a {
color: $headerTextColor;
text-decoration: none;
}
#header .description {
display: block;
margin: 10px; 14px;
padding: 0 0 40px;
line-height: 1.4em;
font: $descriptionFont;
color: $descriptionTextColor;
}
/* Content
----------------------------------------------- */
.clear {
clear: both;
}#content-wrapper {
width: 98%;
margin: 0 auto;
padding: 0 0 10px;
text-align: left;
background-color: $mainBgColor;
border: 1px solid $borderColor;
border-top: 0;
}
#main-wrapper {
margin-left: 1%;
width: 62%;
float: left;
background-color: transparent;
border: 1px solid #cccccc;
padding: 5px 5px 5px 5px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}
#left-sidebar-wrapper {
margin-left: 1%;
width: 16%;
float: left;
background-color: transparent;
border: 1px solid #cccccc;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}
#right-sidebar-wrapper {
margin-right: 1%;
width: 16%;
text-align:right;
float: right;
background-color: transparent;
border: 1px solid #cccccc;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}
/* Headings
----------------------------------------------- */
h2, h3 {
margin: 0;
}
/* POSTS
----------------------------------------------- */
.date-header {
margin: 2px 0 0;
font-weight: normal;
color: $dateHeaderColor;
font: $dateHeaderFont;
text-align: right;
border-bottom: 1px solid $borderColor;
}
.post
margin: 2px 2px 5px 2px;
padding: 10px 10px 10px 10px;
border: 1px solid #cccccc;
}
.post-title {
margin: 0 0 0 0;
padding: 5px;
font: $postHeaderFont;
color: $postHeaderColor;
line-height: 1.1em;
}
.post-title a, .post-title a:visited, .post-title strong {
text-decoration: none;
color: $postHeaderColor;
font: $postHeaderFont;
}
.post-footer {
/*font-size: 85%;*/
color: #999999 /*$textColor*/;
}
.post img {
padding: 4px;
border: 1px solid #cccccc;
}
.post blockquote {
margin: 1em 20px;
padding: 5px 5px;
border-top: 1px solid $borderColor;
border-bottom: 1px solid $borderColor;
background-color: $bqBgColor;
color: $bqTextColor;
}/* Comments
----------------------------------------------- */
#comments h4 {
margin: 1em 0;
color: $dateHeaderColor;
}
#comments h4 strong {
font-size: 110%;
}
#comments-block {
margin: 1em 0 1.5em;
line-height: 1.3em;
}
#comments-block dt {
margin: .5em 0;
}
#comments-block dd {
margin: .25em 0 0;
}
#comments-block dd.comment-footer {
margin: -.25em 0 2em;
line-height: 1.4em;
font-size: 78%;
}
#comments-block dd p {
margin: 0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}
.feed-links {
clear: both;
line-height: 2.5em;
}
#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
#blog-pager {
text-align: center;
}
/* Sidebar Content
----------------------------------------------- */
.sidebar h2 {
margin: 1.0em 0 .5em;
padding: 2px 2px;
background-color: $mainBgColor;
/*
background: url(http://home.planet.nl/~hansoosting/images/bubblestrip.jpg) top
left;
*/
font: $sbHeaderFont;
color: $sidebarTitleTextColor;
border: solid 1px double $mainBgColor;
}
.sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
.sidebar li {
margin: 0;
padding: 0 0 .5em 15px;
text-indent: -15px;
line-height: 1.0em;
}
.sidebar {
color: $textColor;
line-height:1.3em;
}
.sidebar .widget {
margin-bottom: 1em;
}
.sidebar .widget-content {
margin: 0 5px;
}
/* Profile
----------------------------------------------- */
.profile-img {
float: right;
margin: 2px;
padding: 0;
border: 3px solid #cccccc /*$borderColor*/;
}
.profile-data {
margin:0;
text-transform:uppercase;
letter-spacing:.1em;
font-weight: bold;
line-height: 1.6em;
font-size: 78%;
}
.profile-datablock {
margin:.5em 0 .5em;
}
.profile-textblock {
margin: 0.5em 0;
line-height: 1.6em;
}
/* Footer
----------------------------------------------- */
#footer {
clear: both;
text-align: right;
color: $textColor;
margin: 2px;
border: 1px solid #cccccc /*$borderColor*/;
}
#footer .widget {
margin:.5em;
padding-top: 20px;
font-size: 85%;
line-height: 1.5em;
text-align: left;
}
]]></b:skin>
<script src='http://www.anniyalogam.com/widgets/hackosphere.js' type='text/javascript'/>
</head>

+ ,

0 Comments:

Post a Comment



Subscribe to: Enviar comentarios (Atom)