diff options
Diffstat (limited to 'media/sass')
| -rw-r--r-- | media/sass/_reset.sass | 73 | ||||
| -rw-r--r-- | media/sass/base.sass | 94 | ||||
| -rw-r--r-- | media/sass/dark.sass | 43 |
3 files changed, 126 insertions, 84 deletions
diff --git a/media/sass/_reset.sass b/media/sass/_reset.sass index a8100da..a06badd 100644 --- a/media/sass/_reset.sass +++ b/media/sass/_reset.sass @@ -1,56 +1,17 @@ -/* http://meyerweb.com/eric/tools/css/reset/ - v2.0b1 | 201101 - NOTE: WORK IN PROGRESS - USE WITH CAUTION AND TEST WITH ABANDON */ - -html, body, div, span, applet, object, iframe, -h1, h2, h3, h4, h5, h6, p, blockquote, pre, -a, abbr, acronym, address, big, cite, code, -del, dfn, em, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, -b, u, i, center, -dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, -table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, figcaption, figure, -footer, header, hgroup, menu, nav, section, summary, -time, mark, audio, video - margin: 0 - padding: 0 - border: 0 - outline: 0 - font-size: 100% - font: inherit - vertical-align: baseline - -/* HTML5 display-role reset for older browsers */ -article, aside, details, figcaption, figure, -footer, header, hgroup, menu, nav, section - display: block - -body - line-height: 1 -ol, ul - list-style: none - -blockquote, q - quotes: none - -blockquote:before, blockquote:after, -q:before, q:after - content: '' - content: none - -// remember to define visible focus styles! -//\:focus -// outline: ?????? - -/* remember to highlight inserts somehow! */ -ins - text-decoration: none -del - text-decoration: line-through - -table - border-collapse: collapse - border-spacing: 0 +ol, ul, li, dl + list-style: none + margin: 0 + padding: 0 + border: 0 + outline: 0 + background: transparent + +blockquote, q + quotes: none + +\:focus + outline: 0 + +header, section, footer, aside, article, nav + display: block + text-align: left diff --git a/media/sass/base.sass b/media/sass/base.sass index 5af846c..82b5634 100644 --- a/media/sass/base.sass +++ b/media/sass/base.sass @@ -43,7 +43,11 @@ a color: $brown &:hover color: $orange - +strong + font-weight: bold + +sup + font: normal .625em Helvetica, Verdana, sans-serif ul li display: inline margin: 0 .125em @@ -99,13 +103,13 @@ article h1 header[role="banner"] margin: 0 auto text-align: center - #logo h1 + h1 background: url('../img/tree.png') 0 0 no-repeat text-indent: -9999px width: 151px height: 84px margin: 0 auto - #logo h2 + h2 background: url('../img/text.png') 0 0 no-repeat text-indent: -9999px width: 184px @@ -262,6 +266,55 @@ footer[role="contentinfo"] border-bottom: 1px $brown dotted +#parks + margin-top: 36px + article + position: relative + display: block + margin-top: 36px + clear: both + margin-bottom: 72px + .figure + img + border: none + min-height: 5em + h1 + display: block + color: #888888 + padding: 10px 10px 10px 0px + background: $brown + +transparent_class + + color: white + margin: 0 + width: 100% + text-align: left + + .legend + display: block + padding: 10px 10px 10px 0px + background: $brown + +transparent_class + height: 45px + font-size: 10px + line-height: 16px + color: white + width: 100% + h2 + line-height: 36px + font-size: 18px + margin: 0 + padding: 0 + float: left + .buttons + display: block + clear: left + padding-bottom: 1em + + + + + /* ######### layout large ################*/ @media only screen and (min-width: 800px) @@ -274,20 +327,20 @@ footer[role="contentinfo"] clear: both border-bottom: $brown 2px solid height: 9.375em - #logo h1, #logo h2 + h1, h2 float: left padding-top: 2.2em background-position: left bottom margin: 0 !important - #logo h2 + h2 padding-top: 3.5em background: url('../img/text-wide.png') left bottom no-repeat !important margin-left: 1.7em !important nav[role="navigation"] width: 25em border: none - padding-top: 6.3em - padding-left: 13em + padding-top: 7.3em + padding-left: 15em a letter-spacing: 1px li @@ -353,6 +406,8 @@ footer[role="contentinfo"] margin-top: 2em #breadcrumbs margin-left: 0 + li + letter-spacing: 1px //photo pages @@ -403,15 +458,18 @@ footer[role="contentinfo"] border-bottom: 1px solid #E3E3E3 #projects-page article p margin: 1em 0 0 0 - //Permalink pages article[role="main"] header, #post-body, footer, #comments width: 35.625em margin: 3.5em 0 0 12em + #post-body + margin-top: 0 h1, aside text-align: left margin: 0 0 .4em 0 + h1 + font-size: 1.875em p:nth-of-type(1) font-size: 1.25em line-height: 28px @@ -433,11 +491,20 @@ footer[role="contentinfo"] li#prev float: left padding-left: 6em - + //About Page + #about article[role="main"] + .content + width: 35.625em + margin: 0 0 0 12.4em + h2 + margin-left: 8.2em + p:nth-of-type(1) + font-size: 1.063em + line-height: 1.5em footer[role="contentinfo"] font-family: Helvetica, Verdana, sans-serif background: $brown - height: 2.25em + height: 3em color: #888888 margin: 80px auto 0 font-size: 1em @@ -446,6 +513,7 @@ footer[role="contentinfo"] float: left text-transform: uppercase line-height: 3em + margin-top: .75em margin-left: 8px a color: #888888 !important @@ -453,16 +521,14 @@ footer[role="contentinfo"] color: $orange !important nav border: none - height: auto - width: 15em - margin: 0 + margin: 0 1em 0 0 padding: 0 float: right p float: left padding-left: 8px line-height: 4em - margin: 0 + margin-top: .75em .drop font-size: 4.8em display: block diff --git a/media/sass/dark.sass b/media/sass/dark.sass index 29ac968..4315d18 100644 --- a/media/sass/dark.sass +++ b/media/sass/dark.sass @@ -1,17 +1,18 @@ -//basic stuff +@import base.sass -$luxagraf_brown: #201a11 -$luxagraf_orange: #b53a04 + +$brown: #201a11 +$orange: #b53a04 *:focus - outline: $luxagraf_orange dotted thin + outline: $orange dotted thin body - background: $luxagraf_brown + background: $brown a text-decoration: none - color: $luxagraf_orange + color: $orange &:visited color: white text-decoration: none @@ -19,28 +20,42 @@ a color: white text-decoration: none -header +header[role="banner"] border-bottom: #cccccc 1px solid + margin-bottom: 1em a color: white !important &:hover - color: $luxagraf_orange unquote("!important") - #logo - background: url("../img/logo-dark.gif") no-repeat left bottom + color: $orange unquote("!important") + h1 + background: url('../img/tree-dark.png') left bottom no-repeat + h2 + background: url('../img/text-dark.png') left bottom no-repeat !important +.legend h2 + float: left + width: 40% + background: #f3f +.buttons + float: left + background: #fff + #breadcrumbs color: white a color: white &:hover - color: $luxagraf_orange - + color: $orange +article[role="main"] .geo a + color: white +article[role="main"] .geo a:hover + color: $orange footer color: #cccccc a color: #cccccc !important &:hover - color: $luxagraf_orange !important + color: $orange !important img &.postpic, &.postpicright @@ -58,7 +73,7 @@ aside section a color: #cccccc !important &:hover - color: $luxagraf_orange !important + color: $orange !important #post-metadata border-top: #555555 1px dotted |