From 0f2686eff7f23a996a2a35f712079ea3ac971cd9 Mon Sep 17 00:00:00 2001 From: Brandon Mathis Date: Mon, 18 Jul 2011 15:33:11 -0400 Subject: Refactored layout styles: 1. Now iPad vertical gets a collapsed sidebar with columns 2. Moved sidebar toggler styles from layout to sidebar/base 3. Added body class .sidebar-footer to support an always collapsed sidebar 4. Added $indented-lists (bool) for easily setting list indent preferences 5. Removed no-sidebar checking from sidebar-toggler, handled it through css. --- .themes/classic/sass/partials/sidebar/_base.scss | 50 ++++++++++++++++++++++++ 1 file changed, 50 insertions(+) (limited to '.themes/classic/sass/partials/sidebar') diff --git a/.themes/classic/sass/partials/sidebar/_base.scss b/.themes/classic/sass/partials/sidebar/_base.scss index 3b238a9b..b07dffac 100644 --- a/.themes/classic/sass/partials/sidebar/_base.scss +++ b/.themes/classic/sass/partials/sidebar/_base.scss @@ -21,6 +21,7 @@ aside[role=sidebar] { } ul { margin-bottom: 0.5em; + margin-left: 0; } li { list-style: none; @@ -47,3 +48,52 @@ aside[role=sidebar] { color: $sidebar-link-color-subdued-hover; } } + +@media only screen and (min-width: 768px) { + .toggle-sidebar { + outline: none; + position: absolute; right: -10px; top: 0; bottom: 0; + display: inline-block; + text-decoration: none; + color: mix($text-color-light, $sidebar-bg); + width: 9px; + cursor: pointer; + &:hover { + background: mix($sidebar-border, $sidebar-bg); + @include background(linear-gradient(left, rgba($sidebar-border, .5), rgba($sidebar-border, 0))); + } + &:after { + position: absolute; right: -11px; top: 0; + width: 20px; + font-size: 1.2em; + line-height: 1.1em; + padding-bottom: .15em; + @include border-bottom-right-radius(.3em); + text-align: center; + background: $main-bg $noise-bg; + border-bottom: 1px solid $sidebar-border; + border-right: 1px solid $sidebar-border; + content: "\00BB"; + text-indent: -1px; + } + .collapse-sidebar & { + text-indent: 0px; + right: -20px; + width: 19px; + &:hover { + background: mix($sidebar-border, $sidebar-bg); + } + &:after { + border-left: 1px solid $sidebar-border; + text-shadow: #fff 0 1px; + content: "\00AB"; + left: 0px; right: 0; + text-align: center; + text-indent: 0; + border: 0; + border-right-width: 0; + background: none; + } + } + } +} -- cgit v1.2.1