2022-05-07 01:56:43 +02:00
|
|
|
// stylelint-disable selector-class-pattern
|
|
|
|
|
2022-12-28 01:43:42 +01:00
|
|
|
:root {
|
|
|
|
--docsearch-primary-color: var(--bd-violet);
|
|
|
|
--docsearch-logo-color: var(--bd-violet);
|
|
|
|
}
|
|
|
|
|
|
|
|
@include color-mode(dark, true) {
|
|
|
|
// From here, the values are copied from https://cdn.jsdelivr.net/npm/@docsearch/css@3
|
|
|
|
// in html[data-theme="dark"] selector
|
|
|
|
// and are slightly modified for formatting purpose
|
|
|
|
--docsearch-text-color: #f5f6f7;
|
|
|
|
--docsearch-container-background: rgba(9, 10, 17, .8);
|
|
|
|
--docsearch-modal-background: #15172a;
|
|
|
|
--docsearch-modal-shadow: inset 1px 1px 0 0 #2c2e40, 0 3px 8px 0 #000309;
|
|
|
|
--docsearch-searchbox-background: #090a11;
|
|
|
|
--docsearch-searchbox-focus-background: #000;
|
|
|
|
--docsearch-hit-color: #bec3c9;
|
|
|
|
--docsearch-hit-shadow: none;
|
|
|
|
--docsearch-hit-background: #090a11;
|
|
|
|
--docsearch-key-gradient: linear-gradient(-26.5deg, #565872, #31355b);
|
|
|
|
--docsearch-key-shadow: inset 0 -2px 0 0 #282d55, inset 0 0 1px 1px #51577d, 0 2px 2px 0 rgba(3, 4, 9, .3);
|
|
|
|
--docsearch-footer-background: #1e2136;
|
|
|
|
--docsearch-footer-shadow: inset 0 1px 0 0 rgba(73, 76, 106, .5), 0 -4px 8px 0 rgba(0, 0, 0, .2);
|
|
|
|
--docsearch-muted-color: #7f8497;
|
|
|
|
}
|
|
|
|
|
v5.2.0 design refresh, plus responsive offcanvas classes (#35736)
* Add responsive offcanvas classes
- Updates navbar-expand classes to de-dupe some styles—these shouldn't interfere now.
- Adds some JS to the offcanvas component to help with responsiveness
Co-Authored-By: GeoSot <geo.sotis@gmail.com>
* Redesign homepage, docs, and examples
Homepage:
- New Bootstrap purple navbar
- Redesigned masthead
- Rewrote and redesigned homepage content
- Replace Copy text with icons like Bootstrap Icons site across all ClipboardJS instances
- Fixed padding issues in site footer
- Match homepage button styles to examples page, use gap instead of tons of responsive margin utils
Docs:
- New navbar, no more subnav. Migrated search and version picker into the main navbar and refreshed the design of it all, including the responsive toggles.
- New sidebar navigation is always expanded, and now features Bootstrap Icons alongside section headings
- Sidebar navigation autoscrolls to active link for better usability
- Subnav and navbar padding issues ironed out
- Enhanced the version picker in anticipation of v5.2: we can now link right to the same page in the previous version.
- Redesign callouts to add more color to our pages
- Collapse table of contents on mobile
- Cleanup and redesign button styles with CSS variables
- Update design for subnav version dropdown
- Update highlight and example to be full-width until md
- Improve the Added In badges
- Turn the ToC into a well on mobile
- Redesign code snippets to better house two action buttons
Examples:
- Redesign Examples page layout
- Add new example for responsive offcanvases in navbars
* Convert offcanvas to CSS vars
* Feat: add resize handler to Offcanvas.js.
If we could use as default the `.offcanvas` class without modifiers, we then, could add a simplified selector
The selector itself, ignores the .offcanvas class as it doesn't have any responsive behavior
The `aria-modal` addon is to protect us, selection backdrop elements
* Separate examples code, Add some selectors, fix stackblitz btn
Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-04-18 07:17:50 +02:00
|
|
|
.bd-search {
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
@include media-breakpoint-up(lg) {
|
|
|
|
position: absolute;
|
2022-05-15 21:39:23 +02:00
|
|
|
top: .875rem;
|
v5.2.0 design refresh, plus responsive offcanvas classes (#35736)
* Add responsive offcanvas classes
- Updates navbar-expand classes to de-dupe some styles—these shouldn't interfere now.
- Adds some JS to the offcanvas component to help with responsiveness
Co-Authored-By: GeoSot <geo.sotis@gmail.com>
* Redesign homepage, docs, and examples
Homepage:
- New Bootstrap purple navbar
- Redesigned masthead
- Rewrote and redesigned homepage content
- Replace Copy text with icons like Bootstrap Icons site across all ClipboardJS instances
- Fixed padding issues in site footer
- Match homepage button styles to examples page, use gap instead of tons of responsive margin utils
Docs:
- New navbar, no more subnav. Migrated search and version picker into the main navbar and refreshed the design of it all, including the responsive toggles.
- New sidebar navigation is always expanded, and now features Bootstrap Icons alongside section headings
- Sidebar navigation autoscrolls to active link for better usability
- Subnav and navbar padding issues ironed out
- Enhanced the version picker in anticipation of v5.2: we can now link right to the same page in the previous version.
- Redesign callouts to add more color to our pages
- Collapse table of contents on mobile
- Cleanup and redesign button styles with CSS variables
- Update design for subnav version dropdown
- Update highlight and example to be full-width until md
- Improve the Added In badges
- Turn the ToC into a well on mobile
- Redesign code snippets to better house two action buttons
Examples:
- Redesign Examples page layout
- Add new example for responsive offcanvases in navbars
* Convert offcanvas to CSS vars
* Feat: add resize handler to Offcanvas.js.
If we could use as default the `.offcanvas` class without modifiers, we then, could add a simplified selector
The selector itself, ignores the .offcanvas class as it doesn't have any responsive behavior
The `aria-modal` addon is to protect us, selection backdrop elements
* Separate examples code, Add some selectors, fix stackblitz btn
Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-04-18 07:17:50 +02:00
|
|
|
left: 50%;
|
|
|
|
width: 200px;
|
|
|
|
margin-left: -100px;
|
|
|
|
}
|
|
|
|
|
|
|
|
@include media-breakpoint-up(xl) {
|
|
|
|
width: 280px;
|
|
|
|
margin-left: -140px;
|
|
|
|
}
|
|
|
|
|
2022-05-07 01:56:43 +02:00
|
|
|
}
|
v5.2.0 design refresh, plus responsive offcanvas classes (#35736)
* Add responsive offcanvas classes
- Updates navbar-expand classes to de-dupe some styles—these shouldn't interfere now.
- Adds some JS to the offcanvas component to help with responsiveness
Co-Authored-By: GeoSot <geo.sotis@gmail.com>
* Redesign homepage, docs, and examples
Homepage:
- New Bootstrap purple navbar
- Redesigned masthead
- Rewrote and redesigned homepage content
- Replace Copy text with icons like Bootstrap Icons site across all ClipboardJS instances
- Fixed padding issues in site footer
- Match homepage button styles to examples page, use gap instead of tons of responsive margin utils
Docs:
- New navbar, no more subnav. Migrated search and version picker into the main navbar and refreshed the design of it all, including the responsive toggles.
- New sidebar navigation is always expanded, and now features Bootstrap Icons alongside section headings
- Sidebar navigation autoscrolls to active link for better usability
- Subnav and navbar padding issues ironed out
- Enhanced the version picker in anticipation of v5.2: we can now link right to the same page in the previous version.
- Redesign callouts to add more color to our pages
- Collapse table of contents on mobile
- Cleanup and redesign button styles with CSS variables
- Update design for subnav version dropdown
- Update highlight and example to be full-width until md
- Improve the Added In badges
- Turn the ToC into a well on mobile
- Redesign code snippets to better house two action buttons
Examples:
- Redesign Examples page layout
- Add new example for responsive offcanvases in navbars
* Convert offcanvas to CSS vars
* Feat: add resize handler to Offcanvas.js.
If we could use as default the `.offcanvas` class without modifiers, we then, could add a simplified selector
The selector itself, ignores the .offcanvas class as it doesn't have any responsive behavior
The `aria-modal` addon is to protect us, selection backdrop elements
* Separate examples code, Add some selectors, fix stackblitz btn
Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-04-18 07:17:50 +02:00
|
|
|
|
2022-05-07 01:56:43 +02:00
|
|
|
.DocSearch-Container {
|
|
|
|
--docsearch-muted-color: #{$text-muted};
|
|
|
|
--docsearch-hit-shadow: none;
|
v5.2.0 design refresh, plus responsive offcanvas classes (#35736)
* Add responsive offcanvas classes
- Updates navbar-expand classes to de-dupe some styles—these shouldn't interfere now.
- Adds some JS to the offcanvas component to help with responsiveness
Co-Authored-By: GeoSot <geo.sotis@gmail.com>
* Redesign homepage, docs, and examples
Homepage:
- New Bootstrap purple navbar
- Redesigned masthead
- Rewrote and redesigned homepage content
- Replace Copy text with icons like Bootstrap Icons site across all ClipboardJS instances
- Fixed padding issues in site footer
- Match homepage button styles to examples page, use gap instead of tons of responsive margin utils
Docs:
- New navbar, no more subnav. Migrated search and version picker into the main navbar and refreshed the design of it all, including the responsive toggles.
- New sidebar navigation is always expanded, and now features Bootstrap Icons alongside section headings
- Sidebar navigation autoscrolls to active link for better usability
- Subnav and navbar padding issues ironed out
- Enhanced the version picker in anticipation of v5.2: we can now link right to the same page in the previous version.
- Redesign callouts to add more color to our pages
- Collapse table of contents on mobile
- Cleanup and redesign button styles with CSS variables
- Update design for subnav version dropdown
- Update highlight and example to be full-width until md
- Improve the Added In badges
- Turn the ToC into a well on mobile
- Redesign code snippets to better house two action buttons
Examples:
- Redesign Examples page layout
- Add new example for responsive offcanvases in navbars
* Convert offcanvas to CSS vars
* Feat: add resize handler to Offcanvas.js.
If we could use as default the `.offcanvas` class without modifiers, we then, could add a simplified selector
The selector itself, ignores the .offcanvas class as it doesn't have any responsive behavior
The `aria-modal` addon is to protect us, selection backdrop elements
* Separate examples code, Add some selectors, fix stackblitz btn
Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-04-18 07:17:50 +02:00
|
|
|
|
2022-06-28 07:41:15 +02:00
|
|
|
z-index: 2000; // Make sure to be over all components showcased in the documentation
|
2022-08-26 09:19:33 +02:00
|
|
|
cursor: auto; // Needed because of [role="button"] in Algolia search modal. Remove once https://github.com/algolia/docsearch/issues/1370 is tackled.
|
v5.2.0 design refresh, plus responsive offcanvas classes (#35736)
* Add responsive offcanvas classes
- Updates navbar-expand classes to de-dupe some styles—these shouldn't interfere now.
- Adds some JS to the offcanvas component to help with responsiveness
Co-Authored-By: GeoSot <geo.sotis@gmail.com>
* Redesign homepage, docs, and examples
Homepage:
- New Bootstrap purple navbar
- Redesigned masthead
- Rewrote and redesigned homepage content
- Replace Copy text with icons like Bootstrap Icons site across all ClipboardJS instances
- Fixed padding issues in site footer
- Match homepage button styles to examples page, use gap instead of tons of responsive margin utils
Docs:
- New navbar, no more subnav. Migrated search and version picker into the main navbar and refreshed the design of it all, including the responsive toggles.
- New sidebar navigation is always expanded, and now features Bootstrap Icons alongside section headings
- Sidebar navigation autoscrolls to active link for better usability
- Subnav and navbar padding issues ironed out
- Enhanced the version picker in anticipation of v5.2: we can now link right to the same page in the previous version.
- Redesign callouts to add more color to our pages
- Collapse table of contents on mobile
- Cleanup and redesign button styles with CSS variables
- Update design for subnav version dropdown
- Update highlight and example to be full-width until md
- Improve the Added In badges
- Turn the ToC into a well on mobile
- Redesign code snippets to better house two action buttons
Examples:
- Redesign Examples page layout
- Add new example for responsive offcanvases in navbars
* Convert offcanvas to CSS vars
* Feat: add resize handler to Offcanvas.js.
If we could use as default the `.offcanvas` class without modifiers, we then, could add a simplified selector
The selector itself, ignores the .offcanvas class as it doesn't have any responsive behavior
The `aria-modal` addon is to protect us, selection backdrop elements
* Separate examples code, Add some selectors, fix stackblitz btn
Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-04-18 07:17:50 +02:00
|
|
|
|
2022-05-07 01:56:43 +02:00
|
|
|
@include media-breakpoint-up(lg) {
|
|
|
|
padding-top: 4rem;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Button {
|
|
|
|
--docsearch-searchbox-background: #{rgba($black, .1)};
|
|
|
|
--docsearch-searchbox-color: #{$white};
|
|
|
|
--docsearch-searchbox-focus-background: #{rgba($black, .25)};
|
|
|
|
--docsearch-searchbox-shadow: #{0 0 0 .25rem rgba($bd-accent, .4)};
|
|
|
|
--docsearch-text-color: #{$white};
|
|
|
|
--docsearch-muted-color: #{rgba($white, .65)};
|
|
|
|
|
|
|
|
width: 100%;
|
2022-05-15 21:39:23 +02:00
|
|
|
height: 38px; // Match Bootstrap inputs
|
2022-05-07 01:56:43 +02:00
|
|
|
margin: 0;
|
|
|
|
border: 1px solid rgba($white, .4);
|
|
|
|
@include border-radius(.375rem);
|
|
|
|
|
|
|
|
.DocSearch-Search-Icon {
|
|
|
|
opacity: .65;
|
|
|
|
}
|
|
|
|
|
|
|
|
&:active,
|
|
|
|
&:focus,
|
|
|
|
&:hover {
|
|
|
|
border-color: rgba($bd-accent, 1);
|
|
|
|
|
|
|
|
.DocSearch-Search-Icon {
|
|
|
|
opacity: 1;
|
v5.2.0 design refresh, plus responsive offcanvas classes (#35736)
* Add responsive offcanvas classes
- Updates navbar-expand classes to de-dupe some styles—these shouldn't interfere now.
- Adds some JS to the offcanvas component to help with responsiveness
Co-Authored-By: GeoSot <geo.sotis@gmail.com>
* Redesign homepage, docs, and examples
Homepage:
- New Bootstrap purple navbar
- Redesigned masthead
- Rewrote and redesigned homepage content
- Replace Copy text with icons like Bootstrap Icons site across all ClipboardJS instances
- Fixed padding issues in site footer
- Match homepage button styles to examples page, use gap instead of tons of responsive margin utils
Docs:
- New navbar, no more subnav. Migrated search and version picker into the main navbar and refreshed the design of it all, including the responsive toggles.
- New sidebar navigation is always expanded, and now features Bootstrap Icons alongside section headings
- Sidebar navigation autoscrolls to active link for better usability
- Subnav and navbar padding issues ironed out
- Enhanced the version picker in anticipation of v5.2: we can now link right to the same page in the previous version.
- Redesign callouts to add more color to our pages
- Collapse table of contents on mobile
- Cleanup and redesign button styles with CSS variables
- Update design for subnav version dropdown
- Update highlight and example to be full-width until md
- Improve the Added In badges
- Turn the ToC into a well on mobile
- Redesign code snippets to better house two action buttons
Examples:
- Redesign Examples page layout
- Add new example for responsive offcanvases in navbars
* Convert offcanvas to CSS vars
* Feat: add resize handler to Offcanvas.js.
If we could use as default the `.offcanvas` class without modifiers, we then, could add a simplified selector
The selector itself, ignores the .offcanvas class as it doesn't have any responsive behavior
The `aria-modal` addon is to protect us, selection backdrop elements
* Separate examples code, Add some selectors, fix stackblitz btn
Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-04-18 07:17:50 +02:00
|
|
|
}
|
|
|
|
}
|
2022-07-27 22:30:42 +02:00
|
|
|
|
|
|
|
@include media-breakpoint-down(lg) {
|
|
|
|
&,
|
|
|
|
&:hover,
|
|
|
|
&:focus {
|
|
|
|
background: transparent;
|
|
|
|
border: 0;
|
|
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
&:focus {
|
|
|
|
box-shadow: var(--docsearch-searchbox-shadow);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Button-Keys,
|
|
|
|
.DocSearch-Button-Placeholder {
|
|
|
|
@include media-breakpoint-down(lg) {
|
|
|
|
display: none;
|
|
|
|
}
|
v5.2.0 design refresh, plus responsive offcanvas classes (#35736)
* Add responsive offcanvas classes
- Updates navbar-expand classes to de-dupe some styles—these shouldn't interfere now.
- Adds some JS to the offcanvas component to help with responsiveness
Co-Authored-By: GeoSot <geo.sotis@gmail.com>
* Redesign homepage, docs, and examples
Homepage:
- New Bootstrap purple navbar
- Redesigned masthead
- Rewrote and redesigned homepage content
- Replace Copy text with icons like Bootstrap Icons site across all ClipboardJS instances
- Fixed padding issues in site footer
- Match homepage button styles to examples page, use gap instead of tons of responsive margin utils
Docs:
- New navbar, no more subnav. Migrated search and version picker into the main navbar and refreshed the design of it all, including the responsive toggles.
- New sidebar navigation is always expanded, and now features Bootstrap Icons alongside section headings
- Sidebar navigation autoscrolls to active link for better usability
- Subnav and navbar padding issues ironed out
- Enhanced the version picker in anticipation of v5.2: we can now link right to the same page in the previous version.
- Redesign callouts to add more color to our pages
- Collapse table of contents on mobile
- Cleanup and redesign button styles with CSS variables
- Update design for subnav version dropdown
- Update highlight and example to be full-width until md
- Improve the Added In badges
- Turn the ToC into a well on mobile
- Redesign code snippets to better house two action buttons
Examples:
- Redesign Examples page layout
- Add new example for responsive offcanvases in navbars
* Convert offcanvas to CSS vars
* Feat: add resize handler to Offcanvas.js.
If we could use as default the `.offcanvas` class without modifiers, we then, could add a simplified selector
The selector itself, ignores the .offcanvas class as it doesn't have any responsive behavior
The `aria-modal` addon is to protect us, selection backdrop elements
* Separate examples code, Add some selectors, fix stackblitz btn
Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-04-18 07:17:50 +02:00
|
|
|
}
|
2022-05-07 01:56:43 +02:00
|
|
|
|
|
|
|
.DocSearch-Button-Keys {
|
|
|
|
min-width: 0;
|
2022-05-15 21:39:23 +02:00
|
|
|
padding: .125rem .25rem;
|
2022-05-07 01:56:43 +02:00
|
|
|
background: rgba($black, .25);
|
|
|
|
@include border-radius(.25rem);
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Button-Key {
|
|
|
|
top: 0;
|
|
|
|
width: auto;
|
|
|
|
height: 1.25rem;
|
|
|
|
padding-right: .125rem;
|
|
|
|
padding-left: .125rem;
|
|
|
|
margin-right: 0;
|
|
|
|
font-size: .875rem;
|
|
|
|
background: none;
|
|
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Commands-Key {
|
|
|
|
padding-left: 1px;
|
|
|
|
font-size: .875rem;
|
|
|
|
background-color: rgba($black, .1);
|
|
|
|
background-image: none;
|
|
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Form {
|
|
|
|
@include border-radius(var(--bs-border-radius));
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Hits {
|
|
|
|
mark {
|
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Hit {
|
|
|
|
padding-bottom: 0;
|
|
|
|
@include border-radius(0);
|
|
|
|
|
|
|
|
a {
|
|
|
|
@include border-radius(0);
|
|
|
|
border: solid var(--bs-border-color);
|
|
|
|
border-width: 0 1px 1px;
|
|
|
|
}
|
|
|
|
|
|
|
|
&:first-child a {
|
|
|
|
@include border-top-radius(var(--bs-border-radius));
|
|
|
|
border-top-width: 1px;
|
|
|
|
}
|
|
|
|
&:last-child a {
|
|
|
|
@include border-bottom-radius(var(--bs-border-radius));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.DocSearch-Hit-icon {
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
}
|
2022-12-28 01:43:42 +01:00
|
|
|
|
|
|
|
// Fix --docsearch-logo-color that doesn't do anything
|
|
|
|
.DocSearch-Logo svg .cls-1,
|
|
|
|
.DocSearch-Logo svg .cls-2 {
|
|
|
|
fill: var(--docsearch-logo-color);
|
|
|
|
}
|