Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dark mode: Navbar Color Schemes #2412

Merged

Conversation

julien-deramond
Copy link
Contributor

@julien-deramond julien-deramond commented Dec 13, 2023

Description

This PR tackles the following sub-task:

Check that tasks in #2140 have been done. This issue tracks dark mode reverts we'll need to do when the dark mode will be implemented:
Revisit this Bootstrap section (https://getbootstrap.com/docs/5.3/components/navbar/#color-schemes) in Boosted which is hidden for now but could work when we'll get rid of .navbar-dark and replace it with data-bs-theme="dark"

This idea is to render the examples to show how .navbar-dark is no longer useful and how it works now with the data-bs-theme attribute.
Please note that these 3 examples are not exactly the ones from Bootstrap and are slightly adapted to look like actual Boosted navbars.
I haven't add them into a <details><summary> section since the whole page it not compatible with ODS rules.

Live preview

@julien-deramond julien-deramond added the color mode Temporary label to highlight color mode issues label Dec 13, 2023
Copy link

netlify bot commented Dec 13, 2023

Deploy Preview for boosted ready!

Name Link
🔨 Latest commit e242805
🔍 Latest deploy log https://app.netlify.com/sites/boosted/deploys/65818d37702d4500088abb34
😎 Deploy Preview https://deploy-preview-2412--boosted.netlify.app/docs/5.3/components/navbar
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@julien-deramond julien-deramond force-pushed the main-jd-dark-mode-navbar-color-schemes branch 3 times, most recently from 24f2ffc to 1e555ae Compare December 13, 2023 20:00
Copy link
Member

@louismaximepiton louismaximepiton left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Our mobile version of this part of the doc seems better than Bs!
image

Take the comments below into account only if you want to clean a bit this page, otherwise, looks good to me

site/content/docs/5.3/components/navbar.md Outdated Show resolved Hide resolved
site/content/docs/5.3/components/navbar.md Outdated Show resolved Hide resolved
site/content/docs/5.3/components/navbar.md Outdated Show resolved Hide resolved
@julien-deramond julien-deramond force-pushed the main-jd-dark-mode-navbar-color-schemes branch from 1e555ae to bb8cb44 Compare December 15, 2023 08:36
@julien-deramond julien-deramond force-pushed the main-jd-dark-mode-navbar-color-schemes branch from bb8cb44 to d0e467f Compare December 18, 2023 11:23
@julien-deramond julien-deramond force-pushed the main-jd-dark-mode-navbar-color-schemes branch from 0643af7 to 0a49ef0 Compare December 19, 2023 12:27
@julien-deramond julien-deramond merged commit 2380662 into main-jd-dark-mode Dec 19, 2023
11 of 12 checks passed
@julien-deramond julien-deramond deleted the main-jd-dark-mode-navbar-color-schemes branch December 19, 2023 12:32
julien-deramond added a commit that referenced this pull request Dec 21, 2023
julien-deramond added a commit that referenced this pull request Dec 26, 2023
julien-deramond added a commit that referenced this pull request Dec 27, 2023
julien-deramond added a commit that referenced this pull request Jan 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
color mode Temporary label to highlight color mode issues
Projects
Development

Successfully merging this pull request may close these issues.

2 participants