aboutsummaryrefslogtreecommitdiff
path: root/.themes/classic/sass/partials/sidebar
diff options
context:
space:
mode:
authorBrandon Mathis <brandon@imathis.com>2011-07-18 15:33:11 -0400
committerBrandon Mathis <brandon@imathis.com>2011-07-18 15:33:11 -0400
commit0f2686eff7f23a996a2a35f712079ea3ac971cd9 (patch)
tree7b5508ebb8c05fb162b10e3c379239aa9e127d8f /.themes/classic/sass/partials/sidebar
parent4dfc5c1d67ab50752a38a69949f546475d1b3e7e (diff)
downloadmy_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.scss50
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;
+ }
+ }
+ }
+}