diff options
Diffstat (limited to 'dist/css/bootstrap.rtl.css')
| -rw-r--r-- | dist/css/bootstrap.rtl.css | 644 |
1 files changed, 384 insertions, 260 deletions
diff --git a/dist/css/bootstrap.rtl.css b/dist/css/bootstrap.rtl.css index 9d9f656aa..f34efd9f7 100644 --- a/dist/css/bootstrap.rtl.css +++ b/dist/css/bootstrap.rtl.css @@ -1,8 +1,8 @@ @charset "UTF-8"; /*! - * Bootstrap v5.0.0-alpha3 (https://getbootstrap.com/) - * Copyright 2011-2020 The Bootstrap Authors - * Copyright 2011-2020 Twitter, Inc. + * Bootstrap v5.0.0-beta3 (https://getbootstrap.com/) + * Copyright 2011-2021 The Bootstrap Authors + * Copyright 2011-2021 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */ :root { @@ -56,10 +56,6 @@ body { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } -[tabindex="-1"]:focus:not(:focus-visible) { - outline: 0 !important; -} - hr { margin: 1rem 0; color: inherit; @@ -130,7 +126,6 @@ p { abbr[title], abbr[data-bs-original-title] { - text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted; cursor: help; @@ -309,9 +304,8 @@ button { border-radius: 0; } -button:focus { - outline: dotted 1px; - outline: -webkit-focus-ring-color auto 5px; +button:focus:not(:focus-visible) { + outline: 0; } input, @@ -337,6 +331,9 @@ select { select { word-wrap: normal; } +select:disabled { + opacity: 1; +} [list]::-webkit-calendar-picker-indicator { display: none; @@ -1937,8 +1934,8 @@ progress { .table > :not(caption) > * > * { padding: 0.5rem 0.5rem; background-color: var(--bs-table-bg); - background-image: linear-gradient(var(--bs-table-accent-bg), var(--bs-table-accent-bg)); border-bottom-width: 1px; + box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); } .table > tbody { vertical-align: inherit; @@ -2183,10 +2180,6 @@ progress { .form-control::-webkit-date-and-time-value { height: 1.5em; } -.form-control::-webkit-input-placeholder { - color: #6c757d; - opacity: 1; -} .form-control::-moz-placeholder { color: #6c757d; opacity: 1; @@ -2332,12 +2325,11 @@ textarea.form-control-lg { .form-select { display: block; width: 100%; - padding: 0.375rem 0.75rem 0.375rem 1.75rem; + padding: 0.375rem 0.75rem 0.375rem 2.25rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; - vertical-align: middle; background-color: #fff; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"); background-repeat: no-repeat; @@ -2359,7 +2351,6 @@ textarea.form-control-lg { background-image: none; } .form-select:disabled { - color: #6c757d; background-color: #e9ecef; } .form-select:-moz-focusring { @@ -2407,12 +2398,6 @@ textarea.form-control-lg { appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; - transition: background-color 0.15s ease-in-out, background-position 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -} -@media (prefers-reduced-motion: reduce) { - .form-check-input { - transition: none; - } } .form-check-input[type=checkbox] { border-radius: 0.25em; @@ -2461,6 +2446,12 @@ textarea.form-control-lg { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e"); background-position: right center; border-radius: 2em; + transition: background-position 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { + .form-switch .form-check-input { + transition: none; + } } .form-switch .form-check-input:focus { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2386b7fe'/%3e%3c/svg%3e"); @@ -2496,7 +2487,7 @@ textarea.form-control-lg { appearance: none; } .form-range:focus { - outline: none; + outline: 0; } .form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); @@ -2600,9 +2591,6 @@ textarea.form-control-lg { transition: none; } } -.form-floating > .form-control::-webkit-input-placeholder { - color: transparent; -} .form-floating > .form-control::-moz-placeholder { color: transparent; } @@ -2701,7 +2689,7 @@ textarea.form-control-lg { .input-group-lg > .form-select, .input-group-sm > .form-select { - padding-left: 1.75rem; + padding-left: 3rem; } .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu), @@ -2769,9 +2757,9 @@ textarea.form-control-lg { .was-validated .form-select:valid, .form-select.is-valid { border-color: #198754; - padding-left: calc(0.75em + 2.3125rem); + padding-left: 4.125rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' 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'/%3e%3c/svg%3e"); - background-position: left 0.75rem center, center left 1.75rem; + background-position: left 0.75rem center, center left 2.25rem; background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } .was-validated .form-select:valid:focus, .form-select.is-valid:focus { @@ -2796,6 +2784,12 @@ textarea.form-control-lg { margin-right: 0.5em; } +.was-validated .input-group .form-control:valid, .input-group .form-control.is-valid, +.was-validated .input-group .form-select:valid, +.input-group .form-select.is-valid { + z-index: 3; +} + .invalid-feedback { display: none; width: 100%; @@ -2845,9 +2839,9 @@ textarea.form-control-lg { .was-validated .form-select:invalid, .form-select.is-invalid { border-color: #dc3545; - padding-left: calc(0.75em + 2.3125rem); + padding-left: 4.125rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); - background-position: left 0.75rem center, center left 1.75rem; + background-position: left 0.75rem center, center left 2.25rem; background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } .was-validated .form-select:invalid:focus, .form-select.is-invalid:focus { @@ -2872,6 +2866,12 @@ textarea.form-control-lg { margin-right: 0.5em; } +.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid, +.was-validated .input-group .form-select:invalid, +.input-group .form-select.is-invalid { + z-index: 3; +} + .btn { display: inline-block; font-weight: 400; @@ -3426,12 +3426,11 @@ textarea.form-control-lg { .dropdown-menu { position: absolute; top: 100%; - right: 0; z-index: 1000; display: none; min-width: 10rem; padding: 0.5rem 0; - margin: 0.125rem 0 0; + margin: 0; font-size: 1rem; color: #212529; text-align: right; @@ -3441,73 +3440,113 @@ textarea.form-control-lg { border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.25rem; } +.dropdown-menu[data-bs-popper] { + right: 0; + margin-top: 0.125rem; +} .dropdown-menu-start { + --bs-position: start; +} +.dropdown-menu-start[data-bs-popper] { right: auto ; left: 0 ; } .dropdown-menu-end { + --bs-position: end; +} +.dropdown-menu-end[data-bs-popper] { right: 0 ; left: auto ; } @media (min-width: 576px) { .dropdown-menu-sm-start { + --bs-position: start; + } + .dropdown-menu-sm-start[data-bs-popper] { right: auto ; left: 0 ; } .dropdown-menu-sm-end { + --bs-position: end; + } + .dropdown-menu-sm-end[data-bs-popper] { right: 0 ; left: auto ; } } @media (min-width: 768px) { .dropdown-menu-md-start { + --bs-position: start; + } + .dropdown-menu-md-start[data-bs-popper] { right: auto ; left: 0 ; } .dropdown-menu-md-end { + --bs-position: end; + } + .dropdown-menu-md-end[data-bs-popper] { right: 0 ; left: auto ; } } @media (min-width: 992px) { .dropdown-menu-lg-start { + --bs-position: start; + } + .dropdown-menu-lg-start[data-bs-popper] { right: auto ; left: 0 ; } .dropdown-menu-lg-end { + --bs-position: end; + } + .dropdown-menu-lg-end[data-bs-popper] { right: 0 ; left: auto ; } } @media (min-width: 1200px) { .dropdown-menu-xl-start { + --bs-position: start; + } + .dropdown-menu-xl-start[data-bs-popper] { right: auto ; left: 0 ; } .dropdown-menu-xl-end { + --bs-position: end; + } + .dropdown-menu-xl-end[data-bs-popper] { right: 0 ; left: auto ; } } @media (min-width: 1400px) { .dropdown-menu-xxl-start { + --bs-position: start; + } + .dropdown-menu-xxl-start[data-bs-popper] { right: auto ; left: 0 ; } .dropdown-menu-xxl-end { + --bs-position: end; + } + .dropdown-menu-xxl-end[data-bs-popper] { right: 0 ; left: auto ; } } -.dropup .dropdown-menu { +.dropup .dropdown-menu[data-bs-popper] { top: auto; bottom: 100%; margin-top: 0; @@ -3531,6 +3570,8 @@ textarea.form-control-lg { top: 0; left: auto; right: 100%; +} +.dropend .dropdown-menu[data-bs-popper] { margin-top: 0; margin-right: 0.125rem; } @@ -3555,6 +3596,8 @@ textarea.form-control-lg { top: 0; left: 100%; right: auto; +} +.dropstart .dropdown-menu[data-bs-popper] { margin-top: 0; margin-left: 0.125rem; } @@ -3583,12 +3626,6 @@ textarea.form-control-lg { vertical-align: 0; } -.dropdown-menu[x-placement^=top], .dropdown-menu[x-placement^=right], .dropdown-menu[x-placement^=bottom], .dropdown-menu[x-placement^=left] { - left: auto; - bottom: auto; - right: auto; -} - .dropdown-divider { height: 0; margin: 0.5rem 0; @@ -3611,7 +3648,7 @@ textarea.form-control-lg { } .dropdown-item:hover, .dropdown-item:focus { color: #1e2125; - background-color: #f8f9fa; + background-color: #e9ecef; } .dropdown-item.active, .dropdown-item:active { color: #fff; @@ -3619,7 +3656,7 @@ textarea.form-control-lg { background-color: #0d6efd; } .dropdown-item.disabled, .dropdown-item:disabled { - color: #6c757d; + color: #adb5bd; pointer-events: none; background-color: transparent; } @@ -3798,12 +3835,14 @@ textarea.form-control-lg { } .nav-tabs .nav-link { margin-bottom: -1px; + background: none; border: 1px solid transparent; border-top-right-radius: 0.25rem; border-top-left-radius: 0.25rem; } .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { border-color: #e9ecef #e9ecef #dee2e6; + isolation: isolate; } .nav-tabs .nav-link.disabled { color: #6c757d; @@ -3823,6 +3862,8 @@ textarea.form-control-lg { } .nav-pills .nav-link { + background: none; + border: 0; border-radius: 0.25rem; } .nav-pills .nav-link.active, @@ -3844,6 +3885,11 @@ textarea.form-control-lg { text-align: center; } +.nav-fill .nav-item .nav-link, +.nav-justified .nav-item .nav-link { + width: 100%; +} + .tab-content > .tab-pane { display: none; } @@ -3901,8 +3947,9 @@ textarea.form-control-lg { } .navbar-collapse { + flex-basis: 100%; + flex-grow: 1; align-items: center; - width: 100%; } .navbar-toggler { @@ -3938,6 +3985,11 @@ textarea.form-control-lg { background-size: 100%; } +.navbar-nav-scroll { + max-height: var(--bs-scroll-height, 75vh); + overflow-y: auto; +} + @media (min-width: 576px) { .navbar-expand-sm { flex-wrap: nowrap; @@ -3953,8 +4005,12 @@ textarea.form-control-lg { padding-left: 0.5rem; padding-right: 0.5rem; } + .navbar-expand-sm .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-sm .navbar-collapse { display: flex !important; + flex-basis: auto; } .navbar-expand-sm .navbar-toggler { display: none; @@ -3975,8 +4031,12 @@ textarea.form-control-lg { padding-left: 0.5rem; padding-right: 0.5rem; } + .navbar-expand-md .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-md .navbar-collapse { display: flex !important; + flex-basis: auto; } .navbar-expand-md .navbar-toggler { display: none; @@ -3997,8 +4057,12 @@ textarea.form-control-lg { padding-left: 0.5rem; padding-right: 0.5rem; } + .navbar-expand-lg .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-lg .navbar-collapse { display: flex !important; + flex-basis: auto; } .navbar-expand-lg .navbar-toggler { display: none; @@ -4019,8 +4083,12 @@ textarea.form-control-lg { padding-left: 0.5rem; padding-right: 0.5rem; } + .navbar-expand-xl .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-xl .navbar-collapse { display: flex !important; + flex-basis: auto; } .navbar-expand-xl .navbar-toggler { display: none; @@ -4041,8 +4109,12 @@ textarea.form-control-lg { padding-left: 0.5rem; padding-right: 0.5rem; } + .navbar-expand-xxl .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-xxl .navbar-collapse { display: flex !important; + flex-basis: auto; } .navbar-expand-xxl .navbar-toggler { display: none; @@ -4062,8 +4134,12 @@ textarea.form-control-lg { padding-left: 0.5rem; padding-right: 0.5rem; } +.navbar-expand .navbar-nav-scroll { + overflow: visible; +} .navbar-expand .navbar-collapse { display: flex !important; + flex-basis: auto; } .navbar-expand .navbar-toggler { display: none; @@ -4195,7 +4271,7 @@ textarea.form-control-lg { text-decoration: none; } .card-link + .card-link { - margin-left: 1rem ; + margin-right: 1rem; } .card-header { @@ -4307,8 +4383,9 @@ textarea.form-control-lg { padding: 1rem 1.25rem; font-size: 1rem; color: #212529; - background-color: transparent; - border: 1px solid rgba(0, 0, 0, 0.125); + text-align: right; + background-color: #fff; + border: 0; border-radius: 0; overflow-anchor: none; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease; @@ -4318,12 +4395,10 @@ textarea.form-control-lg { transition: none; } } -.accordion-button.collapsed { - border-bottom-width: 0; -} .accordion-button:not(.collapsed) { color: #0c63e4; background-color: #e7f1ff; + box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.125); } .accordion-button:not(.collapsed)::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); @@ -4359,47 +4434,53 @@ textarea.form-control-lg { margin-bottom: 0; } -.accordion-item:first-of-type .accordion-button { +.accordion-item { + margin-bottom: -1px; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); +} +.accordion-item:first-of-type { border-top-right-radius: 0.25rem; border-top-left-radius: 0.25rem; } -.accordion-item:last-of-type .accordion-button.collapsed { - border-bottom-width: 1px; +.accordion-item:first-of-type .accordion-button { + border-top-right-radius: calc(0.25rem - 1px); + border-top-left-radius: calc(0.25rem - 1px); +} +.accordion-item:last-of-type { + margin-bottom: 0; border-bottom-left-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } +.accordion-item:last-of-type .accordion-button.collapsed { + border-bottom-left-radius: calc(0.25rem - 1px); + border-bottom-right-radius: calc(0.25rem - 1px); +} .accordion-item:last-of-type .accordion-collapse { - border-bottom-width: 1px; border-bottom-left-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } -.accordion-collapse { - border: solid rgba(0, 0, 0, 0.125); - border-width: 0 1px; -} - .accordion-body { padding: 1rem 1.25rem; } -.accordion-flush .accordion-button { +.accordion-flush .accordion-collapse { + border-width: 0; +} +.accordion-flush .accordion-item { border-left: 0; border-right: 0; border-radius: 0; } -.accordion-flush .accordion-collapse { - border-width: 0; +.accordion-flush .accordion-item:first-child { + border-top: 0; } -.accordion-flush .accordion-item:first-of-type .accordion-button { - border-top-width: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; +.accordion-flush .accordion-item:last-child { + border-bottom: 0; } -.accordion-flush .accordion-item:last-of-type .accordion-button.collapsed { - border-bottom-width: 0; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; +.accordion-flush .accordion-item .accordion-button { + border-radius: 0; } .breadcrumb { @@ -4693,6 +4774,15 @@ textarea.form-control-lg { border-radius: 0.25rem; } +.list-group-numbered { + list-style-type: none; + counter-reset: section; +} +.list-group-numbered > li::before { + content: counters(section, ".") ". "; + counter-increment: section; +} + .list-group-item-action { width: 100%; color: #495057; @@ -4713,6 +4803,7 @@ textarea.form-control-lg { position: relative; display: block; padding: 0.5rem 1rem; + color: #212529; text-decoration: none; background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.125); @@ -5026,7 +5117,7 @@ textarea.form-control-lg { opacity: 0.75; } .btn-close:focus { - outline: none; + outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); opacity: 1; } @@ -5043,29 +5134,34 @@ textarea.form-control-lg { } .toast { - max-width: 350px; + width: 350px; + max-width: 100%; font-size: 0.875rem; + pointer-events: auto; background-color: rgba(255, 255, 255, 0.85); background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); - opacity: 0; border-radius: 0.25rem; } -.toast:not(:last-child) { - margin-bottom: 0.75rem; -} -.toast.showing { - opacity: 1; -} -.toast.show { - display: block; - opacity: 1; +.toast:not(.showing):not(.show) { + opacity: 0; } .toast.hide { display: none; } +.toast-container { + width: -webkit-max-content; + width: -moz-max-content; + width: max-content; + max-width: 100%; + pointer-events: none; +} +.toast-container > :not(:last-child) { + margin-bottom: 0.75rem; +} + .toast-header { display: flex; align-items: center; @@ -5084,6 +5180,7 @@ textarea.form-control-lg { .toast-body { padding: 0.75rem; + word-wrap: break-word; } .modal-open { @@ -5098,7 +5195,7 @@ textarea.form-control-lg { position: fixed; top: 0; right: 0; - z-index: 1050; + z-index: 1060; display: none; width: 100%; height: 100%; @@ -5162,7 +5259,7 @@ textarea.form-control-lg { position: fixed; top: 0; right: 0; - z-index: 1040; + z-index: 1050; width: 100vw; height: 100vh; background-color: #000; @@ -5385,7 +5482,7 @@ textarea.form-control-lg { } .tooltip { position: absolute; - z-index: 1070; + z-index: 1080; display: block; margin: 0; font-family: var(--bs-font-sans-serif); @@ -5422,56 +5519,56 @@ textarea.form-control-lg { border-style: solid; } -.bs-tooltip-top, .bs-tooltip-auto[x-placement^=top] { +.bs-tooltip-top, .bs-tooltip-auto[data-popper-placement^=top] { padding: 0.4rem 0; } -.bs-tooltip-top .tooltip-arrow, .bs-tooltip-auto[x-placement^=top] .tooltip-arrow { +.bs-tooltip-top .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow { bottom: 0; } -.bs-tooltip-top .tooltip-arrow::before, .bs-tooltip-auto[x-placement^=top] .tooltip-arrow::before { - top: 0; +.bs-tooltip-top .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before { + top: -1px; border-width: 0.4rem 0.4rem 0; border-top-color: #000; } -.bs-tooltip-end, .bs-tooltip-auto[x-placement^=right] { +.bs-tooltip-end, .bs-tooltip-auto[data-popper-placement^=right] { padding: 0 0.4rem; } -.bs-tooltip-end .tooltip-arrow, .bs-tooltip-auto[x-placement^=right] .tooltip-arrow { - left: 0 ; +.bs-tooltip-end .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow { + right: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-end .tooltip-arrow::before, .bs-tooltip-auto[x-placement^=right] .tooltip-arrow::before { - right: 0 ; - border-width: 0.4rem 0.4rem 0.4rem 0 ; - border-right-color: #000 ; +.bs-tooltip-end .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before { + left: -1px; + border-width: 0.4rem 0 0.4rem 0.4rem; + border-left-color: #000; } -.bs-tooltip-bottom, .bs-tooltip-auto[x-placement^=bottom] { +.bs-tooltip-bottom, .bs-tooltip-auto[data-popper-placement^=bottom] { padding: 0.4rem 0; } -.bs-tooltip-bottom .tooltip-arrow, .bs-tooltip-auto[x-placement^=bottom] .tooltip-arrow { +.bs-tooltip-bottom .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow { top: 0; } -.bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[x-placement^=bottom] .tooltip-arrow::before { - bottom: 0; +.bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before { + bottom: -1px; border-width: 0 0.4rem 0.4rem; border-bottom-color: #000; } -.bs-tooltip-start, .bs-tooltip-auto[x-placement^=left] { +.bs-tooltip-start, .bs-tooltip-auto[data-popper-placement^=left] { padding: 0 0.4rem; } -.bs-tooltip-start .tooltip-arrow, .bs-tooltip-auto[x-placement^=left] .tooltip-arrow { - right: 0 ; +.bs-tooltip-start .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow { + left: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-start .tooltip-arrow::before, .bs-tooltip-auto[x-placement^=left] .tooltip-arrow::before { - left: 0 ; - border-width: 0.4rem 0 0.4rem 0.4rem ; - border-left-color: #000 ; +.bs-tooltip-start .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before { + right: -1px; + border-width: 0.4rem 0.4rem 0.4rem 0; + border-right-color: #000; } .tooltip-inner { @@ -5487,7 +5584,7 @@ textarea.form-control-lg { position: absolute; top: 0; left: 0 ; - z-index: 1060; + z-index: 1070; display: block; max-width: 276px; font-family: var(--bs-font-sans-serif); @@ -5516,7 +5613,6 @@ textarea.form-control-lg { display: block; width: 1rem; height: 0.5rem; - margin: 0 0.3rem; } .popover .popover-arrow::before, .popover .popover-arrow::after { position: absolute; @@ -5526,60 +5622,50 @@ textarea.form-control-lg { border-style: solid; } -.bs-popover-top, .bs-popover-auto[x-placement^=top] { - margin-bottom: 0.5rem; -} -.bs-popover-top > .popover-arrow, .bs-popover-auto[x-placement^=top] > .popover-arrow { +.bs-popover-top > .popover-arrow, .bs-popover-auto[data-popper-placement^=top] > .popover-arrow { bottom: calc(-0.5rem - 1px); } -.bs-popover-top > .popover-arrow::before, .bs-popover-auto[x-placement^=top] > .popover-arrow::before { +.bs-popover-top > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=top] > .popover-arrow::before { bottom: 0; border-width: 0.5rem 0.5rem 0; border-top-color: rgba(0, 0, 0, 0.25); } -.bs-popover-top > .popover-arrow::after, .bs-popover-auto[x-placement^=top] > .popover-arrow::after { +.bs-popover-top > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=top] > .popover-arrow::after { bottom: 1px; border-width: 0.5rem 0.5rem 0; border-top-color: #fff; } -.bs-popover-end, .bs-popover-auto[x-placement^=right] { - margin-left: 0.5rem ; -} -.bs-popover-end > .popover-arrow, .bs-popover-auto[x-placement^=right] > .popover-arrow { - left: calc(-0.5rem - 1px) ; +.bs-popover-end > .popover-arrow, .bs-popover-auto[data-popper-placement^=right] > .popover-arrow { + right: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; - margin: 0.3rem 0; } -.bs-popover-end > .popover-arrow::before, .bs-popover-auto[x-placement^=right] > .popover-arrow::before { - left: 0 ; - border-width: 0.5rem 0.5rem 0.5rem 0 ; - border-right-color: rgba(0, 0, 0, 0.25) ; +.bs-popover-end > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=right] > .popover-arrow::before { + right: 0; + border-width: 0.5rem 0 0.5rem 0.5rem; + border-left-color: rgba(0, 0, 0, 0.25); } -.bs-popover-end > .popover-arrow::after, .bs-popover-auto[x-placement^=right] > .popover-arrow::after { - left: 1px ; - border-width: 0.5rem 0.5rem 0.5rem 0 ; - border-right-color: #fff ; +.bs-popover-end > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=right] > .popover-arrow::after { + right: 1px; + border-width: 0.5rem 0 0.5rem 0.5rem; + border-left-color: #fff; } -.bs-popover-bottom, .bs-popover-auto[x-placement^=bottom] { - margin-top: 0.5rem; -} -.bs-popover-bottom > .popover-arrow, .bs-popover-auto[x-placement^=bottom] > .popover-arrow { +.bs-popover-bottom > .popover-arrow, .bs-popover-auto[data-popper-placement^=bottom] > .popover-arrow { top: calc(-0.5rem - 1px); } -.bs-popover-bottom > .popover-arrow::before, .bs-popover-auto[x-placement^=bottom] > .popover-arrow::before { +.bs-popover-bottom > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=bottom] > .popover-arrow::before { top: 0; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: rgba(0, 0, 0, 0.25); } -.bs-popover-bottom > .popover-arrow::after, .bs-popover-auto[x-placement^=bottom] > .popover-arrow::after { +.bs-popover-bottom > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=bottom] > .popover-arrow::after { top: 1px; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: #fff; } -.bs-popover-bottom .popover-header::before, .bs-popover-auto[x-placement^=bottom] .popover-header::before { +.bs-popover-bottom .popover-header::before, .bs-popover-auto[data-popper-placement^=bottom] .popover-header::before { position: absolute; top: 0; right: 50%; @@ -5590,24 +5676,20 @@ textarea.form-control-lg { border-bottom: 1px solid #f0f0f0; } -.bs-popover-start, .bs-popover-auto[x-placement^=left] { - margin-right: 0.5rem ; -} -.bs-popover-start > .popover-arrow, .bs-popover-auto[x-placement^=left] > .popover-arrow { - right: calc(-0.5rem - 1px) ; +.bs-popover-start > .popover-arrow, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow { + left: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; - margin: 0.3rem 0; } -.bs-popover-start > .popover-arrow::before, .bs-popover-auto[x-placement^=left] > .popover-arrow::before { - right: 0 ; - border-width: 0.5rem 0 0.5rem 0.5rem ; - border-left-color: rgba(0, 0, 0, 0.25) ; +.bs-popover-start > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow::before { + left: 0; + border-width: 0.5rem 0.5rem 0.5rem 0; + border-right-color: rgba(0, 0, 0, 0.25); } -.bs-popover-start > .popover-arrow::after, .bs-popover-auto[x-placement^=left] > .popover-arrow::after { - right: 1px ; - border-width: 0.5rem 0 0.5rem 0.5rem ; - border-left-color: #fff ; +.bs-popover-start > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow::after { + left: 1px; + border-width: 0.5rem 0.5rem 0.5rem 0; + border-right-color: #fff; } .popover-header { @@ -5711,8 +5793,11 @@ textarea.form-control-lg { align-items: center; justify-content: center; width: 15%; + padding: 0; color: #fff; text-align: center; + background: none; + border: 0; opacity: 0.5; transition: opacity 0.15s ease; } @@ -5764,29 +5849,32 @@ textarea.form-control-lg { z-index: 2; display: flex; justify-content: center; - padding-right: 0; + padding: 0; margin-left: 15%; + margin-bottom: 1rem; margin-right: 15%; list-style: none; } -.carousel-indicators li { +.carousel-indicators [data-bs-target] { box-sizing: content-box; flex: 0 1 auto; width: 30px; height: 3px; + padding: 0; margin-left: 3px; margin-right: 3px; text-indent: -999px; cursor: pointer; background-color: #fff; background-clip: padding-box; + border: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; opacity: 0.5; transition: opacity 0.6s ease; } @media (prefers-reduced-motion: reduce) { - .carousel-indicators li { + .carousel-indicators [data-bs-target] { transition: none; } } @@ -5809,7 +5897,7 @@ textarea.form-control-lg { .carousel-dark .carousel-control-prev-icon { filter: invert(1) grayscale(100); } -.carousel-dark .carousel-indicators li { +.carousel-dark .carousel-indicators [data-bs-target] { background-color: #000; } .carousel-dark .carousel-caption { @@ -5888,6 +5976,86 @@ textarea.form-control-lg { animation-duration: 1.5s; } } +.offcanvas { + position: fixed; + bottom: 0; + z-index: 1040; + display: flex; + flex-direction: column; + max-width: 100%; + visibility: hidden; + background-color: #fff; + background-clip: padding-box; + outline: 0; + transition: transform 0.3s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { + .offcanvas { + transition: none; + } +} + +.offcanvas-header { + display: flex; + justify-content: space-between; + padding: 1rem 1rem; +} +.offcanvas-header .btn-close { + padding: 0.5rem 0.5rem; + margin: -0.5rem auto -0.5rem -0.5rem; +} + +.offcanvas-title { + margin-bottom: 0; + line-height: 1.5; +} + +.offcanvas-body { + flex-grow: 1; + padding: 1rem 1rem; + overflow-y: auto; +} + +.offcanvas-start { + top: 0; + right: 0; + width: 400px; + border-left: 1px solid rgba(0, 0, 0, 0.2); + transform: translateX(100%); +} + +.offcanvas-end { + top: 0; + left: 0; + width: 400px; + border-right: 1px solid rgba(0, 0, 0, 0.2); + transform: translateX(-100%); +} + +.offcanvas-bottom { + left: 0; + right: 0; + height: 30vh; + max-height: 100%; + border-top: 1px solid rgba(0, 0, 0, 0.2); + transform: translateY(100%); +} + +.offcanvas.show { + transform: none; +} + +.offcanvas-backdrop::before { + position: fixed; + top: 0; + right: 0; + z-index: 1039; + width: 100vw; + height: 100vh; + content: ""; + background-color: rgba(0, 0, 0, 0.5); +} + .clearfix::after { display: block; clear: both; @@ -5956,7 +6124,7 @@ textarea.form-control-lg { } .ratio::before { display: block; - padding-top: var(--aspect-ratio); + padding-top: var(--bs-aspect-ratio); content: ""; } .ratio > * { @@ -5968,19 +6136,19 @@ textarea.form-control-lg { } .ratio-1x1 { - --aspect-ratio: 100%; + --bs-aspect-ratio: 100%; } .ratio-4x3 { - --aspect-ratio: calc(3 / 4 * 100%); + --bs-aspect-ratio: calc(3 / 4 * 100%); } .ratio-16x9 { - --aspect-ratio: calc(9 / 16 * 100%); + --bs-aspect-ratio: calc(9 / 16 * 100%); } .ratio-21x9 { - --aspect-ratio: calc(9 / 21 * 100%); + --bs-aspect-ratio: calc(9 / 21 * 100%); } .fixed-top { @@ -6047,7 +6215,7 @@ textarea.form-control-lg { } } .visually-hidden, -.visually-hidden-focusable:not(:focus) { +.visually-hidden-focusable:not(:focus):not(:focus-within) { position: absolute !important; width: 1px !important; height: 1px !important; @@ -6253,7 +6421,15 @@ textarea.form-control-lg { } .translate-middle { - transform: translateX(50%) translateY(-50%) !important; + transform: translate(50%, -50%) !important; +} + +.translate-middle-x { + transform: translateX(50%) !important; +} + +.translate-middle-y { + transform: translateY(-50%) !important; } .border { @@ -6332,10 +6508,6 @@ textarea.form-control-lg { border-color: #fff !important; } -.border-0 { - border-width: 0 !important; -} - .border-1 { border-width: 1px !important; } @@ -7006,6 +7178,10 @@ textarea.form-control-lg { padding-right: 3rem !important; } +.font-monospace { + font-family: var(--bs-font-monospace) !important; +} + .fs-1 { font-size: calc(1.375rem + 1.5vw) !important; } @@ -7058,16 +7234,20 @@ textarea.form-control-lg { font-weight: bolder !important; } -.text-lowercase { - text-transform: lowercase !important; +.lh-1 { + line-height: 1 !important; } -.text-uppercase { - text-transform: uppercase !important; +.lh-sm { + line-height: 1.25 !important; } -.text-capitalize { - text-transform: capitalize !important; +.lh-base { + line-height: 1.5 !important; +} + +.lh-lg { + line-height: 2 !important; } .text-start { @@ -7082,6 +7262,37 @@ textarea.form-control-lg { text-align: center !important; } +.text-decoration-none { + text-decoration: none !important; +} + +.text-decoration-underline { + text-decoration: underline !important; +} + +.text-decoration-line-through { + text-decoration: line-through !important; +} + +.text-lowercase { + text-transform: lowercase !important; +} + +.text-uppercase { + text-transform: uppercase !important; +} + +.text-capitalize { + text-transform: capitalize !important; +} + +.text-wrap { + white-space: normal !important; +} + +.text-nowrap { + white-space: nowrap !important; +} .text-primary { color: #0d6efd !important; } @@ -7138,22 +7349,6 @@ textarea.form-control-lg { color: inherit !important; } -.lh-1 { - line-height: 1 !important; -} - -.lh-sm { - line-height: 1.25 !important; -} - -.lh-base { - line-height: 1.5 !important; -} - -.lh-lg { - line-height: 2 !important; -} - .bg-primary { background-color: #0d6efd !important; } @@ -7202,29 +7397,6 @@ textarea.form-control-lg { background-image: var(--bs-gradient) !important; } -.text-wrap { - white-space: normal !important; -} - -.text-nowrap { - white-space: nowrap !important; -} - -.text-decoration-none { - text-decoration: none !important; -} - -.text-decoration-underline { - text-decoration: underline !important; -} - -.text-decoration-line-through { - text-decoration: line-through !important; -} -.font-monospace { - font-family: var(--bs-font-monospace) !important; -} - .user-select-all { -webkit-user-select: all !important; -moz-user-select: all !important; @@ -10578,54 +10750,6 @@ textarea.form-control-lg { .fs-4 { font-size: 1.5rem !important; } - - .fs-sm-1 { - font-size: 2.5rem !important; - } - - .fs-sm-2 { - font-size: 2rem !important; - } - - .fs-sm-3 { - font-size: 1.75rem !important; - } - - .fs-sm-4 { - font-size: 1.5rem !important; - } - - .fs-md-1 { - font-size: 2.5rem !important; - } - - .fs-md-2 { - font-size: 2rem !important; - } - - .fs-md-3 { - font-size: 1.75rem !important; - } - - .fs-md-4 { - font-size: 1.5rem !important; - } - - .fs-lg-1 { - font-size: 2.5rem !important; - } - - .fs-lg-2 { - font-size: 2rem !important; - } - - .fs-lg-3 { - font-size: 1.75rem !important; - } - - .fs-lg-4 { - font-size: 1.5rem !important; - } } @media print { .d-print-inline { |