From d8119f648e63a4728433e67e79d2a99296a8c2c1 Mon Sep 17 00:00:00 2001 From: godofdream Date: Thu, 16 Aug 2012 17:48:39 +0200 Subject: Added Mobile WebIf, some Layouting --- module/web/static/css/default/my.css | 93 +++++++++++++++++++++++++++++++++ module/web/static/css/default/queue.css | 54 ++++++++++--------- 2 files changed, 121 insertions(+), 26 deletions(-) create mode 100644 module/web/static/css/default/my.css (limited to 'module/web/static/css/default') diff --git a/module/web/static/css/default/my.css b/module/web/static/css/default/my.css new file mode 100644 index 000000000..2e73c1f35 --- /dev/null +++ b/module/web/static/css/default/my.css @@ -0,0 +1,93 @@ +.text-align-center { + text-align: center; +} +.text-align-right { + text-align: right; +} + +/** CSS for non-standard jQuery Mobile styles or Codiqa components **/ +.split-wrapper { + width: 100%; + min-height: 200px; + clear: both; +} +@media all and (min-width: 650px) { + .content-secondary { + text-align: left; + float: left; + width: 45%; + background: none; + padding: 1.5em 6% 3em 0; + margin: 0; + } + .content-secondary { + background: none; + border-top: none; + } + .content-primary { + width: 45%; + float: right; + margin-right: 1%; + padding-right: 1%; + } + .content-primary ul:first-child { + margin-top: 0; + } + .content-secondary ul.ui-listview, .content-secondary ul.ui-listview-inset { + margin: 0; + } + .content-secondary ul.ui-listview .ui-li-divider, .content-secondary ul.ui-listview .ui-li { + border-radius: 0px; + } + .content-secondary ul.ui-listview .ui-li { + border-left: 0; + border-right: 0; + } + .content-secondary h2 { + position: absolute; + left: -9999px; + } + .content-secondary .ui-li-divider { + padding-top: 1em; + padding-bottom: 1em; + } + .content-secondary { + margin: 0; + padding: 0; + } + +} +@media all and (min-width: 750px){ + .content-secondary { + width: 34%; + } + .content-primary { + width: 60%; + padding-right: 1%; + } + .content-secondary ul.ui-listview-inset { +} + +@media all and (min-width: 1200px){ + .content-secondary { + width: 30%; + padding-right:6%; + margin: 0px 0 20px 5%; + } + .content-secondary ul { + margin: 0; + } + .content-secondary { + margin: 0; + padding: 0; + } + .content-primary { + width: 50%; + margin-right: 5%; + padding-right: 3%; + } + .content-primary { + width: 60%; + } +} + diff --git a/module/web/static/css/default/queue.css b/module/web/static/css/default/queue.css index 23af09403..265432331 100644 --- a/module/web/static/css/default/queue.css +++ b/module/web/static/css/default/queue.css @@ -9,59 +9,61 @@ } .pack{ - border: 2px solid #000000; + border: 2px solid #CFCFCF; padding: 0; - -moz-border-radius: 10px; - border-radius: 10px; } .pack_header{ - background: url("../../img/default/main-wrapper-bg.png") repeat-x; + background-color: #CFCFCF; cursor: pointer; - border: 2px solid #000000; + border: 2px solid #CFCFCF; margin: 0px; height: 25px; - -moz-border-radius-topleft: 10px; - -moz-border-radius-topright: 10px; - -webkit-border-top-left-radius: 10px; - -webkit-border-top-right-radius: 10px; - border-top-left-radius: 10px; - border-top-right-radius: 10px; + } .pack_icon{ + display:inline-block; cursor: move; - height: 20px; - float: left; + height:20px; margin: 2px 7px; padding: 0 0 0 20px; background: url("../../img/default/icon_folder.png")no-repeat; } .pack_name{ - float: left; - vertical-align: middle; - color: #FFFFFF; + display:inline-block; + + top:0px; + margin: 0; + padding:0; + color: #000000; } .pack_progressbar_wrapper{ - float: left; - margin: 4px auto 4px auto; - text-align: center; + display:inline-block; vertical-align: middle; - width: 50%; - height: 15px; + height:9px; + width:50%; + right:15%; + margin-top: 6px; + position:absolute; } .pack_progressbar{ - height: 15px; + display:block; + width:100%; + height: inherit; + text-align: center; + margin: 0; } .pack_toolbar{ - height: 20px; - float: right; - padding: 0 0 0 20px; - margin: 2px 7px; + display:inline-block; + height:inherit; + right:0; + margin: 0; + } .pack_toolbar div{ -- cgit v1.2.3