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: Breadcrumb #2315

Merged
merged 2 commits into from
Oct 17, 2023
Merged

Conversation

louismaximepiton
Copy link
Member

@louismaximepiton louismaximepiton commented Oct 17, 2023

Description

Breadcrumb in dark mode, by using new Sass and CSS vars :

Sass var Previous value New value
$breadcrumb-divider-filter - var(--#{$prefix}icon-filter)
$breadcrumb-divider-color null $black

⚠️ New CSS var:

CSS var Light value Dark value
--bs-icon-filter none $invert-filter

It means that applying this filter on an icon will transform from black to white depending on the color mode chosen.

Links

@louismaximepiton louismaximepiton added the color mode Temporary label to highlight color mode issues label Oct 17, 2023
@netlify
Copy link

netlify bot commented Oct 17, 2023

Deploy Preview for boosted ready!

Name Link
🔨 Latest commit b8bbf3f
🔍 Latest deploy log https://app.netlify.com/sites/boosted/deploys/652e7af040fc2f00081410b7
😎 Deploy Preview https://deploy-preview-2315--boosted.netlify.app/docs/5.3/customize/color-modes
📱 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.

scss/_root.scss Outdated Show resolved Hide resolved
@julien-deramond julien-deramond merged commit bd524f0 into main-jd-dark-mode Oct 17, 2023
14 checks passed
@julien-deramond julien-deramond deleted the main-lmp-breadcrumb-dark branch October 17, 2023 12:18
@julien-deramond julien-deramond mentioned this pull request Oct 17, 2023
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