themes/freifunk-generic: add CSS for mobile devices
authorJo-Philipp Wich <jow@openwrt.org>
Fri, 17 Jun 2011 01:00:46 +0000 (01:00 +0000)
committerJo-Philipp Wich <jow@openwrt.org>
Fri, 17 Jun 2011 01:00:46 +0000 (01:00 +0000)
themes/freifunk-generic/htdocs/luci-static/freifunk-generic/mobile.css [new file with mode: 0644]
themes/freifunk-generic/luasrc/view/themes/freifunk-generic/header.htm

diff --git a/themes/freifunk-generic/htdocs/luci-static/freifunk-generic/mobile.css b/themes/freifunk-generic/htdocs/luci-static/freifunk-generic/mobile.css
new file mode 100644 (file)
index 0000000..0e5384d
--- /dev/null
@@ -0,0 +1,225 @@
+.high_res_only{
+       display:none !important;
+}
+
+#main_bg_pattern {
+       position:absolute;
+       background: url(images/PF_background_pattern.png) repeat-x;
+       top:0px;
+       left:0px;
+       width:980px;
+       z-index:0;              
+}
+
+#main_bg {
+    min-height:2000px;
+}
+
+#heading{
+       margin-left:285px !important;
+}
+
+#header{
+       padding-left:0px !important;
+       padding-bottom:24px;
+}
+
+               #maincontent .multiColumn {
+                       margin:1em 0px;
+                       width:100%;
+               }
+
+               #maincontent .multiColumn .first{
+                       width:100% !important;
+                       float:none !important;
+                       display:block !important;
+                       padding-right:0px;
+               }
+
+               #maincontent .multiColumn .second{
+                       width:100% !important;
+                       float:none !important;
+                       display:block !important;
+                       padding-right:0px;
+               }
+               #maincontent .multiColumn .terminateMultiColumn{
+                       clear:both;
+                       float:none;
+                       display:block;
+                       text-align:left !important;
+                       padding-top:2em;
+               }
+
+               #maincontent ul{
+                       margin-bottom:1em;
+               }
+
+
+
+/**** Begin iphone menu bar ****/
+
+#iphone_menu{
+       position:absolute;      
+       display:inline !important;
+       top:0px;
+       left:0px;
+       margin:0px;
+       padding:10px;
+       z-index:40 !important;
+}
+
+#iphone_menu_handles{
+       display:block;
+       font-size:60px;
+       font-weight:bold;
+       height:160px;
+}
+
+#iphone_menu_open{
+       display:inline;
+}
+
+#iphone_menu_close{
+       display:none;
+}
+
+#iphone_menu_joker{
+       display:none;
+       position:absolute;
+       right:5px;
+       top:5px;
+       border:none;
+       text-decoration:none;
+}
+
+.iphone_button{
+       display:inline !important;
+}
+.iphone_button table {
+       table-layout:fixed;
+       color:#ffffff;
+       border-collapse:collapse;
+       vertical-align:middle;
+}
+
+.iphone_button_content {
+       font-weight:bold;
+       padding: 0.2em 0.75em;
+}
+       /*** Begin  iphone menu items ***/
+                       #iphone_menu_items {
+                               display:none;
+                       }
+                       #iphone_menu_items table {
+                               border-collapse:collapse;
+                       }
+
+                       #iphone_menu_items  td {
+                               vertical-align:middle;
+                       }
+
+                       #iphone_menu_items .menu_item {
+                               font-size:65px;
+                               padding:15px 30px;
+                               line-height:1.5em;                      
+                       }
+
+                       #iphone_menu_items .menu_item table { 
+                               width:720px;
+                       }
+
+                       #iphone_menu_items .submenu_marker {
+                               font-size:65px;
+                               padding: 0px;
+                               line-height:1.5em;
+                       }
+
+                       #iphone_menu_items a {
+                               text-decoration:none;
+                               font-weight:bold;
+                               color:#ffffff;  
+                       }
+
+                       #iphone_menu_items a.active {
+                               color: #4f9ed3;
+                       }
+                       #iphone_menu_items li {
+                               min-height:100px;
+                               list-style:none;
+                       }
+
+       /***End iphone menu items ***/
+/**** End  iphone menu bar ****/
+
+
+
+
+#sidebar_container{
+       display:none;
+}
+
+#adbar_low_res_container{
+       display:block !important;
+}
+#main_content_container{
+       margin-top:50px !important;
+}
+
+.lt_spec{
+       padding:0px;
+       width:54px;
+       height:42px;
+       background:transparent url(images/lt_round.png) no-repeat 0% 0% !important;
+}
+
+#content {
+       margin-left:0px !important; 
+}
+
+#maincontent{
+       font-size:35px!important;
+}
+
+input[type=submit],
+.cbi-button,
+.cbi-button-reset,
+.cbi-button-save{
+       display:inline !important;
+       float:none !important;
+       padding:10px 30px !important;
+       margin: 0px 10px !important;
+       font-size:45px !important;
+       font-family: impact, sans-serif !important;
+       background:#ff8800 none !important;
+       border-color:#000000 !important;
+}
+
+.cbi-input-text,
+.cbi-input-select,
+.cbi-input-user,
+.cbi-input-password{
+       display:block !important;
+       font-size:35px  !important;
+       margin: 0 !important;
+       padding:0 !important;
+}
+
+.cbi-value-field{
+       font-size:35px;
+       margin:0 !important;
+       margin-bottom: 1em !important;
+       width:100%  !important; 
+}
+
+.cbi-section legend{
+       white-space:normal !important;
+}
+.cbi-section code{
+       font-size:24px;
+}
+
+.cbi-value-title{
+       font-size:35px;
+       font-weight:bold;
+       float:none !important;
+}
index 9dbcf9f..11c7de5 100644 (file)
@@ -68,6 +68,8 @@ require("luci.http").prepare_content("application/xhtml+xml")
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <meta http-equiv="Content-Script-Type" content="text/javascript" />
 <link rel="stylesheet" type="text/css" media="screen" href="<%=media%>/cascade.css" />
+<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="<%=media%>/mobile.css" type="text/css" />
+<link rel="stylesheet" media="handheld" href="<%=media%>/mobile.css" type="text/css" /> 
 <!--[if IE 7]><link rel="stylesheet" type="text/css" media="screen" href="<%=media%>/ie7.css" /><![endif]-->
 <% if node and node.css then %><link rel="stylesheet" type="text/css" media="screen" href="<%=resource%>/<%=node.css%>" />
 <% end -%>