From: Ove Klykken Date: Thu, 24 Jul 2014 19:09:32 +0000 (-0400) Subject: Working on making the columns responsive. X-Git-Tag: VV1^2~74 X-Git-Url: http://cvs2.gaslightmedia.com/gitweb/?a=commitdiff_plain;h=96f5d9f079a41db1a2cd8b1d084f2f2276d7023d;p=web%2FCityofMI.git Working on making the columns responsive. Sub, subsub, and subsubsubs. Logo on top in Small. Toolbox images for Small Contact form made responsive --- diff --git a/css/contactform.css b/css/contactform.css old mode 100644 new mode 100755 index 9dedb38..2419e64 --- a/css/contactform.css +++ b/css/contactform.css @@ -34,17 +34,21 @@ text-align: right; padding-right: 10px; padding-top: 3px; - white-space:nowrap; - width: 140px; + /*white-space:nowrap; + max-width: 140px; */ } /*Right Cells */ .fieldcell { padding-left: 4px; - width: 250px; + /* max-width: 250px; */ } /* Misc */ -textarea {width: 95%; height: 100px; display:block;} +textarea { + width: 95%; + height: 5em; + display:block; + } /* WARNINGS */ #form-warning-top { diff --git a/styles.css b/styles.css index b8ee38d..183f674 100755 --- a/styles.css +++ b/styles.css @@ -1,4 +1,8 @@ -.inner-wrap>section>#wrapper { +nav.tab-bar a #logoTop { + margin-left: 60px; + max-height: 100%;} + +ShadowWhenNeeded { box-shadow: 0 0 10px rgba(0, 0, 0, .5); -webkit-box-shadow: 8px 0 6px -6px rgba(0, 0, 0, .5), -8px 0 6px -6px rgba(0, 0, 0, .5); @@ -118,8 +122,17 @@ a:hover { #home #toolbox { margin-left: 45px; } -#toolbox.nosideNav { - margin-left: 50px; +/* For Small */ +@media only screen { + #toolbox.nosideNav { + margin-left: 0; + } + } +/* For larger than Small */ +@media only screen and (min-width: 40.063em) { + #toolbox.nosideNav { + margin-left: 50px; + } } #toolbox h1, #toolbox h2 { @@ -135,6 +148,12 @@ a:hover { margin: 0 0 20px 20px; float: right; } +/* For Small */ +@media only screen { + .imageleft, .imageright { + float: none; + } + } .imagecaption { font-size: 12px; font-style: italic; @@ -288,15 +307,14 @@ a:hover { } /* Subnav */ #subnav { - width: 223px; + /* width: 223px; */ background-color: rgb(43, 133, 168); border: 2px solid white; box-shadow: 1px 1px 2px rgba(0, 0, 0, .5); + margin-bottom: 20px; } #subnav h2 { color: white; - font-family: 'Source Sans Pro', sans-serif; - font-weight: bold; font-size: 22px; text-align: center; } @@ -304,13 +322,15 @@ a:hover { color: white; display: block; text-decoration: none; + line-height: 1.1em; + padding: 3px 0; } #subnav a:hover { color: #9dc6af; text-shadow: 1px 1px #000; } #subnav a#current { - background: url(assets/subnavMarker.png) no-repeat top left; + background: url(assets/subnavMarker.png) no-repeat left top; padding-left: 14px; } #subnav ul, @@ -325,6 +345,30 @@ a:hover { #subnav li { display: block; } + +/* 2xsub */ +#subnav ul ul { + margin: 0; + } +#subnav ul ul a { + padding-left: 25px; + } +#subnav ul ul a#current { + padding-left: 25px; + background: url(assets/subnavMarker.png) no-repeat 11px top; + } +/* 3xsub */ +#subnav ul ul ul { + margin: 0; + } +#subnav ul ul ul a { + padding-left: 35px; + } +#subnav ul ul ul a#current { + padding-left: 35px; + background: url(assets/subnavMarker.png) no-repeat 22px top; + } +/* end subsub */ #main { margin-top: 16px; } diff --git a/templates/template.html b/templates/template.html index 275e026..3af3270 100755 --- a/templates/template.html +++ b/templates/template.html @@ -9,7 +9,7 @@ {topScripts:h} - + {if:isHomePage} @@ -18,10 +18,11 @@ {end:}
-