From 414bb01d2e5600742754d6452ca293fd14dbf492 Mon Sep 17 00:00:00 2001 From: Nick Downing Date: Tue, 1 Feb 2022 20:19:15 +1100 Subject: [PATCH] Consistency changes wrt nick_site, makes page footer slightly taller --- _lib/navbar.jst | 4 ++-- css/bootstrap/_custom.scss | 24 +++++++++++++++++++++--- css/bootstrap/_nav.scss | 7 +++++++ css/bootstrap/_variables.scss | 7 +++++-- 4 files changed, 35 insertions(+), 7 deletions(-) diff --git a/_lib/navbar.jst b/_lib/navbar.jst index edd7c80..848488d 100644 --- a/_lib/navbar.jst +++ b/_lib/navbar.jst @@ -259,7 +259,7 @@ return async (env, head, body, scripts) => { await body(_out) - footer.extend-background { + footer.page-footer.extend-background.py-5 { a(rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/") { img(alt="Creative Commons License" style="border-width:0;" src="/images/by-sa_3.0_88x31.png") {} } @@ -277,7 +277,7 @@ return async (env, head, body, scripts) => { p {'Example code fragments embedded within the text are placed in the public domain unless otherwise noted.'} - p {`Copyright © ${new XDate(env.now).getUTCFullYear()} ${copyright}.`} + p.mb-0 {`Copyright © ${new XDate(env.now).getUTCFullYear()} ${copyright}.`} } } } diff --git a/css/bootstrap/_custom.scss b/css/bootstrap/_custom.scss index c04669a..6de27a1 100644 --- a/css/bootstrap/_custom.scss +++ b/css/bootstrap/_custom.scss @@ -27,6 +27,22 @@ $footer-link-hover-color: darken($footer-link-color, 10%); padding-right: calc(.5 * (100vw - 100%)); } +// use within a grid column to extend the background to left/right +.grid-gutter-background { + margin-left: -.5 * $grid-gutter-width; + margin-right: -.5 * $grid-gutter-width; + padding-left: .5 * $grid-gutter-width; + padding-right: .5 * $grid-gutter-width; +} + +.sidebar { + position: sticky; + top: 0; + max-height: 100vh; + overflow-y: auto; + background-color: $gray-200; +} + // needed for svg icons inside buttons, card headers, etc // creates an inline element with correct width but no height // the svg is positioned within this to vertically centre on a capital letter @@ -72,9 +88,11 @@ $icon-sizes: ( margin-bottom: .5em; } -footer, .footer { - padding-top: 35px; - padding-bottom: 25px; +.page-header { + background-color: theme-color-level("primary", $alert-bg-level); +} + +.page-footer { background-color: $gray-400; a { color: $footer-link-color; diff --git a/css/bootstrap/_nav.scss b/css/bootstrap/_nav.scss index 82a3ec0..102bf7a 100644 --- a/css/bootstrap/_nav.scss +++ b/css/bootstrap/_nav.scss @@ -29,6 +29,13 @@ } } +// Nick (for sidebar) +.nav-link2 { + @include hover-focus() { + background: $nav-link-hover-bg2; // Nick + } +} + // // Tabs // diff --git a/css/bootstrap/_variables.scss b/css/bootstrap/_variables.scss index 5ed78b6..23f1a51 100644 --- a/css/bootstrap/_variables.scss +++ b/css/bootstrap/_variables.scss @@ -197,7 +197,8 @@ $grid-breakpoints: ( sm: 576px, md: 768px, lg: 992px, - xl: 1200px + xl: 1200px, + //xxl: 1500px // Nick (for sidebar) ) !default; @include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); @@ -212,7 +213,8 @@ $container-max-widths: ( sm: 540px, md: 720px, lg: 960px, - xl: 1140px + xl: 1140px, + //xxl: 1420px // Nick (for sidebar) ) !default; @include _assert-ascending($container-max-widths, "$container-max-widths"); @@ -706,6 +708,7 @@ $nav-link-padding-y: .5rem !default; $nav-link-padding-x: 1rem !default; $nav-link-disabled-color: $gray-600 !default; $nav-link-hover-bg: $gray-200 !default; // Nick +$nav-link-hover-bg2: $gray-400 !default; // Nick (for sidebar) $nav-tabs-border-color: $gray-300 !default; $nav-tabs-border-width: $border-width !default; -- 2.34.1