diff --git a/scss/bootstrap/_variables.scss b/scss/bootstrap/_variables.scss index 60ab925..8821ef6 100644 --- a/scss/bootstrap/_variables.scss +++ b/scss/bootstrap/_variables.scss @@ -1,6 +1,6 @@ // Color system $gray-100: hsl(210, 20%, 98%) !default; -$gray-200: hsl(210, 20%, 93%) !default; +$gray-200: hsl(210, 20%, 95%) !default; $gray-300: hsl(210, 20%, 89%) !default; $gray-400: hsl(210, 20%, 81%) !default; $gray-500: hsl(210, 20%, 71%) !default; @@ -73,7 +73,7 @@ $headings-font-weight: bold !default; // Make headings bold $lead-font-weight: normal; // Tables -$table-hover-bg-factor: .03 !default; +$table-hover-bg-factor: .02 !default; // Buttons + Forms diff --git a/scss/elements/_footer.scss b/scss/elements/_footer.scss index 65a2d9e..4f3fc1c 100644 --- a/scss/elements/_footer.scss +++ b/scss/elements/_footer.scss @@ -7,10 +7,7 @@ .footer-brand { margin-bottom: 0.75rem; font-weight: bold; - } - - p { - font-size: $font-size-base; + color: white; } .footer-header { diff --git a/scss/elements/_sidebar.scss b/scss/elements/_sidebar.scss index ae34273..ff411a6 100644 --- a/scss/elements/_sidebar.scss +++ b/scss/elements/_sidebar.scss @@ -8,15 +8,13 @@ flex-shrink: 0; min-height: 100vh; - width: 200px; - padding: 5px 10px; + width: 240px; + padding: 0.25rem 0.75rem; background-color: $white; - transition: none; - - &-brand { - margin: 10px; + .sidebar-brand { + margin: 0.75rem 1rem; font-size: 1.125rem; text-decoration: none; @@ -25,65 +23,28 @@ } } - &-header { - margin: 10px 10px 5px; - font-weight: bold; - color: $secondary; - } - - &-link { - padding: 10px 10px; - border-radius: 5px; - color: $secondary; - text-decoration: none; - - &:hover { - color: $primary; - background-color: $primary-50; - text-decoration: none; - } - } - - &-btn-collapse { - margin-top: 10px; - } - - .sidebar-collapsed-shown { - display: none; - } -} - -.sidebar-collapsed { - width: 60px; - padding: 5px 5px; - overflow-y: overlay; - - transition: width 0.25s; - - .sidebar-brand { - text-align: center; - - span { - display: none; - } - } - .sidebar-header { - display: none; + margin: 1rem 1rem 0.25rem; + color: $secondary; + font-weight: bold; + font-size: 0.875rem; } .sidebar-link { - padding: 10px 15px; + padding: 0.5rem 1rem; + border-radius: 0.5rem; + color: $secondary; + text-decoration: none; - span { - display: none; + &.active { + color: $primary; + background-color: $primary-50; + } + + &:hover { + color: $gray-800; + background-color: $gray-200; + text-decoration: none; } } - - .sidebar-collapsed-hidden { - display: none; - } - .sidebar-collapsed-shown { - display: inline; - } }