[SUCS Devel] site r694 - branches/imranh-redesign/sass
imranh at sucs.org
imranh at sucs.org
Thu Apr 23 08:53:04 BST 2015
Author: imranh
Date: 2015-04-23 08:52:55 +0100 (Thu, 23 Apr 2015)
New Revision: 694
Added:
branches/imranh-redesign/sass/_header.scss
branches/imranh-redesign/sass/_logo.scss
branches/imranh-redesign/sass/_menu.scss
branches/imranh-redesign/sass/_user-area.scss
Modified:
branches/imranh-redesign/sass/main.scss
Log:
Start using some features of sass and compass
Added: branches/imranh-redesign/sass/_header.scss
===================================================================
--- branches/imranh-redesign/sass/_header.scss (rev 0)
+++ branches/imranh-redesign/sass/_header.scss 2015-04-23 07:52:55 UTC (rev 694)
@@ -0,0 +1,14 @@
+ at import "compass/css3/images";
+
+#header {
+ height: 66px;
+ position: relative;
+ #background: linear-gradient(to bottom left, #f80, #f40);
+ @include background-image(linear-gradient(to bottom left, #f80, #f40));
+}
+
+ at import "logo.scss";
+
+ at import "menu.scss";
+
+ at import "_user-area.scss";
\ No newline at end of file
Added: branches/imranh-redesign/sass/_logo.scss
===================================================================
--- branches/imranh-redesign/sass/_logo.scss (rev 0)
+++ branches/imranh-redesign/sass/_logo.scss 2015-04-23 07:52:55 UTC (rev 694)
@@ -0,0 +1,5 @@
+#logo {
+ float: left;
+ padding-left: 20px;
+ margin-top: -5px;
+}
\ No newline at end of file
Added: branches/imranh-redesign/sass/_menu.scss
===================================================================
--- branches/imranh-redesign/sass/_menu.scss (rev 0)
+++ branches/imranh-redesign/sass/_menu.scss 2015-04-23 07:52:55 UTC (rev 694)
@@ -0,0 +1,80 @@
+#menu {
+ overflow: hidden;
+ position: absolute;
+ bottom: 0px;
+ left: 125px;
+
+ #menulist {
+ margin-bottom: 4px;
+
+ li {
+ color: #fff;
+ font-weight: bold;
+ display: inline;
+ list-style-type: none;
+ padding-right: 15px;
+ padding-left: 15px;
+ #padding-top: 10px;
+ padding-bottom: 4px;
+ border-top-left-radius: 10px;
+ border-top-right-radius: 10px;
+
+ a {
+ color: #FFF;
+ text-decoration: none;
+ text-decoration: bold;
+ }
+ }
+ }
+
+ #menu-active {
+ background: #414345;
+ color: #f60;
+ }
+}
+
+#submenu {
+ position: absolute;
+ width: 100%;
+ overflow: hidden;
+ margin-top: 66px;
+
+ #submenulist {
+ -webkit-margin-before: 0em;
+ background: #414345;
+ padding-top: 6px;
+ padding-bottom: 5px;
+ padding-left: 165px;
+
+ li {
+ background: #414345;
+ color: #fff;
+ font-weight: bold;
+ display: inline;
+ list-style-type: none;
+ padding-right: 15px;
+ padding-left: 15px;
+ padding-top: 6px;
+ padding-bottom: 5px;
+
+ a {
+ color: #FFF;
+ text-decoration: none;
+ text-decoration: bold;
+ }
+ }
+
+ #submenu-active {
+ background: #E9EAED;
+ color: #414345;
+ padding-top: 4px;
+ padding-bottom: 7px;
+ border-top-right-radius: 10px;
+ border-top-left-radius: 10px;
+
+ a {
+ color: #414345;
+ }
+ }
+ }
+}
\ No newline at end of file
Added: branches/imranh-redesign/sass/_user-area.scss
===================================================================
--- branches/imranh-redesign/sass/_user-area.scss (rev 0)
+++ branches/imranh-redesign/sass/_user-area.scss 2015-04-23 07:52:55 UTC (rev 694)
@@ -0,0 +1,12 @@
+#user-area {
+ text-align: right;
+ float: right;
+ color: #fff;
+ left: 100%;
+ margin-right: 10px;
+ margin-top: 15px;
+
+ #user-area a {
+ color: #fff;
+ }
+}
\ No newline at end of file
Modified: branches/imranh-redesign/sass/main.scss
===================================================================
--- branches/imranh-redesign/sass/main.scss 2015-04-23 06:17:48 UTC (rev 693)
+++ branches/imranh-redesign/sass/main.scss 2015-04-23 07:52:55 UTC (rev 694)
@@ -1,3 +1,6 @@
+ at import "compass/reset";
+ at import "compass/support";
+
body {
#background: linear-gradient(#f80,#f40);
background: #E9EAED;
@@ -5,119 +8,12 @@
font-family: Arial;
margin: 0px;
}
-#header {
- #border-top-left-radius: 15px;
- #border-top-right-radius: 15px;
- #border: 2px solid #fff;
- height: 66px;
- position: relative;
- #box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.25);
- #background: #f60;
- background: linear-gradient(to bottom left, #f80, #f40);
-}
-#logo {
- float: left;
- padding-left: 20px;
- margin-top: -5px;
-}
-#menu {
- overflow: hidden;
- position: absolute;
- bottom: 0px;
- left: 125px;
-}
-#menulist {
- margin-bottom: 4px;
-}
-#menulist li {
- color: #fff;
- font-weight: bold;
- display: inline;
- list-style-type: none;
- padding-right: 15px;
- padding-left: 15px;
- padding-top: 10px;
- padding-bottom: 5px;
- border-top-left-radius: 10px;
- border-top-right-radius: 10px;
-}
-#menulist li a {
- color: #FFF;
- text-decoration: none;
- text-decoration: bold;
-}
-#menulist #menu-active {
- #background: #fff;
- background: #414345;
- color: #f60;
-}
-#submenu {
- #-webkit-margin-before: 0em;
- position: absolute;
- #bottom: -45px;
- #left: 125px;
- width: 100%;
- #height: 92%;
- overflow: hidden;
- margin-top: 66px;
-}
-#submenulist {
- -webkit-margin-before: 0em;
- #text-align: center;
- background: #414345;
- padding-top: 6px;
- padding-bottom: 5px;
- padding-left: 165px;
-}
-#submenulist li {
- #background: #000;
- background: #414345;
- color: #fff;
- font-weight: bold;
- display: inline;
- list-style-type: none;
- padding-right: 15px;
- padding-left: 15px;
- padding-top: 6px;
- padding-bottom: 5px;
- #border-top-left-radius: 15px;
- #border-top-right-radius: 15px;
-}
-#submenulist li a {
- color: #FFF;
- text-decoration: none;
- text-decoration: bold;
-}
-#submenulist #submenu-active {
- background: #E9EAED;
- color: #414345;
- padding-top: 4px;
- padding-bottom: 7px;
- border-top-right-radius: 10px;
- border-top-left-radius: 10px;
-}
-#submenulist #submenu-active a {
- color: #414345;
-}
-#user-area {
- text-align: right;
- float: right;
- color: #fff;
- #position: absolute;
- #bottom: 0px;
- left: 100%;
- margin-right: 10px;
- margin-top: 15px;
-}
-#user-area a {
- color: #fff;
-}
+
+ at import "_header.scss";
+
#bodyer {
background: #E9EAED;
height: 87%;
- #width: 96.0%;
- #position: absolute;
- #box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.25);
margin-top: 30px;
padding-top: 1.25%;
padding-left: 2.5%;
@@ -125,12 +21,10 @@
}
#bodyer .panel {
padding: 20px 20px 20px 20px;
- #box-shadow: 1px 5px 10px 5px #888888;
background: #fff;
border-radius: 2px;
border: 0px;
box-shadow: 0 1px 6px 0 rgba(0,0,0,.12),0 1px 6px 0 rgba(0,0,0,.12);
- #margin-right: 75px;
}
#bodyer #leftside {
width: 70%;
@@ -139,8 +33,6 @@
#bodyer #bottomleftside {
float: left;
margin-top: 15px;
- #display: flex;
- #justify-content: center;
display: inline-flex;
}
#bodyer #bottomleftsidebox {
@@ -160,6 +52,4 @@
#footer {
display: none;
visibility: hidden;
- #background: #f80;
- #box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.25);
}
\ No newline at end of file
More information about the Devel
mailing list