From f6bf804f1af5ca8edb51002c1171d2af11bbb2cf Mon Sep 17 00:00:00 2001 From: Samantha Doherty Date: Tue, 19 Oct 2010 12:27:50 -0400 Subject: [PATCH] Quick mobile stylesheet for shiny theme. --- theme/shiny/css/mp-screen.css | 181 +++++++++++++++++++++++++++++++++- 1 file changed, 180 insertions(+), 1 deletion(-) diff --git a/theme/shiny/css/mp-screen.css b/theme/shiny/css/mp-screen.css index c9fb6dcc4f..85e46c69fd 100644 --- a/theme/shiny/css/mp-screen.css +++ b/theme/shiny/css/mp-screen.css @@ -1,7 +1,186 @@ -/* just a placeholder for now */ +/* mobile style */ + +body { + background-image: none; + min-width: 0; +} + +#wrap { + margin: 0; + padding: 0; + min-width:0; + max-width:100%; +} + +#header { + width: 96%; + padding: 0 2%; + padding-top: 20px; +} + +.user_in #header { + padding-top: 40px; +} + +address { +margin:1em 0 0 0; +float:left; +width:100%; +} address img + .fn { display:block; margin-top:1em; + margin-right: 10px; +clear: left; float:left; } + +#site_nav_global_primary { + margin:0; + margin-left: -2%; + width: 94%; + padding: 2%; + height: auto; + position:absolute; + top:0; + left:0; + background: #000; + font-size: 1em; + letter-spacing: 0em; +} + +#site_nav_global_primary li { + margin-left:0; + margin-right:10px; + float:left; + font-size:0.9em; + padding: 2px 4px; + line-height: 1em; +} + +#site_nav_global_primary li a { + color: #fff !important; +} + +#form_notice { + float: left; + margin-left: -10px; + width: 300px; + padding: 4px; +} + +#form_notice textarea { + width: 210px; + height: 50px; + padding: 4px; +} + +#notice_text-count { +position:absolute; +bottom:2px; + left: 175px; + font-size: 0.8em; +z-index:9; +} + +/*input type=file no good in +iPhone/iPod Touch, Android, Opera Mini Simulator +*/ +#form_notice #notice_text-count + label, +#form_notice label[for="notice_data-attach"] { +display:none; +} +#form_notice #notice_data-attach { +position:static; +clear:both; +width:65%; +height:auto; +display:block; +z-index:9; +padding:0; +margin:0; +background:none; +opacity:1; +} + +#form_notice #notice_action-submit { +text-align:center; + left: 230px; + top: 34px; + width: 70px; + font-size: 0.8em; +} + +#site_nav_local_views { + position: relative; + z-index: 9; + float: left; + margin: 0px 10px 2px 0px; + width: auto; +} + +#site_nav_local_views li { + width: auto; + text-align: left; +} + +#site_nav_local_views a { + background: none; + display:block; + float: left; + padding: 4px; + margin: 0px 10px 10px 0px; + border: none; + font-size: 0.9em; + font-weight: normal; + letter-spacing: 0em; + text-transform: uppercase; + color: #f2f2f2 !important; + background-color: #444; + text-shadow: 0px 1px 0px rgba(0,0,0,0.8); + border-radius: 4px; + -moz-border-radius: 4px; + -webkit-border-radius: 4px; +} + +#site_nav_local_views li:first-child a { + border-radius: 4px; + -moz-border-radius: 4px; + -webkit-border-radius: 4px; +} + +#site_nav_local_views a:hover { + background: none; + background-color: #b3b3b3; +} + +#site_nav_local_views .current a { + background: none; + display: inline; + color: #4d4d4d !important; + box-shadow: 1px 1px 1px rgba(0,0,0,0.5); + -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.5); + -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.5); + border-bottom: 1px solid #fff; + text-shadow: 1px 1px 0px rgba(0,0,0,0.2); + background-color: #e2e2e2; + text-decoration: none; +} + +#core { + width: 100%; + margin: 0; +} + +#content { + width: 96%; + padding: 10px 2%; + margin: 0; + min-height: auto; +} + +#footer { + margin: 10px 0px 0px 0px; + padding: 4px; +}