style update

diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css
index 9ded4172109fbfdf028423b29122dd8be07b8963..9b40050372d7cfbb52a91050ad37b992a3f9598f 100644 (file)
--- a/view/theme/quattro/style.css
+++ b/view/theme/quattro/style.css
@@ -1,14 +1,14 @@
 /**
  * Fabio Comuni <http://kirgroup.com/profile/fabrixxm>
  **/
-/* fonts */
 /* global */
 body {
   font-family: Liberation Sans, helvetica, arial, clean, sans-serif;
   font-size: 12px;
-  background-color: #FFFFFF;
+  background-color: #ffffff;
   color: #2d2d2d;
   margin: 0px;
+  display: table-row;
 }
 a, a:visited, a:link {
   color: #005c94;
@@ -46,13 +46,15 @@ a:hover {
 /* header */
 header {
   position: fixed;
-  left: 0px;
+  left: 43%;
+  right: 43%;
   top: 0px;
   margin: 0px;
   padding: 0px;
-  width: 100%;
-  height: 12px;
-  color: #FFFFFF;
+  /*width: 100%; height: 12px; */
+
+  z-index: 110;
+  color: #ffffff;
 }
 header #site-location {
   /*font-size:8px;
@@ -64,6 +66,27 @@ header #site-location {
 
   display: none;
 }
+header #banner {
+  text-align: center;
+  width: 100%;
+}
+header #banner a,
+header #banner a:active,
+header #banner a:visited,
+header #banner a:link,
+header #banner a:hover {
+  color: #ffffff;
+  text-decoration: none;
+  outline: none;
+  vertical-align: bottom;
+}
+header #banner #logo-img {
+  height: 22px;
+  margin-top: 5px;
+}
+header #banner #logo-text {
+  font-size: 22px;
+}
 /* nav */
 nav {
   width: 100%;
@@ -71,15 +94,20 @@ nav {
   position: fixed;
   left: 0px;
   top: 0px;
+  padding: 0px;
   background-color: #0e232e;
-  color: #FFFFFF;
+  color: #ffffff;
+  z-index: 100;
+  -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
+  -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
+  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
 }
 nav a,
 nav a:active,
 nav a:visited,
 nav a:link,
 nav a:hover {
-  color: #FFFFFF;
+  color: #ffffff;
   text-decoration: none;
   outline: none;
 }
@@ -157,14 +185,17 @@ nav #nav-notifications-linkmenu.selected .icon.s22.notify {
 ul.menu-popup {
   position: absolute;
   display: none;
-  width: auto;
-  background: #FFFFFF;
+  width: 10em;
+  background: #ffffff;
   color: #2d2d2d;
   margin: 0px;
   padding: 0px;
   list-style: none;
   border: 3px solid #364e59;
   z-index: 100000;
+  -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+  -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
+  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
 }
 ul.menu-popup a {
   display: block;
@@ -204,4 +235,14 @@ ul.menu-popup .empty {
   display: block;
 }
 /* aside */
+aside {
+  display: table-cell;
+  width: 200px;
+  padding: 50px 10px 0px 20px;
+}
 /* section */
+section {
+  display: table-cell;
+  width: 800px;
+  padding: 50px 20px 0px 10px;
+}

diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less
index a2c1a1eae48d2cf11b8a74e990cb678532a4bf33..1444ffdc195cec18182f2c3375a84d8a980a921f 100644 (file)
--- a/view/theme/quattro/style.less
+++ b/view/theme/quattro/style.less
@@ -34,9 +34,7 @@
 @Grey4:rgb(102,102,102);
 @Grey5:rgb(45,45,45);
 
-
- 
-/* fonts */
+///* fonts */
 // @font-face {  
 //   font-family: "LiberationSans";  
 //   src: local("Liberation Sans"),url( LiberationSans-Regular.ttf ) format("truetype");
@@ -59,9 +57,16 @@
 body {
        font-family: Liberation Sans,helvetica,arial,clean,sans-serif;
        font-size: 12px;
-       background-color: #FFFFFF;
+       background-color: @Grey1;
        color: @Grey5;
        margin: 0px;
+       display:table-row;
+}
+
+.shadow(@x: 0px, @y: 5px){
+   -webkit-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7);
+   -moz-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7);
+   box-shadow:@x @y 10px rgba(0, 0, 0, 0.7);
 }
 
 .rounded(@tr: 5px, @tl: 5px, @bl: 5px, @br: 5px){
@@ -108,10 +113,11 @@ a:hover {text-decoration: underline; }
 
 /* header */
 header {
-       position: fixed; left: 0px; top: 0px;
+       position: fixed; left: 43%; right: 43%; top: 0px;
        margin: 0px; padding: 0px;
-       width: 100%; height: 12px; 
-       color: #FFFFFF;
+       /*width: 100%; height: 12px; */
+       z-index: 110;
+       color: @Grey1;
        #site-location {
                /*font-size:8px;
                float:left;
@@ -121,15 +127,27 @@ header {
                .roundbottom()*/
                display: none;
        }
+       
+       #banner {
+               
+           text-align: center;
+               width: 100%;
+               a, a:active, a:visited, a:link, a:hover { color: @Grey1; text-decoration: none; outline: none; vertical-align: bottom; }
+               #logo-img { height: 22px; margin-top:5px;}
+               #logo-text { font-size: 22px }
+       }
 }
 /* nav */
 nav { 
        width: 100%; height: 32px;
        position: fixed; left: 0px; top: 0px;
+       padding: 0px;
        background-color: @Metalic4;
-       color: #FFFFFF;
+       color: @Grey1;
+       z-index: 100;
+       .shadow(0px, 0px);
 
-               a, a:active, a:visited, a:link, a:hover { color: #FFFFFF; text-decoration: none; outline: none;  }
+               a, a:active, a:visited, a:link, a:hover { color: @Grey1; text-decoration: none; outline: none;  }
 
                ul {
                        margin: 0px;
@@ -200,15 +218,17 @@ nav {
 ul.menu-popup {
        position: absolute;
        display: none;
-       width: auto;
-       background: #FFFFFF;
+       width: 10em;
+       background: @Grey1;
        color: @Grey5;
        margin: 0px;
        padding: 0px;
        list-style: none;
        border: 3px solid @Metalic3;
        z-index: 100000;
-               
+       
+       .shadow();
+       
                a { display: block; color: @Grey5; padding: 5px 10px;}
                a:hover { background-color: @Metalic1; }
                .menu-sep  { border-top: 1px solid @Metalic2; }
@@ -232,7 +252,15 @@ ul.menu-popup {
 
 
 /* aside */
-// aside { display: none; }
+aside { 
+       display: table-cell;
+       width: 200px;
+       padding:50px 10px 0px 20px;
+}
 
 /* section */
-// section { display: none;}
+section { 
+       display: table-cell;
+       width: 800px;
+       padding:50px 20px 0px 10px;
+}