diff options
Diffstat (limited to 'vendor/twbs/bootstrap-icons/docs/assets/scss')
9 files changed, 667 insertions, 0 deletions
diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/_ads.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_ads.scss new file mode 100644 index 000000000..27612c0a9 --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_ads.scss @@ -0,0 +1,54 @@ +// stylelint-disable-next-line selector-max-id +#carbonads { + max-width: 28rem; + padding: .75rem; + margin-right: auto; + margin-left: auto; + overflow: auto; + background-color: var(--bs-tertiary-bg); + border-radius: .25rem; + + @media (min-width: 992px) { + margin-right: 0; + margin-left: 0; + } +} + +.carbon-img { + float: left; + margin-right: .75rem; + + @media (min-width: 768px) { + margin-bottom: .5rem; + } + + @media (min-width: 992px) { + margin-bottom: 0; + } +} + +.carbon-text, +.carbon-poweredby { + display: block; + color: var(--bs-body-color); + + &:hover, + &:focus { + color: var(--bs-body-color); + text-decoration: none; + } +} + +.carbon-text { + margin-bottom: .5rem; + text-decoration: none; + + @media (min-width: 768px) { + font-size: .875rem; + } +} + +.carbon-poweredby { + margin-top: .75rem; + font-size: .875rem; +} diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/_buttons.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_buttons.scss new file mode 100644 index 000000000..13bd6e48a --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_buttons.scss @@ -0,0 +1,45 @@ +// Buttons +// +// Custom buttons for the docs. + +// scss-docs-start btn-css-vars-example +.btn-bd-primary { + --bs-btn-font-weight: 600; + --bs-btn-color: var(--bs-white); + --bs-btn-bg: var(--bd-violet); + --bs-btn-border-color: var(--bd-violet); + --bs-btn-border-radius: .5rem; + --bs-btn-hover-color: var(--bs-white); + --bs-btn-hover-bg: #{shade-color($bd-violet, 10%)}; + --bs-btn-hover-border-color: #{shade-color($bd-violet, 10%)}; + --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb); + --bs-btn-active-color: var(--bs-btn-hover-color); + --bs-btn-active-bg: #{shade-color($bd-violet, 20%)}; + --bs-btn-active-border-color: #{shade-color($bd-violet, 20%)}; +} +// scss-docs-end btn-css-vars-example + +.btn-bd-accent { + --bs-btn-font-weight: 600; + --bs-btn-color: var(--bd-accent); + --bs-btn-border-color: var(--bd-accent); + --bs-btn-hover-color: var(--bd-dark); + --bs-btn-hover-bg: var(--bd-accent); + --bs-btn-hover-border-color: var(--bd-accent); + --bs-btn-focus-shadow-rgb: var(--bd-accent-rgb); + --bs-btn-active-color: var(--bs-btn-hover-color); + --bs-btn-active-bg: var(--bs-btn-hover-bg); + --bs-btn-active-border-color: var(--bs-btn-hover-border-color); +} + +.btn-bd-light { + --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-active-bg: var(--bs-white); + --bs-btn-active-border-color: var(--bd-violet); + --bs-btn-focus-border-color: var(--bd-violet); + --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb); +} diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/_clipboard-js.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_clipboard-js.scss new file mode 100644 index 000000000..232b7f4dc --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_clipboard-js.scss @@ -0,0 +1,35 @@ +// clipboard.js +// +// JS-based `Copy` buttons for code snippets. + +.bd-clipboard { + position: relative; + display: none; + float: right; + + + .highlight { + margin-top: 0; + } + + @media (min-width: 768px) { + display: block; + } +} + +.btn-clipboard { + position: absolute; + top: .75em; + right: .5em; + z-index: 10; + display: block; + padding: .5em .75em .625em; + line-height: 1; + color: var(--bs-body-color); + background-color: var(--bs-tertiary-bg); + border: 0; + border-radius: .25rem; + + &:hover { + color: var(--bs-link-hover-color); + } +} diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/_footer.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_footer.scss new file mode 100644 index 000000000..42e1ca051 --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_footer.scss @@ -0,0 +1,16 @@ +// +// Footer +// + +.bd-footer { + a { + color: var(--bs-body-color); + text-decoration: none; + + &:hover, + &:focus { + color: var(--bs-link-hover-color); + text-decoration: underline; + } + } +} diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/_navbar.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_navbar.scss new file mode 100644 index 000000000..c16ada791 --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_navbar.scss @@ -0,0 +1,113 @@ +.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); + + .bi { + width: 1em; + height: 1em; + } + + .navbar-toggler { + padding: 0; + margin-right: -.5rem; + border: 0; + + &:first-child { + margin-left: -.5rem; + } + + .bi { + width: 1.5rem; + height: 1.5rem; + } + + &:focus { + box-shadow: none; + } + } + + .navbar-brand { + transition: .2s ease-in-out transform; + + &:hover { + transform: rotate(-5deg) scale(1.1); + } + } + + .navbar-toggler, + .nav-link { + padding-right: $spacer * .25; + padding-left: $spacer * .25; + color: rgba($white, .85); + + &:hover, + &:focus { + color: $white; + } + + &.active { + font-weight: 600; + color: $white; + } + } + + .navbar-nav-svg { + display: inline-block; + vertical-align: -.125rem; + } + + .offcanvas-lg { + background-color: var(--bd-violet); + border-left: 0; + + @media (max-width: 992px) { + box-shadow: $box-shadow-lg; + } + } + + .dropdown-menu { + --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-menu-end { + --bs-dropdown-min-width: 8rem; + } +} + +@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-icons/docs/assets/scss/_skippy.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_skippy.scss new file mode 100644 index 000000000..459c203a5 --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_skippy.scss @@ -0,0 +1,17 @@ +.skippy { + display: block; + padding: 1em; + color: #fff; + text-align: center; + background-color: $bd-purple; + outline: 0; + + &:hover { + color: #fff; + } +} + +.skippy-text { + padding: .5em; + outline: 1px dotted; +} diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/_syntax.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_syntax.scss new file mode 100644 index 000000000..092307e05 --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_syntax.scss @@ -0,0 +1,135 @@ +:root, +[data-bs-theme="light"] { + --base00: #fff; + --base01: #f5f5f5; + --base02: #c8c8fa; + --base03: #565c64; + --base04: #030303; + --base05: #333; + --base06: #fff; + --base07: #9a6700; + --base08: #bc4c00; + --base09: #087990; + --base0A: #795da3; + --base0B: #183691; + --base0C: #183691; + --base0D: #795da3; + --base0E: #a71d5d; + --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); } +.k { color: var(--base0E); } +.l { color: var(----base09); } +.n { color: var(--base08); } +.o { color: var(--base05); } +.p { color: var(--base05); } +.cm { color: var(--base04); } +.cp { color: var(--base08); } +.c1 { color: var(--base03); } +.cs { color: var(--base04); } +.gd { color: var(--base08); } +.ge { font-style: italic; } +.gh { + font-weight: 600; + color: #fff; +} +.gi { color: var(--bs-success); } +.gp { + font-weight: 600; + color: var(--base04); +} +.gs { font-weight: 600; } +.gu { + font-weight: 600; + color: var(--base0C); +} +.kc { color: var(--base0E); } +.kd { color: var(--base0E); } +.kn { color: var(--base0C); } +.kp { color: var(--base0E); } +.kr { color: var(--base0E); } +.kt { color: var(--base0A); } +.ld { color: var(--base0C); } +.m { color: var(--base09); } +.s { color: var(--base0C); } +.na { color: var(--base0A); } +.nb { color: var(--base05); } +.nc { color: var(--base07); } +.no { color: var(--base08); } +.nd { color: var(--base07); } +.ni { color: var(--base08); } +.ne { color: var(--base08); } +.nf { color: var(--base0B); } +.nl { color: var(--base05); } +.nn { color: var(--base0A); } +.nx { color: var(--base0A); } +.py { color: var(--base08); } +.nt { color: var(--base08); } +.nv { color: var(--base08); } +.ow { color: var(--base0C); } +.w { color: #fff; } +.mf { color: var(--base09); } +.mh { color: var(--base09); } +.mi { color: var(--base09); } +.mo { color: var(--base09); } +.sb { color: var(--base0C); } +.sc { color: #fff; } +.sd { color: var(--base04); } +.s2 { color: var(--base0C); } +.se { color: var(--base09); } +.sh { color: var(--base0C); } +.si { color: var(--base09); } +.sx { color: var(--base0C); } +.sr { color: var(--base0C); } +.s1 { color: var(--base0C); } +.ss { color: var(--base0C); } +.bp { color: var(--base05); } +.vc { color: var(--base08); } +.vg { color: var(--base08); } +.vi { color: var(--base08); } +.il { color: var(--base09); } + +// Color commas in rgba() values +.m + .o { color: var(--base03); } + +// Fix bash +.language-sh .c { color: var(--base03); } + +.chroma { + .language-bash, + .language-sh { + .line::before { + color: var(--base03); + content: "$ "; + user-select: none; + } + } + + .language-powershell::before { + color: var(--base0C); + content: "PM> "; + user-select: none; + } +} diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/_variables.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/_variables.scss new file mode 100644 index 000000000..167b89df1 --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/_variables.scss @@ -0,0 +1,15 @@ +// Local docs variables +$bd-purple: #4c0bce; +$bd-violet: lighten(saturate($bd-purple, 5%), 15%); +$bd-accent: #ffe484; +$bd-gutter-x: 3rem; + +:root { + --bd-purple: #{$bd-purple}; + --bd-violet: #{$bd-violet}; + --bd-accent: #{$bd-accent}; + --bd-violet-rgb: #{to-rgb($bd-violet)}; + --bd-accent-rgb: #{to-rgb($bd-accent)}; + --bd-pink-rgb: #{to-rgb($pink-500)}; + --bd-teal-rgb: #{to-rgb($teal-500)}; +} diff --git a/vendor/twbs/bootstrap-icons/docs/assets/scss/docs.scss b/vendor/twbs/bootstrap-icons/docs/assets/scss/docs.scss new file mode 100644 index 000000000..a3ae687e9 --- /dev/null +++ b/vendor/twbs/bootstrap-icons/docs/assets/scss/docs.scss @@ -0,0 +1,237 @@ +@import "bootstrap/functions"; +@import "bootstrap/variables"; +@import "bootstrap/variables-dark"; +@import "bootstrap/maps"; +@import "bootstrap/mixins"; +@import "bootstrap/utilities"; +@import "bootstrap/root"; +@import "bootstrap/reboot"; +@import "bootstrap/type"; +@import "bootstrap/images"; +@import "bootstrap/containers"; +@import "bootstrap/grid"; +@import "bootstrap/tables"; +@import "bootstrap/forms"; +@import "bootstrap/buttons"; +@import "bootstrap/transitions"; +@import "bootstrap/dropdown"; +@import "bootstrap/button-group"; +@import "bootstrap/nav"; +@import "bootstrap/navbar"; +// @import "bootstrap/card"; +// @import "bootstrap/accordion"; +@import "bootstrap/breadcrumb"; +// @import "bootstrap/pagination"; +// @import "bootstrap/badge"; +// @import "bootstrap/alert"; +// @import "bootstrap/progress"; +// @import "bootstrap/list-group"; +@import "bootstrap/close"; +// @import "bootstrap/toasts"; +// @import "bootstrap/modal"; +// @import "bootstrap/tooltip"; +// @import "bootstrap/popover"; +// @import "bootstrap/carousel"; +// @import "bootstrap/spinners"; +@import "bootstrap/offcanvas"; +// @import "bootstrap/placeholders"; +@import "bootstrap/helpers"; +@import "bootstrap/utilities/api"; + +@import "variables"; +@import "buttons"; +@import "clipboard-js"; +@import "navbar"; +@import "skippy"; +@import "footer"; +@import "syntax"; +@import "ads"; + +:root { + color-scheme: light dark; +} + +.bd-gutter { + --bs-gutter-x: #{$bd-gutter-x}; +} + +.bi { + display: inline-block; + vertical-align: -.125em; + fill: currentcolor; +} + +.hero-notice { + color: var(--bs-info-text); + background-color: var(--bs-info-bg-subtle); + border: 1px solid var(--bs-info-border-subtle); + + @media (min-width: 540px) { + border-radius: 5em !important; // stylelint-disable-line declaration-no-important + } +} + +.btn-figma { + --bs-btn-color: var(--bs-emphasis-color); + --bs-btn-border-color: var(--bs-emphasis-color); + --bs-btn-hover-color: var(--bs-body-bg); + --bs-btn-hover-bg: var(--bs-emphasis-color); + --bs-btn-hover-border-color: var(--bs-btn-hover-bg); +} + +.highlight { + position: relative; + padding: 1.25rem; + margin-bottom: 1rem; + background-color: var(--bs-tertiary-bg); + border-radius: var(--bs-border-radius); + + pre { + padding: 0; + margin-bottom: 0; + white-space: pre; + background-color: transparent; + border: 0; + } + + pre code { + @include font-size(inherit); + word-wrap: normal; + } +} + + +.bd-example { + padding: 1.25rem; + border: 1px solid var(--bs-border-color); + border-top-left-radius: .25rem; + border-top-right-radius: .25rem; + + + .bd-clipboard + .highlight { + border: 1px solid var(--bs-border-color); + border-width: 0 1px 1px; + border-top-left-radius: 0; + border-top-right-radius: 0; + } +} + +.f0 { + font-size: 2rem; + + @media (min-width: 520px) { + font-size: 3rem; + } +} +.f3 { + font-size: 1.25rem; + + @media (min-width: 520px) { + font-size: 1.5rem; + } +} +.f5 { + font-size: 1rem; +} + +.hero { + border-bottom: 1px solid var(--bs-border-color-translucent); + + .highlight { + margin-bottom: 0; + background-color: var(--bs-tertiary-bg); + border-radius: .5rem; + + pre { + margin-bottom: 0; + + @media (min-width: 768px) { + padding-right: 4em; + } + } + } + + .btn-clipboard { + top: .5em; + background-color: var(--bs-tertiary-bg); + } + + .btn { + padding: 1rem 1.25rem; + border-radius: .5rem; + } + + hr { + max-width: 100px; + } +} + +.icon-search { + @media (min-width: 768px) { + width: 35%; + } +} + +.list { + font-size: 2rem; + + // stylelint-disable declaration-no-important + a:hover, + a:focus { + &, + .name { + color: var(--bs-link-hover-color) !important; + } + } + // stylelint-enable declaration-no-important + + &:empty::before { + display: block; + width: 100%; + padding: 100px 2rem; + margin-right: 15px; + margin-left: 15px; + color: var(--bs-secondary-color); + text-align: center; + content: "Nothing found, try searching again."; + background-color: var(--bs-secondary-bg); + border-radius: .5rem; + } +} + +.btn-group > .btn { + flex-shrink: 0; +} + +.name { + font-size: .8125rem; +} + +@media (min-width: 1200px) { + .row-cols-xl-8 { + > * { + flex: 0 0 12.5%; + max-width: 12.5%; + } + } +} + +.icon-demo { + background-color: var(--bs-tertiary-bg); + background-image: radial-gradient(circle, var(--bs-border-color) 1px, rgba(0, 0, 0, 0) 1px); + background-size: 1rem 1rem; +} + +.icon-demo, +.icon-demo-examples { + .bi { + width: 1em; + height: 1em; + } +} + +// stylelint-disable declaration-no-important +.py-6 { + padding-top: 4.5rem !important; + padding-bottom: 4.5rem !important; +} +// stylelint-enable declaration-no-important |