From df0cc5322437a963fbfef2b7aa15199c60ae7f24 Mon Sep 17 00:00:00 2001
From: Catouse <catouse@gmail.com>
Date: Mon, 9 Jun 2014 15:02:53 +0800
Subject: [PATCH]  * optimized style for mobile devices.  * ajsuted style of
 pager.

---
 lib/pager/pager.class.php               |  2 +-
 module/common/lang/en.php               |  2 +-
 module/common/lang/zh-cn.php            |  2 +-
 module/common/lang/zh-tw.php            |  2 +-
 module/common/view/header.lite.html.php |  1 -
 www/theme/default/style.css             | 72 ++++++++++++++++---------
 6 files changed, 52 insertions(+), 29 deletions(-)
diff --git a/lib/pager/pager.class.php b/lib/pager/pager.class.php
index 53d7764e2a..68fd4c82e6 100755
--- a/lib/pager/pager.class.php
+++ b/lib/pager/pager.class.php
@@ -479,7 +479,7 @@ EOT;
         $range[200]  = 200;
         $range[500]  = 500;
         $range[1000] = 1000;
-        $html = "<div class='dropdown'><a href='javascript:;' data-toggle='dropdown' id='_recPerPage' data-value='{$this->recPerPage}'>" . (sprintf($this->lang->pager->recPerPage, $this->recPerPage)) . "<span class='caret'></span></a><ul class='dropdown-menu'>";
+        $html = "<div class='dropdown dropup'><a href='javascript:;' data-toggle='dropdown' id='_recPerPage' data-value='{$this->recPerPage}'>" . (sprintf($this->lang->pager->recPerPage, $this->recPerPage)) . "<span class='caret'></span></a><ul class='dropdown-menu'>";
         foreach ($range as $key => $value)
         {
             $html .= '<li' . ($this->recPerPage == $value ? " class='active'" : '') .'>' . "<a href='javascript:submitPage(\"changeRecPerPage\", $value)'>{$value}</a>" . '</li>';
diff --git a/module/common/lang/en.php b/module/common/lang/en.php
index 8c69f7297b..f855ea511f 100644
--- a/module/common/lang/en.php
+++ b/module/common/lang/en.php
@@ -85,7 +85,7 @@ $lang->common->common = 'Common module';
 
 /* The main menu. */
 $lang->menu = new stdclass();
-$lang->menu->my       = '<i class="icon-home"></i> Dashboard|my|index';
+$lang->menu->my       = '<i class="icon-home"></i> <span>Dashboard</span>|my|index';
 $lang->menu->product  = 'Product|product|index';
 $lang->menu->project  = 'Project|project|index';
 $lang->menu->qa       = 'Test|qa|index';
diff --git a/module/common/lang/zh-cn.php b/module/common/lang/zh-cn.php
index 732cceecc0..04de3bde40 100644
--- a/module/common/lang/zh-cn.php
+++ b/module/common/lang/zh-cn.php
@@ -85,7 +85,7 @@ $lang->common->common = '公有模块';
 
 /* 主导航菜单。*/
 $lang->menu = new stdclass();
-$lang->menu->my       = '<i class="icon-home"></i> 我的地盘|my|index';
+$lang->menu->my       = '<i class="icon-home"></i><span> 我的地盘</span>|my|index';
 $lang->menu->product  = '产品|product|index';
 $lang->menu->project  = '项目|project|index';
 $lang->menu->qa       = '测试|qa|index';
diff --git a/module/common/lang/zh-tw.php b/module/common/lang/zh-tw.php
index c03bc1cdea..c383e36a87 100644
--- a/module/common/lang/zh-tw.php
+++ b/module/common/lang/zh-tw.php
@@ -85,7 +85,7 @@ $lang->common->common = '公有模組';
 
 /* 主導航菜單。*/
 $lang->menu = new stdclass();
-$lang->menu->my       = '<i class="icon-home"></i> 我的地盤|my|index';
+$lang->menu->my       = '<i class="icon-home"></i> <span>我的地盤</span>|my|index';
 $lang->menu->product  = '產品|product|index';
 $lang->menu->project  = '項目|project|index';
 $lang->menu->qa       = '測試|qa|index';
diff --git a/module/common/view/header.lite.html.php b/module/common/view/header.lite.html.php
index ae83a1f1a6..8cb707ab92 100755
--- a/module/common/view/header.lite.html.php
+++ b/module/common/view/header.lite.html.php
@@ -12,7 +12,6 @@ $clientTheme  = $this->app->getClientTheme();
 <head>
   <meta charset='utf-8'>
   <meta http-equiv='X-UA-Compatible' content='IE=edge'>
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <?php
   echo html::title($title . ' - ' . $lang->zentaoPMS);
 
diff --git a/www/theme/default/style.css b/www/theme/default/style.css
index 98b47412e4..4fec8d17b0 100644
--- a/www/theme/default/style.css
+++ b/www/theme/default/style.css
@@ -138,6 +138,27 @@ i[class^="icon-"].disabled,i[class*=" icon-"].disabled,i[class^="icon-"].disable
 .btn-icon.text-danger {color: #D2322D!important}
 .btn-icon.text-danger:hover {color: #7e0501!important}
 
+/* priority icons. */
+.pri1,.pri0,.pri2,.pri3,.pri4,.pri5,.pri6,.pri{display:inline-block;width: 18px;height: 18px;font-size: 12px;line-height: 14px;font-weight: bold; text-align: center; color: #272d68; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;border: 2px solid #272d68; font-family: arial, helvetica, clean, sans-serif;}
+.pri,.pri0{border-color: #ccc;color: #ccc;}
+.pri:before{content: '?'}
+.pri2{border-color: #25367e;color: #25367e}
+.pri3{border-color: #2c4a9b;color: #2c4a9b}
+.pri4{border-color: #475da8;color: #475da8}
+.pri5{border-color: #6989c5;color: #6989c5}
+.pri6{border-color: #9ebee5;color: #9ebee5}
+
+/* bug severity icons. */
+.severity,.severity1,.severity2,.severity3,.severity4,.severity5,.severity6{display:inline-block;width: 16px;height: 16px;line-height: 16px;font-weight: bold; text-align: center; font-size: 12px; color: #fff; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;font-family: arial, helvetica, clean, sans-serif;}
+.severity{background-color: #ccc;}
+.severity:before{content: '?'}
+.severity1 {background-color: #d71319;}
+.severity2 {background-color: #d83615;}
+.severity3 {background-color: #db7c12;}
+.severity4 {background-color: #dcbe1a;}
+.severity5 {background-color: #d0d836;}
+.severity6 {background-color: #99c323;}
+
 /* actionbox */
 .change-show:before{content: "\e661";}
 .change-hide:before{content: "\e662";}
@@ -538,7 +559,7 @@ body {font-size: 13px; color:#141414;padding-bottom: 40px;}
 .pager a:hover {color: #141414}
 .pager > .dropdown > a, .pager > i, .pager > a {display: inline-block; position: relative; padding: 5px; min-width: 25px; text-align: center; margin-left: -5px;}
 .pager .dropdown > a:hover, .pager > a:hover {background: #e5e5e5;}
-.pager .dropdown-menu {margin-top: 0; width: 212px; top: auto; bottom: 100%; margin-left: -5px; padding: 0;}
+.pager .dropdown-menu {margin-top: 0; width: 212px; margin-left: -5px; padding: 0;}
 .pager .dropdown-menu > li {display: block; float: left; width: 70px; border-right: 1px dotted #ddd; border-bottom: 1px dotted #ddd}
 #_pageID, #goto {display: none}
 
@@ -586,27 +607,30 @@ body {font-size: 13px; color:#141414;padding-bottom: 40px;}
 /* Select all and select reverse. */
 #allchecker, #reversechecker {padding-right: 5px;padding-left: 5px;}
 
-/*-----------------------ICONS --------------------*/
-/* Common icons. */
-.pri1,.pri0,.pri2,.pri3,.pri4,.pri5,.pri6,.pri{display:inline-block;width: 18px;height: 18px;font-size: 12px;line-height: 14px;font-weight: bold; text-align: center; color: #272d68; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;border: 2px solid #272d68; font-family: arial, helvetica, clean, sans-serif;}
-.pri,.pri0{border-color: #ccc;color: #ccc;}
-.pri:before{content: '?'}
-.pri2{border-color: #25367e;color: #25367e}
-.pri3{border-color: #2c4a9b;color: #2c4a9b}
-.pri4{border-color: #475da8;color: #475da8}
-.pri5{border-color: #6989c5;color: #6989c5}
-.pri6{border-color: #9ebee5;color: #9ebee5}
-
-/* Bug icons. */
-.severity,.severity1,.severity2,.severity3,.severity4,.severity5,.severity6{display:inline-block;width: 16px;height: 16px;line-height: 16px;font-weight: bold; text-align: center; font-size: 12px; color: #fff; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;font-family: arial, helvetica, clean, sans-serif;}
-.severity{background-color: #ccc;}
-.severity:before{content: '?'}
-.severity1 {background-color: #d71319;}
-.severity2 {background-color: #d83615;}
-.severity3 {background-color: #db7c12;}
-.severity4 {background-color: #dcbe1a;}
-.severity5 {background-color: #d0d836;}
-.severity6 {background-color: #99c323;}
-
-/* debug panel */
+/* hide debug panel */
 #debugPanel {display: none}
+
+/* === Responsive === */
+@media (max-width: 1199px)
+{ /* laptop */
+  #mainmenu .nav > li > a {padding: 7px 14px}
+}
+@media (max-width: 991px)
+{ /* taplet */
+  #mainmenu .nav > li > a {padding: 7px 12px}
+  #searchbox {width: 150px;}
+  #typeSelector .btn,  #objectSwitcher .btn{padding-left: 5px;}
+  #modulemenu .nav > li > a {padding: 0 5px;}
+}
+@media (max-width: 767px)
+{ /* phone */
+  #mainmenu .nav > li > a {padding: 5px 9px; font-size: 14px}
+  #mainmenu .nav > li > a > span {display: none}
+  #searchbox {width: 120px;}
+  #featurebar .nav {float: none}
+  #featurebar .nav > li > a {padding: 0 2px; font-size: 13px}
+}
+@media (max-width: 600px)
+{ /* small phone */
+  #searchbox {display: none}
+}
