diff options
Diffstat (limited to 'vendor/twbs/bootstrap/site/assets/scss')
15 files changed, 266 insertions, 77 deletions
diff --git a/vendor/twbs/bootstrap/site/assets/scss/_ads.scss b/vendor/twbs/bootstrap/site/assets/scss/_ads.scss index b9369eb19..cc5634096 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_ads.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_ads.scss @@ -14,10 +14,10 @@ @include font-size(.8125rem); line-height: 1.4; text-align: left; - background-color: $gray-100; + background-color: var(--bs-tertiary-bg); a { - color: $gray-800; + color: var(--bs-body-color); text-decoration: none; } @@ -34,5 +34,5 @@ .carbon-poweredby { display: block; margin-top: .75rem; - color: $gray-700 !important; + color: var(--bs-body-color) !important; } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_brand.scss b/vendor/twbs/bootstrap/site/assets/scss/_brand.scss index 9637cfb18..03fe2fe1f 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_brand.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_brand.scss @@ -15,13 +15,13 @@ // Individual items .bd-brand-item { + .bd-brand-item { - border-top: 1px solid $white; + border-top: 1px solid var(--bs-border-color); } @include media-breakpoint-up(md) { + .bd-brand-item { border-top: 0; - border-left: 1px solid $white; + border-left: 1px solid var(--bs-border-color); } } } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_buttons.scss b/vendor/twbs/bootstrap/site/assets/scss/_buttons.scss index 13bd6e48a..300bdca9c 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_buttons.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_buttons.scss @@ -33,13 +33,15 @@ } .btn-bd-light { + --btn-custom-color: #{mix($bd-violet, $white, 75%)}; + --bs-btn-color: var(--bs-gray-600); - --bs-btn-border-color: var(--bs-gray-400); - --bs-btn-hover-color: var(--bd-violet); - --bs-btn-hover-border-color: var(--bd-violet); - --bs-btn-active-color: var(--bd-violet); + --bs-btn-border-color: var(--bs-border-color); + --bs-btn-hover-color: var(--btn-custom-color); + --bs-btn-hover-border-color: var(--btn-custom-color); + --bs-btn-active-color: var(--btn-custom-color); --bs-btn-active-bg: var(--bs-white); - --bs-btn-active-border-color: var(--bd-violet); - --bs-btn-focus-border-color: var(--bd-violet); + --bs-btn-active-border-color: var(--btn-custom-color); + --bs-btn-focus-border-color: var(--btn-custom-color); --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb); } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_callouts.scss b/vendor/twbs/bootstrap/site/assets/scss/_callouts.scss index 4513a7d1d..016a2ed24 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_callouts.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_callouts.scss @@ -6,6 +6,7 @@ padding: 1.25rem; margin-top: 1.25rem; margin-bottom: 1.25rem; + color: var(--bd-callout-color, inherit); background-color: var(--bd-callout-bg, var(--bs-gray-100)); border-left: .25rem solid var(--bd-callout-border, var(--bs-gray-300)); @@ -29,7 +30,8 @@ // Variations @each $variant in $bd-callout-variants { .bd-callout-#{$variant} { - --bd-callout-bg: rgba(var(--bs-#{$variant}-rgb), .075); - --bd-callout-border: rgba(var(--bs-#{$variant}-rgb), .5); + --bd-callout-color: var(--bs-#{$variant}-text); + --bd-callout-bg: var(--bs-#{$variant}-bg-subtle); + --bd-callout-border: var(--bs-#{$variant}-border-subtle); } } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_clipboard-js.scss b/vendor/twbs/bootstrap/site/assets/scss/_clipboard-js.scss index 3a876a5e6..1e0003bcb 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_clipboard-js.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_clipboard-js.scss @@ -22,13 +22,13 @@ display: block; padding: .5em; line-height: 1; - color: $gray-900; - background-color: $gray-100; + color: var(--bs-body-color); + background-color: var(--bs-tertiary-bg); border: 0; @include border-radius(.25rem); &:hover { - color: $primary; + color: var(--bs-link-color); } &:focus { diff --git a/vendor/twbs/bootstrap/site/assets/scss/_component-examples.scss b/vendor/twbs/bootstrap/site/assets/scss/_component-examples.scss index f4865daf8..11800a638 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_component-examples.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_component-examples.scss @@ -3,7 +3,7 @@ // .bd-example-snippet { - border: solid $border-color; + border: solid var(--bs-border-color); border-width: 1px 0; @include media-breakpoint-up(md) { @@ -17,7 +17,7 @@ position: relative; padding: var(--bd-example-padding); margin: 0 ($bd-gutter-x * -.5); - border: solid $border-color; + border: solid var(--bs-border-color); border-width: 1px 0; @include clearfix(); @@ -32,7 +32,7 @@ + .bd-code-snippet { @include border-top-radius(0); - border: solid $border-color; + border: solid var(--bs-border-color); border-width: 0 1px 1px; } @@ -58,7 +58,8 @@ display: block; } - > :last-child { + > :last-child, + > nav:last-child .breadcrumb { margin-bottom: 0; } @@ -115,11 +116,12 @@ // .bd-example-row [class^="col"], -.bd-example-cssgrid .grid > * { +.bd-example-cols [class^="col"] > *, +.bd-example-cssgrid [class*="grid"] > * { padding-top: .75rem; padding-bottom: .75rem; - background-color: rgba(var(--bd-violet-rgb), .1); - border: 1px solid rgba(var(--bd-violet-rgb), .25); + background-color: rgba(var(--bd-violet-rgb), .15); + border: 1px solid rgba(var(--bd-violet-rgb), .3); } .bd-example-row .row + .row, @@ -129,12 +131,12 @@ .bd-example-row-flex-cols .row { min-height: 10rem; - background-color: rgba(255, 0, 0, .1); + background-color: rgba(var(--bd-violet-rgb), .15); } .bd-example-flex div { - background-color: rgba($bd-purple, .15); - border: 1px solid rgba($bd-purple, .15); + background-color: rgba(var(--bd-violet-rgb), .15); + border: 1px solid rgba(var(--bd-violet-rgb), .3); } // Grid mixins @@ -176,9 +178,9 @@ .ratio { display: inline-block; width: 10rem; - color: $gray-600; - background-color: $gray-100; - border: var(--#{$prefix}border-width) solid var(--#{$prefix}border-color); + color: var(--bs-secondary-color); + background-color: var(--bs-tertiary-bg); + border: var(--bs-border-width) solid var(--bs-border-color); > div { display: flex; @@ -208,8 +210,14 @@ } // Tooltips -.tooltip-demo a { - white-space: nowrap; +.tooltip-demo { + a { + white-space: nowrap; + } + + .btn { + margin: .25rem .125rem; + } } // scss-docs-start custom-tooltip @@ -253,7 +261,7 @@ width: 5rem; height: 5rem; margin: .25rem; - background-color: #f5f5f5; + background-color: var(--bs-tertiary-bg); } } @@ -269,13 +277,13 @@ .position-relative { height: 200px; - background-color: #f5f5f5; + background-color: var(--bs-tertiary-bg); } .position-absolute { width: 2rem; height: 2rem; - background-color: $dark; + background-color: var(--bs-body-color); @include border-radius(); } } @@ -302,6 +310,32 @@ min-height: 240px; } +.bd-example-zindex-levels { + min-height: 15rem; + + > div { + background-color: tint-color($bd-violet, 75%); + border: 1px solid tint-color($bd-violet, 50%); + } + + > :nth-child(2) { + top: 3rem; + left: 3rem; + } + > :nth-child(3) { + top: 4.5rem; + left: 4.5rem; + } + > :nth-child(4) { + top: 6rem; + left: 6rem; + } + > :nth-child(5) { + top: 7.5rem; + left: 7.5rem; + } +} + // // Code snippets // @@ -310,7 +344,7 @@ position: relative; padding: .75rem ($bd-gutter-x * .5); margin-bottom: 1rem; - background-color: var(--bs-gray-100); + background-color: var(--bs-tertiary-bg); @include media-breakpoint-up(md) { padding: .75rem 1.25rem; @@ -329,7 +363,7 @@ pre code { @include font-size(inherit); - color: $gray-900; // Effectively the base text color + color: var(--bs-body-color); // Effectively the base text color word-wrap: normal; } } @@ -354,6 +388,12 @@ } .highlight-toolbar { - border: solid $border-color; + background-color: var(--bs-tertiary-bg); + border: solid var(--bs-border-color); border-width: 1px 0; + + .btn-clipboard { + margin-top: 0; + margin-right: 0; + } } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_content.scss b/vendor/twbs/bootstrap/site/assets/scss/_content.scss index cd594335a..14d27b2fd 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_content.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_content.scss @@ -32,6 +32,9 @@ // Override Bootstrap defaults > .table, > .table-responsive .table { + --bs-table-border-color: var(--bs-border-color); + + max-width: 100%; margin-bottom: 1.5rem; @include font-size(.875rem); @@ -60,6 +63,14 @@ } } + th { + color: var(--bs-emphasis-color); + } + + strong { + color: var(--bs-emphasis-color); + } + // Prevent breaking of code // stylelint-disable-next-line selector-max-compound-selectors th, @@ -80,6 +91,16 @@ min-width: 280px; } +.table-swatches { + th { + color: var(--bs-emphasis-color); + } + + td code { + white-space: nowrap; + } +} + .bd-title { @include font-size(3rem); } @@ -89,13 +110,10 @@ font-weight: 300; } -.bd-bg-violet { - background-color: $bd-violet; -} - .bi { width: 1em; height: 1em; + vertical-align: -.125em; fill: currentcolor; } @@ -121,6 +139,43 @@ .border-lg-start { @include media-breakpoint-up(lg) { - border-left: $border-width solid $border-color; + border-left: var(--bs-border-width) solid var(--bs-border-color); + } +} + +// stylelint-disable selector-no-qualifying-type +.bd-summary-link { + color: var(--bs-link-color); + + &:hover, + details[open] > & { + color: var(--bs-link-hover-color); + } +} +// stylelint-enable selector-no-qualifying-type + +// scss-docs-start custom-color-mode +[data-bs-theme="blue"] { + --bs-body-color: var(--bs-white); + --bs-body-color-rgb: #{to-rgb($white)}; + --bs-body-bg: var(--bs-blue); + --bs-body-bg-rgb: #{to-rgb($blue)}; + --bs-tertiary-bg: #{$blue-600}; + + .dropdown-menu { + --bs-dropdown-bg: #{mix($blue-500, $blue-600)}; + --bs-dropdown-link-active-bg: #{$blue-700}; + } + + .btn-secondary { + --bs-btn-bg: #{mix($gray-600, $blue-400, .5)}; + --bs-btn-border-color: #{rgba($white, .25)}; + --bs-btn-hover-bg: #{darken(mix($gray-600, $blue-400, .5), 5%)}; + --bs-btn-hover-border-color: #{rgba($white, .25)}; + --bs-btn-active-bg: #{darken(mix($gray-600, $blue-400, .5), 10%)}; + --bs-btn-active-border-color: #{rgba($white, .5)}; + --bs-btn-focus-border-color: #{rgba($white, .5)}; + --bs-btn-focus-box-shadow: 0 0 0 .25rem rgba(255, 255, 255, .2); } } +// scss-docs-end custom-color-mode diff --git a/vendor/twbs/bootstrap/site/assets/scss/_footer.scss b/vendor/twbs/bootstrap/site/assets/scss/_footer.scss index 87cee6d2b..42e1ca051 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_footer.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_footer.scss @@ -4,12 +4,12 @@ .bd-footer { a { - color: $gray-700; + color: var(--bs-body-color); text-decoration: none; &:hover, &:focus { - color: $link-color; + color: var(--bs-link-hover-color); text-decoration: underline; } } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_masthead.scss b/vendor/twbs/bootstrap/site/assets/scss/_masthead.scss index 81d4d998c..52b282fcf 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_masthead.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_masthead.scss @@ -11,13 +11,12 @@ h1 { @include font-size(4rem); - line-height: 1; } .lead { @include font-size(1rem); font-weight: 400; - color: $gray-700; + color: var(--bs-secondary-color); } .bd-code-snippet { @@ -46,8 +45,7 @@ } #carbonads { // stylelint-disable-line selector-max-id - margin-right: auto; - margin-left: auto; + margin-inline: auto; } @include media-breakpoint-up(md) { @@ -86,7 +84,7 @@ mix-blend-mode: darken; svg { - filter: drop-shadow(0 1px 1px #fff); + filter: drop-shadow(0 1px 1px var(--bs-body-bg)); } } @@ -94,3 +92,21 @@ background-color: var(--bd-accent); box-shadow: inset 0 -1px 1px rgba(var(--bs-body-color-rgb), .15), 0 .25rem 1.5rem rgba(var(--bs-body-bg-rgb), .75); } + +.animate-img { + > img { + transition: .2s ease-in-out transform; // stylelint-disable-line property-disallowed-list + } + + &:hover > img { + transform: scale(1.1); + } +} + +@if $enable-dark-mode { + [data-bs-theme="dark"] { + .masthead-followup-icon { + mix-blend-mode: lighten; + } + } +} diff --git a/vendor/twbs/bootstrap/site/assets/scss/_navbar.scss b/vendor/twbs/bootstrap/site/assets/scss/_navbar.scss index 0cff3e2a8..9f1f4e71a 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_navbar.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_navbar.scss @@ -1,8 +1,16 @@ .bd-navbar { padding: .75rem 0; background-color: transparent; - background-image: linear-gradient(to bottom, rgba(var(--bd-violet-rgb), 1), rgba(var(--bd-violet-rgb), .95)); - box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15), inset 0 -1px 0 rgba(0, 0, 0, .15); + box-shadow: 0 .5rem 1rem rgba($black, .15), inset 0 -1px 0 rgba($white, .15); + + &::after { + position: absolute; + inset: 0; + z-index: -1; + display: block; + content: ""; + background-image: linear-gradient(to bottom, rgba(var(--bd-violet-rgb), 1), rgba(var(--bd-violet-rgb), .95)); + } .bd-navbar-toggle { @include media-breakpoint-down(lg) { @@ -30,6 +38,7 @@ } .navbar-brand { + color: $white; transition: .2s ease-in-out transform; // stylelint-disable-line property-disallowed-list &:hover { @@ -60,7 +69,7 @@ } .offcanvas-lg { - background-color: var(--bd-violet); + background-color: var(--bd-violet-bg); border-left: 0; @include media-breakpoint-down(lg) { @@ -75,17 +84,42 @@ } .dropdown-menu { - --#{$prefix}dropdown-min-width: 12rem; - --#{$prefix}dropdown-link-hover-bg: rgba(var(--bd-violet-rgb), .1); - @include rfs(.875rem, --#{$prefix}dropdown-font-size); + --bs-dropdown-min-width: 12rem; + --bs-dropdown-padding-x: .25rem; + --bs-dropdown-padding-y: .25rem; + --bs-dropdown-link-hover-bg: rgba(var(--bd-violet-rgb), .1); + --bs-dropdown-link-active-bg: rgba(var(--bd-violet-rgb), 1); + @include rfs(.875rem, --bs-dropdown-font-size); + @include font-size(.875rem); + @include border-radius(.5rem); box-shadow: $dropdown-box-shadow; + + li + li { + margin-top: .125rem; + } + + .dropdown-item { + @include border-radius(.25rem); + + &:active { + .bi { + color: inherit !important; // stylelint-disable-line declaration-no-important + } + } + } + + .active { + font-weight: 600; + + .bi { + display: block !important; // stylelint-disable-line declaration-no-important + } + } } +} - .dropdown-item.current { - font-weight: 600; - background-image: escape-svg($dropdown-active-icon); - background-repeat: no-repeat; - background-position: right $dropdown-item-padding-x top .6rem; - background-size: .75rem .75rem; +@include color-mode(dark) { + .bd-navbar { + box-shadow: 0 .5rem 1rem rgba($black, .15), inset 0 -1px 0 rgba($white, .15); } } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss b/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss index ed76b3ca8..6f1ef292f 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss @@ -11,6 +11,17 @@ margin-left: -.25rem; overflow-y: auto; } + + @include media-breakpoint-down(lg) { + .offcanvas-lg { + border-right-color: var(--bs-border-color); + box-shadow: $box-shadow-lg; + } + } +} + +.bd-links-heading { + color: var(--bs-emphasis-color); } .bd-links-nav { @@ -35,16 +46,16 @@ .bd-links-link { padding: .1875rem .5rem; margin-top: .125rem; - margin-left: 1rem; - color: rgba($black, .65); + margin-left: 1.125rem; + color: var(--bs-body-color); text-decoration: if($link-decoration == none, null, none); &:hover, &:focus, &.active { - color: rgba($black, .85); + color: var(--bs-emphasis-color); text-decoration: if($link-hover-decoration == underline, none, null); - background-color: rgba(var(--bd-violet-rgb), .1); + background-color: var(--bd-sidebar-link-bg); } &.active { diff --git a/vendor/twbs/bootstrap/site/assets/scss/_syntax.scss b/vendor/twbs/bootstrap/site/assets/scss/_syntax.scss index 106032c07..092307e05 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_syntax.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_syntax.scss @@ -1,4 +1,5 @@ -:root { +:root, +[data-bs-theme="light"] { --base00: #fff; --base01: #f5f5f5; --base02: #c8c8fa; @@ -17,6 +18,25 @@ --base0F: #333; } +@include color-mode(dark, true) { + --base00: #282c34; + --base01: #353b45; + --base02: #3e4451; + --base03: #868e96; + --base04: #565c64; + --base05: #abb2bf; + --base06: #b6bdca; + --base07: #d19a66; + --base08: #e06c75; + --base09: #d19a66; + --base0A: #e5c07b; + --base0B: #98c379; + --base0C: #56b6c2; + --base0D: #61afef; + --base0E: #c678dd; + --base0F: #be5046; +} + .hl { background-color: var(--base02); } .c { color: var(--base03); } .err { color: var(--base08); } @@ -101,14 +121,14 @@ .language-bash, .language-sh { .line::before { - color: #777; + color: var(--base03); content: "$ "; user-select: none; } } .language-powershell::before { - color: #009; + color: var(--base0C); content: "PM> "; user-select: none; } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_toc.scss b/vendor/twbs/bootstrap/site/assets/scss/_toc.scss index 512a11b42..ffa6a0c44 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_toc.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_toc.scss @@ -52,15 +52,16 @@ } @include media-breakpoint-down(md) { - border: 1px solid $border-color; - @include border-radius(.4rem); + color: var(--bs-body-color); + border: 1px solid var(--bs-border-color); + @include border-radius(var(--bs-border-radius)); &:hover, &:focus, &:active, &[aria-expanded="true"] { color: var(--bd-violet); - background-color: $white; + background-color: var(--bs-body-bg); border-color: var(--bd-violet); } @@ -75,9 +76,9 @@ @include media-breakpoint-down(md) { nav { padding: 1.25rem; - background-color: var(--bs-gray-100); - border: 1px solid $border-color; - @include border-radius(.25rem); + background-color: var(--bs-tertiary-bg); + border: 1px solid var(--bs-border-color); + @include border-radius(var(--bs-border-radius)); } } diff --git a/vendor/twbs/bootstrap/site/assets/scss/_variables.scss b/vendor/twbs/bootstrap/site/assets/scss/_variables.scss index b460392d0..b3730ebef 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_variables.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_variables.scss @@ -5,12 +5,12 @@ $bd-purple: #4c0bce; $bd-violet: lighten(saturate($bd-purple, 5%), 15%); // stylelint-disable-line function-disallowed-list $bd-purple-light: lighten(saturate($bd-purple, 5%), 45%); // stylelint-disable-line function-disallowed-list $bd-accent: #ffe484; -$dropdown-active-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><path fill='#292b2c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/></svg>"); $bd-gutter-x: 3rem; $bd-callout-variants: info, warning, danger !default; -:root { +:root, +[data-bs-theme="light"] { --bd-purple: #{$bd-purple}; --bd-violet: #{$bd-violet}; --bd-accent: #{$bd-accent}; @@ -20,4 +20,13 @@ $bd-callout-variants: info, warning, danger !default; --bd-teal-rgb: #{to-rgb($teal-500)}; --docsearch-primary-color: var(--bd-violet); --docsearch-logo-color: var(--bd-violet); + + --bd-violet-bg: var(--bd-violet); + --bd-sidebar-link-bg: rgba(var(--bd-violet-rgb), .1); +} + +@include color-mode(dark, true) { + --bd-violet: #{mix($bd-violet, $white, 75%)}; + --bd-violet-bg: #{$bd-violet}; + --bd-sidebar-link-bg: rgba(#{to-rgb(mix($bd-violet, $black, 75%))}, .5); } diff --git a/vendor/twbs/bootstrap/site/assets/scss/docs.scss b/vendor/twbs/bootstrap/site/assets/scss/docs.scss index 521493461..509cc33fd 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/docs.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/docs.scss @@ -1,7 +1,6 @@ /*! * Bootstrap Docs (https://getbootstrap.com/) * Copyright 2011-2022 The Bootstrap Authors - * Copyright 2011-2022 Twitter, Inc. * Licensed under the Creative Commons Attribution 3.0 Unported License. * For details, see https://creativecommons.org/licenses/by/3.0/. */ |