diff options
Diffstat (limited to 'theme/stylesheets')
| -rw-r--r-- | theme/stylesheets/website/dropdown.less | 44 | ||||
| -rw-r--r-- | theme/stylesheets/website/variables.less | 21 |
2 files changed, 40 insertions, 25 deletions
diff --git a/theme/stylesheets/website/dropdown.less b/theme/stylesheets/website/dropdown.less index 738499a..0cc1e8e 100644 --- a/theme/stylesheets/website/dropdown.less +++ b/theme/stylesheets/website/dropdown.less @@ -6,7 +6,7 @@ position: absolute; top: 100%; left: 0; - z-index: @zindex-dropdown; + z-index: @dropdown-zindex; display: none; // none by default, but block on "open" of the menu float: left; min-width: 160px; @@ -14,8 +14,8 @@ margin: 2px 0 0; // override default ul list-style: none; font-size: @font-size-base; - background-color: @header-dropdown-background; - border: 1px solid @sidebar-divider-color; + background-color: @dropdown-background; + border: 1px solid @dropdown-border-color; border-radius: @border-radius-base; .box-shadow(0 6px 12px rgba(0,0,0,.175)); background-clip: padding-box; @@ -63,7 +63,7 @@ top: 1px; border-left: 9px solid transparent; border-right: 9px solid transparent; - border-bottom: 9px solid @header-dropdown-background; + border-bottom: 9px solid @dropdown-background; } } @@ -78,7 +78,7 @@ .button { border: 0; background-color: transparent; - color: @header-button-color; + color: @dropdown-button-color; width: 100%; text-align: center; float: left; @@ -86,8 +86,7 @@ padding: 8px 4px; &:hover { - color: @header-button-hover-color; - background-color: @header-button-hover-background; + color: @dropdown-button-hover-color; } &:focus, &:hover { @@ -109,25 +108,24 @@ * Theme 1 */ -.color-theme-1{ +.color-theme-1 { .dropdown-menu{ - background-color: @header-dropdown-background-1; - border-color: @sidebar-divider-color-1; + background-color: @dropdown-background-1; + border-color: @dropdown-border-color-1; .dropdown-caret .caret-inner{ - border-bottom: 9px solid @header-dropdown-background-1; + border-bottom: 9px solid @dropdown-background-1; } .buttons { - border-color: @sidebar-divider-color-1; + border-color: @dropdown-divider-color-1; } .button { - color:@header-button-color-1; + color: @dropdown-button-color-1; &:hover{ - color:@header-button-hover-color-1; - background-color:@header-button-hover-background-1; + color: @dropdown-button-hover-color-1; } } } @@ -137,24 +135,24 @@ * Theme 2 */ -.color-theme-2{ +.color-theme-2 { .dropdown-menu{ - background-color: @header-dropdown-background-2; - border-color: @sidebar-divider-color-2; + background-color: @dropdown-background-2; + border-color: @dropdown-border-color-2; .dropdown-caret .caret-inner{ - border-bottom: 9px solid @header-dropdown-background-2; + border-bottom: 9px solid @dropdown-background-2; } .buttons { - border-color: @sidebar-divider-color-2; + border-color: @dropdown-divider-color-2; } .button { - color:@header-button-color-2; + color: @dropdown-button-color-2; + &:hover{ - color:@header-button-hover-color-2; - background-color:@header-button-hover-background-2; + color: @dropdown-button-hover-color-2; } } } diff --git a/theme/stylesheets/website/variables.less b/theme/stylesheets/website/variables.less index 42dfad4..4fba26f 100644 --- a/theme/stylesheets/website/variables.less +++ b/theme/stylesheets/website/variables.less @@ -18,7 +18,6 @@ @header-button-color: #ccc; @header-button-hover-color: #444; @header-button-hover-background: none; -@header-dropdown-background: @sidebar-background; // Navigation @navigation-color: @header-button-color; @@ -61,7 +60,12 @@ @content-color: #333333; // Dropdown -@zindex-dropdown: 100; +@dropdown-zindex: 100; +@dropdown-divider-color: @sidebar-divider-color; +@dropdown-background: @sidebar-background; +@dropdown-button-color: darken(@header-button-color, 15%); +@dropdown-border-color: @sidebar-divider-color; +@dropdown-button-hover-color: @header-button-hover-color; // Border Radius @border-radius-base: 1px; @@ -140,6 +144,19 @@ @sidebar-link-completed-weight-1: normal; @sidebar-link-completed-weight-2: normal; +// Dropdown +@dropdown-divider-color-1: @sidebar-divider-color-1; +@dropdown-background-1: @sidebar-background-1; +@dropdown-button-color-1: @header-button-color-1; +@dropdown-border-color-1: @sidebar-divider-color-1; +@dropdown-button-hover-color-1: @header-button-hover-color-1; + +@dropdown-divider-color-2: @sidebar-divider-color-2; +@dropdown-background-2: @sidebar-background-2; +@dropdown-button-color-2: @header-button-color-2; +@dropdown-border-color-2: @sidebar-divider-color-2; +@dropdown-button-hover-color-2: @header-button-hover-color-2; + // Page @page-color-1: #704214; @page-color-2: #a4b1b1; |