فهرست منبع

Darken the nav dropdown menus and add a slight text shadow

This is to make the text easier to read when the site primary color is
on the lighter side.

Also increase the color intensity on the social icons in the footer.
Markus Ochel 12 سال پیش
والد
کامیت
ecb2fd8167
2فایلهای تغییر یافته به همراه15 افزوده شده و 11 حذف شده
  1. 8 6
      site/static/css/setup-theme.styl
  2. 7 5
      site/static/css/theme.styl

+ 8 - 6
site/static/css/setup-theme.styl

@@ -58,17 +58,19 @@ setupTheme($primaryColor = $blueColor, $secondaryColor = $lightGrey, $linkColor
       html.no-touch &:hover
       html.touch &:active
         background: darken($primaryColor, 10%)
+      &.open
+        background: darken($primaryColor, 10%)
     > ul
-      background: $primaryColor
+      background: darken($primaryColor, 10%)
       &:before
-        background: $primaryColor
+        background: darken($primaryColor, 10%)
       > li
         a
           html.no-touch &:hover
           html.touch &:active
-            background: darken($primaryColor, 5%)
+            background: darken($primaryColor, 14%)
           &.active
-            background: darken($primaryColor, 10%)
+            background: darken($primaryColor, 20%)
 
   .doc-nav
     > div
@@ -111,7 +113,7 @@ setupTheme($primaryColor = $blueColor, $secondaryColor = $lightGrey, $linkColor
       border-color: $primaryColor
     .social-icons
       a
-        color: $primaryColor
+        color: darken($primaryColor, 10%)
         html.no-touch &:hover
         html.touch &:active
-          color: darken($primaryColor, 10%)
+          color: darken($primaryColor, 20%)

+ 7 - 5
site/static/css/theme.styl

@@ -72,6 +72,7 @@
 
     &.open
       height: $iconSize+11
+      background: darken($primaryColor, 10%)
 
     span
       display: block
@@ -101,7 +102,8 @@
     list-style-type: none
     padding: 0
     margin: 0
-    background: $primaryColor
+    text-shadow: 0 1px 1px rgba(0,0,0,0.2)
+    background: darken($primaryColor, 10%)
     box-shadow(-4px 4px 0 rgba(0, 0, 0, 0.1))
     overflow-y: scroll
     overflow-x: hidden
@@ -119,10 +121,10 @@
 
         html.no-touch &:hover
         html.touch &:active
-          background: darken($primaryColor, 5%)
+          background: darken($primaryColor, 14%)
 
         &.active
-          background: darken($primaryColor, 10%)
+          background: darken($primaryColor, 20%)
 
         i
           margin-right: 0.5em
@@ -619,12 +621,12 @@ footer
       font-size: 30px
       line-height: 30px
       text-align: center
-      color: $primaryColor
+      color: darken($primaryColor, 10%)
       overflow: hidden
 
       html.no-touch &:hover
       html.touch &:active
-        color: darken($primaryColor, 10%)
+        color: darken($primaryColor, 20%)
 
   .footer-html