diff options
| -rw-r--r-- | sleepmap-theme/static/css/main.css | 743 |
1 files changed, 254 insertions, 489 deletions
diff --git a/sleepmap-theme/static/css/main.css b/sleepmap-theme/static/css/main.css index 2dcf478..a8a2565 100644 --- a/sleepmap-theme/static/css/main.css +++ b/sleepmap-theme/static/css/main.css @@ -10,29 +10,25 @@ /* Imports */ @import url("reset.css"); @import url("pygment.css"); -/*@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz&subset=latin); */ /***** Global *****/ /* Body */ body { -/* background: #F5F4EF url('../images/bg.png'); */ - background: #000000 none repeat scroll 0 0; -/* color: #000305; */ - font-size: 87.5%; /* Base font size: 14px */ - font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; - line-height: 1.429; - margin: 0; - padding: 0; - text-align: left; - max-width: 1920px; - min-width: 1000px; + background: #000000 none repeat scroll 0 0; + font-size: 87.5%; /* Base font size: 14px */ + font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; + line-height: 1.429; + margin: 0; + padding: 0; + text-align: left; + max-width: 1920px; + min-width: 1000px; } body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote { margin: 0; padding: 0; border: 0; } - /* Headings */ h1 {font-size: 2em } h2 {font-size: 1.571em} /* 22px */ @@ -45,12 +41,13 @@ h1, h2, h3, h4, h5, h6 { font-weight: 400; line-height: 1.1; margin-bottom: .8em; -/* font-family: 'Yanone Kaffeesatz', arial, serif; */ font-family: arial, serif; } -h3, h4, h5, h6 { margin-top: .8em; } - +h3, h4, h5, h6 { + margin-top: .8em; +} + hr { border: 2px solid #EEEEEE; } /* Anchors */ @@ -71,7 +68,7 @@ a:hover, a:active, a.active, .active>a { h1 a:hover { background-color: inherit } - + /* Paragraphs */ p {margin-bottom: 1.143em;} @@ -89,22 +86,15 @@ ul { ol { list-style: outside decimal; -/* margin: 1em 0 1.5em 1.5em; */ } -/* -.post-info { - float:right; - margin:10px; - padding:5px; -} -*/ - .post-info abbr, .post-info a{ margin: 0px 0.3em 1px 0.3em; } -.readmore { float: right } +.readmore{ + float: right; +} dl {margin: 0 0 1.5em 0;} dt {font-weight: bold;} @@ -114,8 +104,8 @@ pre{background-color: #000; padding: 10px; color: #fff; margin: 10px; overflow: /* Quotes */ blockquote { - margin: 20px; - font-style: italic; + margin: 20px; + font-style: italic; } cite {} @@ -123,22 +113,22 @@ q {} /* Tables */ table {margin: .5em auto 1.5em auto; width: 98%;} - - /* Thead */ - thead th {padding: .5em .4em; text-align: left; border: thin solid grey;} - thead td {border: thin solid grey;} - - /* Tbody */ - tbody td {padding: .5em .4em; border: thin solid grey;} - tbody th {border: thin solid grey;} - - tbody .alt td {} - tbody .alt th {} - - /* Tfoot */ - tfoot th {} - tfoot td {} - + +/* Thead */ +thead th {padding: .5em .4em; text-align: left; border: thin solid grey;} +thead td {border: thin solid grey;} + +/* Tbody */ +tbody td {padding: .5em .4em; border: thin solid grey;} +tbody th {border: thin solid grey;} + +tbody .alt td {} +tbody .alt th {} + +/* Tfoot */ +tfoot th {} +tfoot td {} + /* HTML5 tags */ header, section, footer, aside, nav, article, figure { @@ -155,411 +145,178 @@ div.highlight pre { } /***** Layout *****/ -img.right figure.right {float: right; margin: 0 0 2em 2em;} -img.left, figure.left {float: right; margin: 0 0 2em 2em;} +img.right figure.right { + float: right; + margin: 0 0 2em 2em; +} + +img.left, figure.left { + float: right; + margin: 0 0 2em 2em; +} /* Header *****************/ + /* banner */ - #banner { - background-image: url("../images/header.jpg"); - border-radius: 10px; - margin: 0.5em 0.5em 0 0.5em; - max-width: 1920px; - width: 83%; - /* position: fixed; - z-index: 99; */ - } - #banner h1 { - font-size: 3.571em; - margin: 0 auto 0 auto; - padding: 20px 20px 20px 10px; -/* display: block; */ - position: relative; - } - #banner h1 a:link, #banner h1 a:visited { - /* color: #000305; */ - font-weight: bold; -/* margin: 0.5em; */ - text-decoration: none; - max-width: 250px; - min-width: 150px; - text-shadow: 1px 1px 1px #222; -/* width: 427px; - */ - } - #banner h1 a:hover, #banner h1 a:active { - background: none; - color: #C74350; - text-shadow: none; - } - - #banner h1 strong {font-size: 0.36em; font-weight: normal;} - - /* sidemenu */ + +#banner { + background-image: url("../images/header.jpg"); + border-radius: 10px; + margin: 0.5em 0.5em 0 0.5em; + max-width: 1920px; + width: 83%; +} + +#banner h1 { + font-size: 3.571em; + margin: 0 auto 0 auto; + padding: 20px 20px 20px 10px; + position: relative; +} + +#banner h1 a:link, #banner h1 a:visited { + font-weight: bold; + text-decoration: none; + max-width: 250px; + min-width: 150px; + text-shadow: 1px 1px 1px #222; +} + +#banner h1 a:hover, #banner h1 a:active { + background: none; + color: #C74350; + text-shadow: none; +} + +#banner h1 strong { + font-size: 0.36em; + font-weight: normal; +} + +/* sidemenu */ + #sidemenu { clear: both; -/* margin: 0 auto 0 auto; - padding: 2.5em 0 0 0; */ position: relative; float: left; -/* max-width: 200px; */ -/* min-width: 200px; */ width: 13%; } - /* Main Nav */ - #sidemenu nav { - background: #eee; -/* font-size: 1.143em; - line-height: 30px; */ - margin: 0.5em; - padding: 20px; - border-radius: 10px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - } - #sidemenu nav h2 { - margin-bottom:0; - margin-top: 0.8em; - } - #sidemenu nav h2.menuheader{ - margin:0; - } - #sidemenu nav ul ul { -/* display:none; */ - list-style: none; - margin: 0 auto; - } - -/* #sidemenu nav ul li:hover > ul { - display:block; - } -*/ - #sidemenu nav ul { - list-style: none; - margin: 0 auto; - padding: 0; -/* display: inline-table; - box-shadow: 0px 0px 9px rgba(0,0,0,0.15); - border-radius: 10px; */ - } - - #sidemenu nav ul:after { - content: ""; clear: both; display: block; - } - -/* #sidemenu nav ul li { - float: left; - } -*/ -/* - nav ul li:hover { - background: #4b545f; - background: linear-gradient(top, #4f5964 0%, #5f6975 40%); - background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%); - background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%); - } -*/ - #sidemenu nav ul li a { - display: block; - /*padding: 25px 40px; */ - text-decoration: none; - border-radius: 10px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - } - - #sidemenu nav ul ul { -/* background: #5f6975; */ - border-radius: 0px; - padding: 0; -/* position: absolute; - left: 100%; - top: 0%; */ - } - #sidemenu nav ul ul li { - float: none; -/* border-top: 1px solid #6b727c; - border-bottom: 1px solid #575f6a; */ - position: relative; - } - #sidemenu nav ul ul li a { - padding: 15px 40px; -/* color: #fff; */ - } -/* #sidemenu nav ul ul li:hover { - background: #db2d2b; - } - nav ul ul li a:hover { - background: #db2d2b; - } -*/ -/* nav ul ul ul { - position: absolute; left: 100%; top:0; - } */ -/* - nav ul ul li.active { - background: #db2d2b; - } -*/ - #sidemenu nav a:link, #sidemenu nav a:visited { - /* color: #fff; - display: inline-block; - height: 30px;*/ - padding: 0.23em 1.5em; - text-decoration: none; - } -/* #sidemenu nav a:hover, #sidemenu nav a:active, #sidemenu nav .active li:link - #sidemenu nav .active a:link, #sidemenu nav .active a:visited { - background: #db2d2b; - color: #fff; - text-shadow: none !important; - } - */ - #sidemenu nav ul li ul li a { - padding-left: 2em !important; - } -/* - #sidemenu nav li:first-child a { - border-top-left-radius: 5px; - -moz-border-radius-topleft: 5px; - -webkit-border-top-left-radius: 5px; - - border-bottom-left-radius: 5px; - -moz-border-radius-bottomleft: 5px; - -webkit-border-bottom-left-radius: 5px; - } -*/ -/* - Featured -*****************/ -#content { +#sidemenu nav { + background: #eee; margin: 0.5em; -/* background: #fff; */ + padding: 20px; border-radius: 10px; - -moz-border-radius: 10px; - -webkit-border-radius: 10px; - float: left; -/* margin: 1em 10px 2em 7%; */ -/* background: #fff; */ - overflow: hidden; -/* padding: 20px 20px; */ -/* min-width: 600px; */ - width: 70%; + -moz-border-radius: 5px; + -webkit-border-radius: 5px; } -/* - Extras -*****************/ -#sidebar { -/* float: right; */ - margin: 1em 1em 1em 0.5em; - background: #fff; - overflow: hidden; - padding: 20px 20px; -/* width: 15%; - */ - border-radius: 10px; - -moz-border-radius: 10px; - -webkit-border-radius: 10px; +#sidemenu nav h2 { + margin-bottom:0; + margin-top: 0.8em; } -#sidebar ul {list-style: none; margin: 0;} -#sidebar li {border-bottom: 1px solid #fff;} +#sidemenu nav h2.menuheader{ + margin:0; +} -#sidebar h2 { - color: #C74350; - font-size: 1.429em; - margin-top: .75em; - margin-bottom: .25em; - padding: 0 3px; +#sidemenu nav ul ul { + list-style: none; + margin: 0 auto; } -#sidebar a:link, #sidebar a { - color: #444; - display: block; - border-bottom: 1px solid #F4E3E3; +#sidemenu nav ul { + list-style: none; + margin: 0 auto; + padding: 0; +} + +#sidemenu nav ul:after { + content: ""; clear: both; display: block; +} + +#sidemenu nav ul li a { + display: block; + /*padding: 25px 40px; */ text-decoration: none; - padding: .3em .25em; + border-radius: 10px; + -moz-border-radius: 5px; + -webkit-border-radius: 5px; } -#sidebar li.active a {color: white;} -#sidebar li:last-child, -#sidebar li:last-child a {border: 0} +#sidemenu nav ul ul { + border-radius: 0px; + padding: 0; +} -/* -#sidebar .blogroll li:nth-last-child(2), -#sidebar .blogroll li:nth-last-child(3), -#sidebar .blogroll li:nth-last-child(2) a, -#sidebar .blogroll li:nth-last-child(3) a {border: 0;} -*/ +#sidemenu nav ul ul li { + float: none; + position: relative; +} -/*#sidebar a:hover, #sidebar a:active {color: #fff;} -*/ - /* Blogroll */ - #sidebar .blogroll { - width: 100%; - } - - #sidebar .blogroll li {float: left; margin: 0 20px 0 0; width: 185px;} - - - .social a { - background-repeat: no-repeat; - background-position: 3px 6px; - } - - /* Icons */ - .social a[href*='delicious.com']:before {content: url('../images/icons/delicious.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='digg.com']:before {content: url('../images/icons/digg.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='facebook.com']:before {content: url('../images/icons/facebook.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='atom.xml']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='last.fm']:before, .social a[href*='lastfm.']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='jamendo.com']:before {content: url('../images/icons/jamendo.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='stackoverflow.com']:before {content: url('../images/icons/stackoverflow.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='rss.xml']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='twitter.com']:before {content: url('../images/icons/twitter.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='github.com']:before {content: url('../images/icons/github.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='linkedin.com']:before {content: url('../images/icons/linkedin.png'); margin-right: 2px; vertical-align: -3px;} - .social a[href*='gitorious.org']:before {content: url('../images/icons/gitorious.png'); margin-right: 2px; vertical-align: -3px;} +#sidemenu nav ul ul li a { + padding: 15px 40px; +} + +#sidemenu nav a:link, #sidemenu nav a:visited { + padding: 0.23em 1.5em; + text-decoration: none; +} + +#sidemenu nav ul li ul li a { + padding-left: 2em !important; +} /* - About + Featured *****************/ -#about { - background: #fff; - font-style: normal; - margin-bottom: 2em; - overflow: hidden; - padding: 20px; - text-align: left; - width: 760px; - +#content { + margin: 0.5em; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; + float: left; + overflow: hidden; + width: 70%; } -#about .primary {float: left; width: 165px;} -#about .primary strong {color: #C64350; display: block; font-size: 1.286em;} -#about .photo {float: left; margin: 5px 20px;} +/* + Extras +*****************/ -#about .url:link, #about .url:visited {text-decoration: none;} +/* Blogroll */ +.blogroll { + width: 100%; +} -#about .bio {float: right; *width: 500px;} +.blogroll li { + float: left; + margin: 0 20px 0 0; + width: 185px; +} + + +.social a { + background-repeat: no-repeat; + background-position: 3px 6px; +} + +/* Icons */ +.social a[href*='delicious.com']:before {content: url('../images/icons/delicious.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='digg.com']:before {content: url('../images/icons/digg.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='facebook.com']:before {content: url('../images/icons/facebook.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='atom.xml']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='last.fm']:before, .social a[href*='lastfm.']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='jamendo.com']:before {content: url('../images/icons/jamendo.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='stackoverflow.com']:before {content: url('../images/icons/stackoverflow.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='rss.xml']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='twitter.com']:before {content: url('../images/icons/twitter.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='github.com']:before {content: url('../images/icons/github.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='linkedin.com']:before {content: url('../images/icons/linkedin.png'); margin-right: 2px; vertical-align: -3px;} +.social a[href*='gitorious.org']:before {content: url('../images/icons/gitorious.png'); margin-right: 2px; vertical-align: -3px;} -/* - Footer -*****************/ -#footer { - padding-bottom: 2em; - text-align: center; - clear: both; - width: 80%; - margin: 20px auto; -} - - #footer nav { - background: #000305; - font-size: 1.143em; - height: 40px; - line-height: 30px; - margin: 0 auto 2em auto; - padding: 0; - width: 90%; - border-radius: 5px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - } - - #footer nav ul ul { - display:none; - list-style: none; - margin: 0 auto; - } - - #footer nav ul li:hover > ul { - display:block; - } - - #footer nav ul { - list-style: none; - margin: 0 auto; - box-shadow: 0px 0px 9px rgba(0,0,0,0.15); - padding: 0 6px; - border-radius: 10px; - list-style: none; - position: absolute; - display: inline-table; - } - - #footer nav ul:after { - content: ""; clear: both; display: block; - } - - #footer nav ul li { - float: left; - } - #footer nav ul li:hover { - background: #4b545f; - background: linear-gradient(top, #4f5964 0%, #5f6975 40%); - background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%); - background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%); - } - - #footer nav ul li a { - display: block; - padding: 25px 40px; - text-decoration: none; - } - - #footer nav ul ul { - background: #5f6975; - border-radius: 0px; - padding: 0; - position: absolute; - top: 100%; - } - #footer nav ul ul li { - float: none; - border-top: 1px solid #6b727c; - border-bottom: 1px solid #575f6a; - position: relative; - } - #footer nav ul ul li a { - padding: 15px 40px; - color: #fff; - } - #footer nav ul ul li:hover { - background: #db2d2b; - } - #footer nav ul ul li a:hover { - background: #db2d2b; - } - #footer nav ul ul ul { - position: absolute; left: 100%; top:0; - } - #footer nav ul ul li.active { - background: #db2d2b; - } - - #footer nav a:link, #footer nav a:visited { - color: #fff; - display: inline-block; - height: 30px; - padding: 5px 1.5em; - text-decoration: none; - } -/* #footer nav a:hover, #footer nav a:active, #footer nav .active li:link - #footer nav .active a:link, #footer nav .active a:visited { - background: #C74451; - background: #db2d2b; - color: #fff; - text-shadow: none !important; - } -*/ /***** Sections *****/ /* Blog */ .hentry { @@ -569,87 +326,95 @@ img.left, figure.left {float: right; margin: 0 0 2em 2em;} background: linear-gradient(#efefff, #eee); border-radius: 10px; } -li:last-child .hentry, #content > .hentry {border: 0; margin: 0;} -/*#content > .hentry {padding: 1em 0;} */ -.hentry img{display : none ;} -.entry-title {font-size: 3em; margin-bottom: 10px; margin-top: 0;} -.entry-title a:link, .entry-title a:visited {text-decoration: none; color: #333;} -.entry-title a:visited {background-color: #fff;} + +li:last-child .hentry, #content > .hentry { + border: 0; + margin: 0; +} + +.hentry img{ + display: none; +} + +.entry-title{ + font-size: 3em; + margin-bottom: 10px; + margin-top: 0; +} + +.entry-title a:link, .entry-title a:visited { + text-decoration: none; + color: #333; +} + +.entry-title a:visited { + background-color: #fff; +} .hentry .post-info * {font-style: normal; float:left;} - /* Content */ - .hentry footer {padding-top: 3em; padding-bottom:1em} - .hentry footer address {display: inline;} - #posts-list footer address {display: block;} +/* Content */ - /* Blog Index */ - #posts-list {list-style: none; margin: 0;} -/* #posts-list .hentry {padding-left: 10px; position: relative;} */ +.hentry footer { + padding-top: 3em; + padding-bottom:1em +} -/* - #posts-list footer { - left: 10px; - position: relative; - float: left; - top: 0.5em; - width: 190px; - } -*/ +.hentry footer address { + display: inline; +} - /* About the Author */ - #about-author { - background: #f9f9f9; - clear: both; - font-style: normal; - margin: 2em 0; - padding: 10px 20px 15px 20px; - - border-radius: 5px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - } - - #about-author strong { - color: #C64350; - clear: both; - display: block; - font-size: 1.429em; - } - - #about-author .photo {border: 1px solid #ddd; float: left; margin: 5px 1em 0 0;} - - /* Comments */ - #comments-list {list-style: none; margin: 0 1em;} - #comments-list blockquote { - background: #f8f8f8; - clear: both; - font-style: normal; - margin: 0; - padding: 15px 20px; - - border-radius: 5px; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - } - #comments-list footer {color: #888; padding: .5em 1em 0 0; text-align: right;} - - #comments-list li:nth-child(2n) blockquote {background: #F5f5f5;} - - /* Add a Comment */ - #add-comment label {clear: left; float: left; text-align: left; width: 150px;} - #add-comment input[type='text'], - #add-comment input[type='email'], - #add-comment input[type='url'] {float: left; width: 200px;} - - #add-comment textarea {float: left; height: 150px; width: 495px;} - - #add-comment p.req {clear: both; margin: 0 .5em 1em 0; text-align: right;} - - #add-comment input[type='submit'] {float: right; margin: 0 .5em;} - #add-comment * {margin-bottom: .5em;} +#posts-list footer address { + display: block; +} + +/* Blog Index */ +#posts-list { + list-style: none; + margin: 0; +} + +/* Comments */ +#comments-list { + list-style: none; + margin: 0 1em; +} + +#comments-list blockquote { + background: #f8f8f8; + clear: both; + font-style: normal; + margin: 0; + padding: 15px 20px; + border-radius: 5px; + -moz-border-radius: 5px; + -webkit-border-radius: 5px; +} + +#comments-list footer {color: #888; padding: .5em 1em 0 0; text-align: right;} + +#comments-list li:nth-child(2n) blockquote {background: #F5f5f5;} + +/* Add a Comment */ +#add-comment label {clear: left; float: left; text-align: left; width: 150px;} +#add-comment input[type='text'], +#add-comment input[type='email'], +#add-comment input[type='url'] {float: left; width: 200px;} + +#add-comment textarea {float: left; height: 150px; width: 495px;} + +#add-comment p.req {clear: both; margin: 0 .5em 1em 0; text-align: right;} + +#add-comment input[type='submit'] {float: right; margin: 0 .5em;} +#add-comment * {margin-bottom: .5em;} /* Make codeblocks look prettier */ -table.highlighttable tbody tr td{padding:0;} -table.highlighttable tbody tr td div pre{margin:0;} -td.linenos{width: 30px} +table.highlighttable tbody tr td{ + padding:0; +} +table.highlighttable tbody tr td div pre{ + margin:0; +} +td.linenos{ + width: 30px +} |