2020-09-06 07:30:58 +02:00
{{ define "main" }}
< header class = "py-5 border-bottom" >
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
< div class = "container-xxl bd-gutter pt-md-1 pb-md-4" >
2021-03-22 21:59:14 +01:00
< div class = "row" >
< div class = "col-xl-8" >
< h1 class = "bd-title mt-0" > {{ .Title | markdownify }}< / h1 >
< p class = "bd-lead" > {{ .Page.Params.Description | markdownify }}< / p >
{{ if eq .Title "Examples" }}
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
< div class = "d-flex flex-column flex-md-row gap-3" >
< a href = "{{ .Site.Params.download.dist_examples }}" class = "btn btn-lg bd-btn-lg btn-bd-primary d-flex align-items-center justify-content-center fw-semibold" onclick = "ga('send', 'event', 'Examples', 'Hero', 'Download Examples');" >
< svg class = "bi me-2" aria-hidden = "true" > < use xlink:href = "#box-seam" > < / use > < / svg >
Download examples
< / a >
< a href = "{{ .Site.Params.download.source }}" class = "btn btn-lg bd-btn-lg btn-outline-secondary" onclick = "ga('send', 'event', 'Examples', 'Hero', 'Download');" >
Download source code
< / a >
2021-03-22 21:59:14 +01:00
< / div >
{{ end }}
< / div >
< div class = "col-xl-4 d-lg-flex justify-content-xl-end" >
{{ partial "ads" . }}
< / div >
2019-01-08 17:33:28 +01:00
< / div >
2020-09-06 07:30:58 +02:00
< / div >
< / header >
2019-01-08 17:33:28 +01:00
2020-09-06 07:30:58 +02:00
< main class = "bd-content order-1 py-5" id = "content" >
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
< div class = "container-xxl bd-gutter" >
2020-09-06 07:30:58 +02:00
{{ .Content }}
2020-05-31 04:00:08 +02:00
2020-09-06 07:30:58 +02:00
{{ if eq .Title "Examples" }}
< hr class = "my-5" >
< div class = "container" >
< div class = "text-center" >
< div class = "masthead-followup-icon d-inline-block mb-2 text-white bg-danger" >
{{ partial "icons/droplet-fill.svg" (dict "width" "32" "height" "32") }}
2020-05-31 04:00:08 +02:00
< / div >
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
< h2 class = "display-6 fw-normal" > Go further with Bootstrap Themes< / h2 >
2020-09-06 07:30:58 +02:00
< p class = "col-md-10 col-lg-8 mx-auto lead" >
Need something more than these examples? Take Bootstrap to the next level with premium themes from the < a href = "{{ .Site.Params.themes }}" > official Bootstrap Themes marketplace< / a > . They’ re built as their own extended frameworks, rich with new components and plugins, documentation, and powerful build tools.
< / p >
< a href = "{{ .Site.Params.themes }}" class = "btn btn-lg btn-outline-primary mb-3" > Browse themes< / a >
< / div >
< img class = "d-block img-fluid mt-3 mx-auto" srcset = "/docs/{{ . Site . Params . docs_version } } / assets / img / bootstrap-themes-collage . png ,
/docs/{{ .Site.Params.docs_version }}/assets/img/bootstrap-themes-collage@2x.png 2x"
2020-11-11 17:18:47 +01:00
src="/docs/{{ .Site.Params.docs_version }}/assets/img/bootstrap-themes-collage.png"
alt="Bootstrap Themes" width="1150" height="320" loading="lazy">
2020-09-06 07:30:58 +02:00
< / div >
{{ end }}
< / div >
< / main >
{{ end }}