Add sb-sidenav-primary style #1
Conversation
We want to have a style that uses the primary color (blue, in this case) as the background color for the sidenav. To use, just add `sb-sidenav-primary` to existing sidenav.
| @@ -1,7 +1,7 @@ | |||
| @charset "UTF-8"; | |||
| /*! | |||
| * Start Bootstrap - SB Admin v7.0.7 (https://startbootstrap.com/template/sb-admin) | |||
| * Copyright 2013-2023 Start Bootstrap | |||
| * Copyright 2013-2024 Start Bootstrap | |||
There was a problem hiding this comment.
Just updated by the generation scripts.
| @@ -11076,6 +11076,35 @@ body { | |||
| background-color: #e9ecef; | |||
| } | |||
|
|
|||
| .sb-sidenav-primary { | |||
| @@ -4,7 +4,7 @@ block config | |||
| - var bodyClass = 'sb-nav-fixed' | |||
| - var pageTitle = 'Dashboard'; | |||
| - var index = true; | |||
| - var sidenavStyle = 'sb-sidenav-dark' | |||
| - var sidenavStyle = 'sb-sidenav-primary' | |||
There was a problem hiding this comment.
To preview it in this repo at index.html.
| @@ -0,0 +1,45 @@ | |||
| // | |||
| // Sidenav Primary | |||
There was a problem hiding this comment.
This is a new file for the sb-sidenav-primary style, based on sb-sidenav-dark.
| @@ -27,6 +27,15 @@ $sidenav-light-link-active-color: $primary; | |||
| $sidenav-light-icon-color: $gray-500; | |||
| $sidenav-light-footer-bg: $gray-200; | |||
|
|
|||
| // -- Sidenav Dark | |||
There was a problem hiding this comment.
New scss variables for our new style.
|
that was quick! you know what you're doing 😉 I think the blue is maybe a bit harsh, a bit too bright? The primary blue for action buttons isn't necessarily the blue that we want for a sidebar... I'll write a suggested line in a note |
| // Append .sb-sidenav-primary to .sb-sidenav to use | ||
|
|
||
| .sb-sidenav-primary { | ||
| background-color: $sidenav-primary-bg; |
There was a problem hiding this comment.
perhaps if we add below or in place of background-color:
background-image: linear-gradient(180deg, #4e73df 10%, #224abe 100%);that would bring back that slightly paler blue from the sb-admin-2 theme
|
just a thought about handling branches: perhaps the changes that bring back the sb-admin-2 theme styles could be kept here in this branch, without creating a PR against the master branch. This would allow us to create a PR against the upstream repo, so that if anyone else using the sb-admin theme/template finds it handy, it would be our contribution to the community? Or we could do both, create a PR against the upstream repo, but also pull into the master branch here and do any further development that is specifically for the LitCal project in the master branch after the general "community" fixes are in place. Thoughts? I figure we can handle any further developments just fine in any branch, seeing that jsdelivr can deliver from any branch of a repo on GitHub. You just need to create a tag from the branch and then load the tag: https://github.com/jsdelivr/jsdelivr?tab=readme-ov-file#load-any-github-release-commit-or-branch |
We want to have a style that uses the primary color (blue, in this case) as the background color for the sidenav.
To use, just add
sb-sidenav-primaryto existing sidenav.New Style:
Original:
