diff options
| -rw-r--r-- | media/css/ie.css | 1 | ||||
| -rw-r--r-- | media/sass/ie.sass | 320 | ||||
| -rw-r--r-- | templates/base.html | 10 |
3 files changed, 325 insertions, 6 deletions
diff --git a/media/css/ie.css b/media/css/ie.css new file mode 100644 index 0000000..bb5b0a8 --- /dev/null +++ b/media/css/ie.css @@ -0,0 +1 @@ +body{max-width:61.75em;margin:0 auto}header[role="banner"]{text-align:left;clear:both;border-bottom:#201a11 2px solid;height:9.375em}header[role="banner"] h1,header[role="banner"] h2{float:left;padding-top:2.2em;background-position:left bottom;margin:0 !important}header[role="banner"] 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:7.3em;padding-left:15em}nav[role="navigation"] a{letter-spacing:1px}nav[role="navigation"] li{font-size:12px}#pagination{font-family:Helvetica, Verdana, sans-serif !important;font-size:1.125em}#archive{clear:both}#archive article{width:18.75em;float:left;text-align:justify}#archive article h1{text-align:left;font-size:1.125em;margin:1em 0 0.5em}#archive article .hyphenate{font-size:0.938em;line-height:1.438em}#archive article .dateline{text-align:left;margin-bottom:0.75em;font-size:0.65em}#archive .mid{margin:0 2.5em}article img{width:auto !important}.img{float:right}.img img{margin:0}.archive{padding-top:2em}.archive article{margin-bottom:2em;padding-bottom:2em;border:none !important}.archive h1,.archive p{width:41%;float:left;text-align:left;margin:0;font-size:1em}.archive h1{font-size:1.5em;line-height:1.3em;margin-top:0.15em;letter-spacing:0.5px}.archive .dateline{clear:left;margin:0.75em 0;font-size:0.688em}.archive .hyphenate{text-align:justify}.archive time{display:inline;float:right}#photo-galleries:after,#projects-page .top:after{content:".";display:block;height:0;clear:both;visibility:hidden}#page-nav{border:none;text-align:left;margin-top:2em}#breadcrumbs{margin-left:0}#breadcrumbs li{letter-spacing:1px}#photo-galleries li{float:left;width:291px;margin:0 1em 1em 1em}#photo-galleries li .figure img{width:100%}#photo-galleries .legend{width:97%;padding:1em;font-size:0.75em !important;line-height:95%}#map-canvas{width:47.5em;height:31.25em;float:right}.map-legend h4{margin-bottom:0.25em;letter-spacing:1px;font-size:0.875em}.map-legend li{display:block;font-size:0.875em;margin:3px 0}.map-legend li:after{content:""}.infowin h4{font:normal 1.3em Helvetica, Verdana, sans-serif;margin:0.5em 0}.infowin p{font-size:95%;overflow:auto}#projects-page .col{float:left;font-size:0.875em;margin:0 40px 0 0;width:360px}#projects-page .two{margin:0 0 0 3.5em;width:32em}#projects-page .top{padding-bottom:2em;margin-bottom:2em;border-bottom:1px solid #e3e3e3}#projects-page article p{margin:1em 0 0 0}article[role="main"] header,article[role="main"] #post-body,article[role="main"] footer,article[role="main"] #comments{width:35.625em;margin:3.5em 0 0 12em}article[role="main"] #post-body{margin-top:0}article[role="main"] #post-body .legend{width:96%;font-size:1em}article[role="main"] h1,article[role="main"] aside{text-align:left;margin:0 0 0.4em 0}article[role="main"] h1{font-size:1.875em}article[role="main"] p:nth-of-type(1){font-size:1.25em;line-height:28px}article[role="main"] #post-metadata{border-bottom:1px #201a11 dotted;margin-bottom:1em;margin-top:1.5em;padding:0.75em 0}article[role="main"] #post-metadata p{line-height:1.5em !important;margin:0}article[role="main"] #post-metadata a{color:#b53a04}article[role="main"] #page-navigation{text-transform:uppercase;font:normal 1.125em Helvetica, Verdana, sans-serif}article[role="main"] #page-navigation a{color:#b53a04}article[role="main"] #page-navigation li#next{float:right;padding-right:9em}article[role="main"] #page-navigation li#prev{float:left;padding-left:6em}.double article[role="main"] p:nth-of-type(1){font-size:1.063em;line-height:1.5em;margin:1em 0 0}.double article[role="main"] header{width:11.25em;float:left;margin-left:0}.double article[role="main"] header h1,.double article[role="main"] header aside{text-align:right;line-height:1.2em}.double article[role="main"] #post-body{margin:2em 0 0 1.25em;float:left;width:48.75em}.double article[role="main"] #post-body .col{float:left;width:23.125em}.double article[role="main"] #post-body .sec{margin-left:2.5em}.double article[role="main"] #post-body .narrow{width:35.625em;margin-left:-8px;margin-bottom:1em;clear:both}.double article[role="main"] #post-metadata{clear:both}#about article[role="main"] .content{width:35.625em;margin:0 0 0 12.4em}#about article[role="main"] h2{margin-left:8.2em}#about article[role="main"] p:nth-of-type(1){font-size:1.063em;line-height:1.5em}footer[role="contentinfo"]{font-family:Helvetica, Verdana, sans-serif;background:#201a11;height:3em;color:#888;margin:80px auto 0;font-size:1em;padding:0}footer[role="contentinfo"] li{float:left;text-transform:uppercase;line-height:3em;margin-top:0.75em;margin-left:8px}footer[role="contentinfo"] a{color:#888 !important}footer[role="contentinfo"] a:hover{color:#b53a04 !important}footer[role="contentinfo"] nav{border:none;margin:0 1em 0 0;padding:0;float:right}footer[role="contentinfo"] p{float:left;padding-left:8px;line-height:4em;margin-top:0.75em}.drop{font-size:4.8em;display:block;float:left;padding:38px 10px 5px 0;overflow:visible}.drop-small{font-size:2.9em;display:block;float:left;padding:19px 8px 5px 0;overflow:visible}.postpic,.postpicright{display:block;margin:0.3em 0.6em}.postpic{float:left;margin-left:0;margin-top:0.3em}.postpicright{float:right;margin-right:0}.postpicleft{float:left;margin:5px}.picfull{margin-top:20px}.picwide{border:10px solid #201a11;clear:both;margin:30px 0 30px -200px}.ie8 .drop{padding-top:28px}.ie7 footer[role="contentinfo"],.ie7 #projects-archive,.ie7 #writing-archive article,.ie7 #pagination,.ie7 #projects-archive .button{clear:both}.ie7 .top{height:90px}.ie7 nav[role="navigation"]{padding-top:6.2em;padding-left:3.5em;margin-left:90px !important} diff --git a/media/sass/ie.sass b/media/sass/ie.sass new file mode 100644 index 0000000..2937cf9 --- /dev/null +++ b/media/sass/ie.sass @@ -0,0 +1,320 @@ +@import _mixins.sass +//main content container +body + max-width: 61.75em + margin: 0 auto +header[role="banner"] + text-align: left + clear: both + border-bottom: $brown 2px solid + height: 9.375em + h1, h2 + float: left + padding-top: 2.2em + background-position: left bottom + margin: 0 !important + 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: 7.3em + padding-left: 15em + a + letter-spacing: 1px + li + font-size: 12px +//global +#pagination + font-family: Helvetica, Verdana, sans-serif !important + font-size: 1.125em +//homepage specific +#archive + clear: both + article + width: 18.75em + float: left + text-align: justify + h1 + text-align: left + font-size: 1.125em + margin: 1em 0 .5em + .hyphenate + font-size: .9375em + line-height: 1.4375em + .dateline + text-align: left + margin-bottom: .75em + font-size: .65em + .mid + margin: 0 2.5em + + +article img + width: auto !important + +.img + float: right + img + margin: 0 + +//writing archives +.archive + padding-top: 2em + article + margin-bottom: 2em + padding-bottom: 2em + border: none !important + h1, p + width: 41% + float: left + text-align: left + margin: 0 + font-size: 1em + h1 + font-size: 1.5em + line-height: 1.3em + margin-top: .15em + letter-spacing: .5px + .dateline + clear: left + margin: .75em 0 + font-size: .6875em + .hyphenate + text-align: justify + time + display: inline + float: right + + + + +#photo-galleries:after, #projects-page .top:after + content: "." + display: block + height: 0 + clear: both + visibility: hidden + +//breadcrumbs +#page-nav + border: none + text-align: left + margin-top: 2em +#breadcrumbs + margin-left: 0 + li + letter-spacing: 1px + + +//photo pages + +#photo-galleries li + float: left + width: 291px + margin: 0 1em 1em 1em + .figure img + width: 100% + +#photo-galleries .legend + width: 97% + padding: 1em + font-size: .75em !important + line-height: 95% + +//map page +#map-canvas + width: 47.5em + height: 31.25em + float: right + +.map-legend + h4 + margin-bottom: .25em + letter-spacing: 1px + font-size: .875em + li + display: block + font-size: .875em + margin: 3px 0 + li:after + content: "" +.infowin + h4 + font: normal 1.3em Helvetica, Verdana, sans-serif + margin: .5em 0 + p + font-size: 95% + overflow: auto +//projects page +#projects-page .col + float: left + font-size: .875em + margin: 0 40px 0 0 + width: 360px +#projects-page .two + margin: 0 0 0 3.5em + width: 32em +#projects-page .top + padding-bottom: 2em + margin-bottom: 2em + 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 + .legend + width: 96% + font-size: 1em + + 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 + #post-metadata + border-bottom: 1px $brown dotted + margin-bottom: 1em + margin-top: 1.5em + padding: .75em 0 + p + line-height: 1.5em !important + margin: 0 + a + color: $orange + #page-navigation + text-transform: uppercase + font: normal 1.125em Helvetica, Verdana, sans-serif + a + color: $orange + li#next + float: right + padding-right: 9em + li#prev + float: left + padding-left: 6em +// two col layout +.double article[role="main"] + p:nth-of-type(1) + font-size: 1.0625em /* 17px / 16px */ + line-height: 1.5em /* 24px / 16px */ + margin: 1em 0 0 + header + width: 11.25em + float: left + margin-left: 0 + h1, aside + text-align: right + line-height: 1.2em + #post-body + margin: 2em 0 0 1.25em + float: left + width: 48.75em + .col + float: left + width: 23.125em + .sec + margin-left: 2.5em + .narrow + width: 35.625em + margin-left: -8px + margin-bottom: 1em + clear: both + #post-metadata + clear: both +//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: 3em + color: #888888 + margin: 80px auto 0 + font-size: 1em + padding: 0 + li + float: left + text-transform: uppercase + line-height: 3em + margin-top: .75em + margin-left: 8px + a + color: #888888 !important + &:hover + color: $orange !important + nav + border: none + margin: 0 1em 0 0 + padding: 0 + float: right + p + float: left + padding-left: 8px + line-height: 4em + margin-top: .75em +.drop + font-size: 4.8em + display: block + float: left + padding: 38px 10px 5px 0 + overflow: visible + +.drop-small + font-size: 2.9em + display: block + float: left + padding: 19px 8px 5px 0 + overflow: visible +.postpic, .postpicright + display: block + margin: 0.3em 0.6em + +.postpic + float: left + margin-left: 0 + margin-top: 0.3em + +.postpicright + float: right + margin-right: 0 + +.postpicleft + float: left + margin: 5px + +.picfull + margin-top: 20px + +.picwide + border: 10px solid $brown + clear: both + margin: 30px 0 30px -200px + +.ie8 .drop + padding-top: 28px +.ie7 footer[role="contentinfo"], .ie7 #projects-archive, .ie7 #writing-archive article, .ie7 #pagination, .ie7 #projects-archive .button + clear: both +.ie7 .top + height: 90px +.ie7 nav[role="navigation"] + padding-top: 6.2em + padding-left: 3.5em + margin-left: 90px !important
\ No newline at end of file diff --git a/templates/base.html b/templates/base.html index 71e29b2..f63f2c0 100644 --- a/templates/base.html +++ b/templates/base.html @@ -8,7 +8,10 @@ <title>{% block pagetitle %}Luxagraf - Topografical Writings{% endblock %}</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> - + <!--[if IE]> + <script src="{{MEDIA_URL}}js/html5css3ie.min.js"></script> + <script src="{{MEDIA_URL}}js/css3-mediaqueries.js"></script> + <![endif]--> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" @@ -19,11 +22,6 @@ <link rel="stylesheet" href="{{MEDIA_URL}}css/print.css" media="print">{%endcomment%} - <!--[if IE]> - <link rel="stylesheet" - href="{{MEDIA_URL}}css/ie.css" - media="screen"> - <![endif]--> <link rel="shortcut icon" href="http://media.luxagraf.net/img/favicon.ico" type="image/vnd.microsoft.icon"> |