diff options
author | Brandon Mathis <brandon@imathis.com> | 2011-07-18 15:33:11 -0400 |
---|---|---|
committer | Brandon Mathis <brandon@imathis.com> | 2011-07-18 15:33:11 -0400 |
commit | 0f2686eff7f23a996a2a35f712079ea3ac971cd9 (patch) | |
tree | 7b5508ebb8c05fb162b10e3c379239aa9e127d8f /.themes/classic/sass/partials/sidebar | |
parent | 4dfc5c1d67ab50752a38a69949f546475d1b3e7e (diff) | |
download | my_new_personal_website-0f2686eff7f23a996a2a35f712079ea3ac971cd9.tar.xz my_new_personal_website-0f2686eff7f23a996a2a35f712079ea3ac971cd9.zip |
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.
Diffstat (limited to '.themes/classic/sass/partials/sidebar')
-rw-r--r-- | .themes/classic/sass/partials/sidebar/_base.scss | 50 |
1 files changed, 50 insertions, 0 deletions
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; + } + } + } +} |