fedi/lemmy-ui
1
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-26 07:52:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(UI): Make max-width wider, and make sidebar narrower on wide screens #1536

Browse source
This commit is contained in:
Jay Sitter 2023-06-25 14:00:55 -04:00
parent 2787114482
commit 71b7375773
12 changed files with 309 additions and 544 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/assets/css/main.css
View file

@ -198,8 +198,7 @@ blockquote {
.thumbnail { .thumbnail {
object-fit: cover; object-fit: cover;
min-height: 60px; aspect-ratio: 4/3;
max-height: 80px;
width: 100%; width: 100%;
} }

4
src/assets/css/themes/_variables.scss
View file

@ -1,6 +1,2 @@
$link-decoration: none; $link-decoration: none;
$min-contrast-ratio: 3; $min-contrast-ratio: 3;
$container-max-widths: (
lg: 1140px,
);

350
src/assets/css/themes/darkly-compact.css
View file

@ -309,11 +309,9 @@ p {
} }
abbr[title] { abbr[title] {
-webkit-text-decoration: underline dotted; text-decoration: underline dotted;
text-decoration: underline dotted;
cursor: help; cursor: help;
-webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none;
text-decoration-skip-ink: none;
} }
address { address {
@ -2131,9 +2129,7 @@ progress {
background-color: #444; background-color: #444;
background-clip: padding-box; background-clip: padding-box;
border: var(--bs-border-width) solid #222; border: var(--bs-border-width) solid #222;
-webkit-appearance: none; appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: var(--bs-border-radius); border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
} }
@ -2164,10 +2160,6 @@ progress {
display: block; display: block;
padding: 0; padding: 0;
} }
.form-control::-moz-placeholder {
color: var(--bs-secondary-color);
opacity: 1;
}
.form-control::placeholder { .form-control::placeholder {
color: var(--bs-secondary-color); color: var(--bs-secondary-color);
opacity: 1; opacity: 1;
@ -2179,8 +2171,7 @@ progress {
.form-control::file-selector-button { .form-control::file-selector-button {
padding: 0.375rem 0.75rem; padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem; margin: -0.375rem -0.75rem;
-webkit-margin-end: 0.75rem; margin-inline-end: 0.75rem;
margin-inline-end: 0.75rem;
color: #fff; color: #fff;
background-color: var(--bs-tertiary-bg); background-color: var(--bs-tertiary-bg);
pointer-events: none; pointer-events: none;
@ -2228,8 +2219,7 @@ progress {
.form-control-sm::file-selector-button { .form-control-sm::file-selector-button {
padding: 0.25rem 0.5rem; padding: 0.25rem 0.5rem;
margin: -0.25rem -0.5rem; margin: -0.25rem -0.5rem;
-webkit-margin-end: 0.5rem; margin-inline-end: 0.5rem;
margin-inline-end: 0.5rem;
} }
.form-control-lg { .form-control-lg {
@ -2241,8 +2231,7 @@ progress {
.form-control-lg::file-selector-button { .form-control-lg::file-selector-button {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
margin: -0.5rem -1rem; margin: -0.5rem -1rem;
-webkit-margin-end: 1rem; margin-inline-end: 1rem;
margin-inline-end: 1rem;
} }
textarea.form-control { textarea.form-control {
@ -2295,9 +2284,7 @@ textarea.form-control-lg {
border: var(--bs-border-width) solid #222; border: var(--bs-border-width) solid #222;
border-radius: var(--bs-border-radius); border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-webkit-appearance: none; appearance: none;
-moz-appearance: none;
appearance: none;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-select { .form-select {
@ -2375,11 +2362,8 @@ textarea.form-control-lg {
background-position: center; background-position: center;
background-size: contain; background-size: contain;
border: var(--bs-border-width) solid var(--bs-border-color); border: var(--bs-border-width) solid var(--bs-border-color);
-webkit-appearance: none; appearance: none;
-moz-appearance: none; print-color-adjust: exact;
appearance: none;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
} }
.form-check-input[type=checkbox] { .form-check-input[type=checkbox] {
border-radius: 0.25em; border-radius: 0.25em;
@ -2478,9 +2462,7 @@ textarea.form-control-lg {
height: 1.5rem; height: 1.5rem;
padding: 0; padding: 0;
background-color: transparent; background-color: transparent;
-webkit-appearance: none; appearance: none;
-moz-appearance: none;
appearance: none;
} }
.form-range:focus { .form-range:focus {
outline: 0; outline: 0;
@ -2501,14 +2483,11 @@ textarea.form-control-lg {
background-color: #00bc8c; background-color: #00bc8c;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
-webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-webkit-appearance: none; appearance: none;
appearance: none;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-range::-webkit-slider-thumb { .form-range::-webkit-slider-thumb {
-webkit-transition: none;
transition: none; transition: none;
} }
} }
@ -2530,14 +2509,11 @@ textarea.form-control-lg {
background-color: #00bc8c; background-color: #00bc8c;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
-moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-moz-appearance: none; appearance: none;
appearance: none;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-range::-moz-range-thumb { .form-range::-moz-range-thumb {
-moz-transition: none;
transition: none; transition: none;
} }
} }
@ -2598,17 +2574,10 @@ textarea.form-control-lg {
.form-floating > .form-control-plaintext { .form-floating > .form-control-plaintext {
padding: 1rem 0.75rem; padding: 1rem 0.75rem;
} }
.form-floating > .form-control::-moz-placeholder, .form-floating > .form-control-plaintext::-moz-placeholder {
color: transparent;
}
.form-floating > .form-control::placeholder, .form-floating > .form-control::placeholder,
.form-floating > .form-control-plaintext::placeholder { .form-floating > .form-control-plaintext::placeholder {
color: transparent; color: transparent;
} }
.form-floating > .form-control:not(:-moz-placeholder-shown), .form-floating > .form-control-plaintext:not(:-moz-placeholder-shown) {
padding-top: 1.625rem;
padding-bottom: 0.625rem;
}
.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown), .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-control-plaintext:focus, .form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown) { .form-floating > .form-control-plaintext:not(:placeholder-shown) {
@ -2624,10 +2593,6 @@ textarea.form-control-lg {
padding-top: 1.625rem; padding-top: 1.625rem;
padding-bottom: 0.625rem; padding-bottom: 0.625rem;
} }
.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {
color: rgba(var(--bs-body-color-rgb), 0.65);
transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}
.form-floating > .form-control:focus ~ label, .form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control-plaintext ~ label,
@ -2635,15 +2600,6 @@ textarea.form-control-lg {
color: rgba(var(--bs-body-color-rgb), 0.65); color: rgba(var(--bs-body-color-rgb), 0.65);
transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
} }
.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label::after {
position: absolute;
inset: 1rem 0.375rem;
z-index: -1;
height: 1.5em;
content: "";
background-color: #444;
border-radius: var(--bs-border-radius);
}
.form-floating > .form-control:focus ~ label::after, .form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after, .form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-control-plaintext ~ label::after,
@ -2967,9 +2923,7 @@ textarea.form-control-lg {
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
cursor: pointer; cursor: pointer;
-webkit-user-select: none; user-select: none;
-moz-user-select: none;
user-select: none;
border: var(--bs-btn-border-width) solid var(--bs-btn-border-color); border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
border-radius: var(--bs-btn-border-radius); border-radius: var(--bs-btn-border-radius);
background-color: var(--bs-btn-bg); background-color: var(--bs-btn-bg);
@ -5354,9 +5308,7 @@ textarea.form-control-lg {
} }
.btn-close:disabled, .btn-close.disabled { .btn-close:disabled, .btn-close.disabled {
pointer-events: none; pointer-events: none;
-webkit-user-select: none; user-select: none;
-moz-user-select: none;
user-select: none;
opacity: var(--bs-btn-close-disabled-opacity); opacity: var(--bs-btn-close-disabled-opacity);
} }
@ -5406,7 +5358,6 @@ textarea.form-control-lg {
--bs-toast-zindex: 1090; --bs-toast-zindex: 1090;
position: absolute; position: absolute;
z-index: var(--bs-toast-zindex); z-index: var(--bs-toast-zindex);
width: -moz-max-content;
width: max-content; width: max-content;
max-width: 100%; max-width: 100%;
pointer-events: none; pointer-events: none;
@ -6307,8 +6258,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.offcanvas-end { .offcanvas-sm.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6316,8 +6265,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.offcanvas-top { .offcanvas-sm.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6327,8 +6274,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.offcanvas-bottom { .offcanvas-sm.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6337,13 +6282,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.showing, .offcanvas-sm.show:not(.hiding) { .offcanvas-sm.showing, .offcanvas-sm.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.showing, .offcanvas-sm.hiding, .offcanvas-sm.show { .offcanvas-sm.showing, .offcanvas-sm.hiding, .offcanvas-sm.show {
visibility: visible; visibility: visible;
} }
@ -6395,8 +6336,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.offcanvas-end { .offcanvas-md.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6404,8 +6343,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.offcanvas-top { .offcanvas-md.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6415,8 +6352,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.offcanvas-bottom { .offcanvas-md.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6425,13 +6360,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.showing, .offcanvas-md.show:not(.hiding) { .offcanvas-md.showing, .offcanvas-md.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.showing, .offcanvas-md.hiding, .offcanvas-md.show { .offcanvas-md.showing, .offcanvas-md.hiding, .offcanvas-md.show {
visibility: visible; visibility: visible;
} }
@ -6483,8 +6414,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.offcanvas-end { .offcanvas-lg.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6492,8 +6421,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.offcanvas-top { .offcanvas-lg.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6503,8 +6430,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.offcanvas-bottom { .offcanvas-lg.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6513,13 +6438,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.showing, .offcanvas-lg.show:not(.hiding) { .offcanvas-lg.showing, .offcanvas-lg.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.showing, .offcanvas-lg.hiding, .offcanvas-lg.show { .offcanvas-lg.showing, .offcanvas-lg.hiding, .offcanvas-lg.show {
visibility: visible; visibility: visible;
} }
@ -6571,8 +6492,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.offcanvas-end { .offcanvas-xl.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6580,8 +6499,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.offcanvas-top { .offcanvas-xl.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6591,8 +6508,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.offcanvas-bottom { .offcanvas-xl.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6601,13 +6516,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.showing, .offcanvas-xl.show:not(.hiding) { .offcanvas-xl.showing, .offcanvas-xl.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.showing, .offcanvas-xl.hiding, .offcanvas-xl.show { .offcanvas-xl.showing, .offcanvas-xl.hiding, .offcanvas-xl.show {
visibility: visible; visibility: visible;
} }
@ -6659,8 +6570,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.offcanvas-end { .offcanvas-xxl.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6668,8 +6577,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.offcanvas-top { .offcanvas-xxl.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6679,8 +6586,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.offcanvas-bottom { .offcanvas-xxl.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6689,13 +6594,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.showing, .offcanvas-xxl.show:not(.hiding) { .offcanvas-xxl.showing, .offcanvas-xxl.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.showing, .offcanvas-xxl.hiding, .offcanvas-xxl.show { .offcanvas-xxl.showing, .offcanvas-xxl.hiding, .offcanvas-xxl.show {
visibility: visible; visibility: visible;
} }
@ -6850,17 +6751,14 @@ textarea.form-control-lg {
} }
} }
.placeholder-wave { .placeholder-wave {
-webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%); mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%); mask-size: 200% 100%;
-webkit-mask-size: 200% 100%;
mask-size: 200% 100%;
animation: placeholder-wave 2s linear infinite; animation: placeholder-wave 2s linear infinite;
} }
@keyframes placeholder-wave { @keyframes placeholder-wave {
100% { 100% {
-webkit-mask-position: -200% 0%; mask-position: -200% 0%;
mask-position: -200% 0%;
} }
} }
.clearfix::after { .clearfix::after {
@ -7233,28 +7131,23 @@ textarea.form-control-lg {
} }
.object-fit-contain { .object-fit-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-cover { .object-fit-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-fill { .object-fit-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-scale { .object-fit-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-none { .object-fit-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.opacity-0 { .opacity-0 {
@ -8334,33 +8227,27 @@ textarea.form-control-lg {
} }
.column-gap-0 { .column-gap-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-1 { .column-gap-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-2 { .column-gap-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-3 { .column-gap-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-4 { .column-gap-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-5 { .column-gap-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.font-monospace { .font-monospace {
@ -8916,21 +8803,15 @@ textarea.form-control-lg {
} }
.user-select-all { .user-select-all {
-webkit-user-select: all !important; user-select: all !important;
-moz-user-select: all !important;
user-select: all !important;
} }
.user-select-auto { .user-select-auto {
-webkit-user-select: auto !important; user-select: auto !important;
-moz-user-select: auto !important;
user-select: auto !important;
} }
.user-select-none { .user-select-none {
-webkit-user-select: none !important; user-select: none !important;
-moz-user-select: none !important;
user-select: none !important;
} }
.pe-none { .pe-none {
@ -9196,24 +9077,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-sm-contain { .object-fit-sm-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-sm-cover { .object-fit-sm-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-sm-fill { .object-fit-sm-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-sm-scale { .object-fit-sm-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-sm-none { .object-fit-sm-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-sm-inline { .d-sm-inline {
display: inline !important; display: inline !important;
@ -9713,28 +9589,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-sm-0 { .column-gap-sm-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-sm-1 { .column-gap-sm-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-sm-2 { .column-gap-sm-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-sm-3 { .column-gap-sm-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-sm-4 { .column-gap-sm-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-sm-5 { .column-gap-sm-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-sm-start { .text-sm-start {
text-align: left !important; text-align: left !important;
@ -9757,24 +9627,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-md-contain { .object-fit-md-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-md-cover { .object-fit-md-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-md-fill { .object-fit-md-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-md-scale { .object-fit-md-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-md-none { .object-fit-md-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-md-inline { .d-md-inline {
display: inline !important; display: inline !important;
@ -10274,28 +10139,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-md-0 { .column-gap-md-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-md-1 { .column-gap-md-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-md-2 { .column-gap-md-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-md-3 { .column-gap-md-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-md-4 { .column-gap-md-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-md-5 { .column-gap-md-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-md-start { .text-md-start {
text-align: left !important; text-align: left !important;
@ -10318,24 +10177,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-lg-contain { .object-fit-lg-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-lg-cover { .object-fit-lg-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-lg-fill { .object-fit-lg-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-lg-scale { .object-fit-lg-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-lg-none { .object-fit-lg-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-lg-inline { .d-lg-inline {
display: inline !important; display: inline !important;
@ -10835,28 +10689,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-lg-0 { .column-gap-lg-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-lg-1 { .column-gap-lg-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-lg-2 { .column-gap-lg-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-lg-3 { .column-gap-lg-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-lg-4 { .column-gap-lg-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-lg-5 { .column-gap-lg-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-lg-start { .text-lg-start {
text-align: left !important; text-align: left !important;
@ -10879,24 +10727,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-xl-contain { .object-fit-xl-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-xl-cover { .object-fit-xl-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-xl-fill { .object-fit-xl-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-xl-scale { .object-fit-xl-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-xl-none { .object-fit-xl-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-xl-inline { .d-xl-inline {
display: inline !important; display: inline !important;
@ -11396,28 +11239,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-xl-0 { .column-gap-xl-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-xl-1 { .column-gap-xl-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-xl-2 { .column-gap-xl-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-xl-3 { .column-gap-xl-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-xl-4 { .column-gap-xl-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-xl-5 { .column-gap-xl-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-xl-start { .text-xl-start {
text-align: left !important; text-align: left !important;
@ -11440,24 +11277,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-xxl-contain { .object-fit-xxl-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-xxl-cover { .object-fit-xxl-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-xxl-fill { .object-fit-xxl-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-xxl-scale { .object-fit-xxl-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-xxl-none { .object-fit-xxl-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-xxl-inline { .d-xxl-inline {
display: inline !important; display: inline !important;
@ -11957,28 +11789,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-xxl-0 { .column-gap-xxl-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-xxl-1 { .column-gap-xxl-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-xxl-2 { .column-gap-xxl-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-xxl-3 { .column-gap-xxl-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-xxl-4 { .column-gap-xxl-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-xxl-5 { .column-gap-xxl-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-xxl-start { .text-xxl-start {
text-align: left !important; text-align: left !important;
@ -12038,4 +11864,6 @@ textarea.form-control-lg {
.d-print-none { .d-print-none {
display: none !important; display: none !important;
} }
}/*# sourceMappingURL=darkly-compact.css.map */ }
/*# sourceMappingURL=darkly-compact.css.map */

32
src/assets/css/themes/darkly-red.css
View file

@ -726,7 +726,11 @@ progress {
.container, .container,
.container-fluid, .container-fluid,
.container-lg { .container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
--bs-gutter-x: 1.5rem; --bs-gutter-x: 1.5rem;
--bs-gutter-y: 0; --bs-gutter-y: 0;
width: 100%; width: 100%;
@ -736,11 +740,31 @@ progress {
margin-left: auto; margin-left: auto;
} }
@media (min-width: 576px) {
.container-sm, .container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container-md, .container-sm, .container {
max-width: 720px;
}
}
@media (min-width: 992px) { @media (min-width: 992px) {
.container-lg, .container-md, .container-sm, .container { .container-lg, .container-md, .container-sm, .container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1140px; max-width: 1140px;
} }
} }
@media (min-width: 1400px) {
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1320px;
}
}
:root { :root {
--bs-breakpoint-xs: 0; --bs-breakpoint-xs: 0;
--bs-breakpoint-sm: 576px; --bs-breakpoint-sm: 576px;
@ -3867,7 +3891,11 @@ textarea.form-control-lg {
} }
.navbar > .container, .navbar > .container,
.navbar > .container-fluid, .navbar > .container-fluid,
.navbar > .container-lg { .navbar > .container-sm,
.navbar > .container-md,
.navbar > .container-lg,
.navbar > .container-xl,
.navbar > .container-xxl {
display: flex; display: flex;
flex-wrap: inherit; flex-wrap: inherit;
align-items: center; align-items: center;

32
src/assets/css/themes/darkly.css
View file

@ -726,7 +726,11 @@ progress {
.container, .container,
.container-fluid, .container-fluid,
.container-lg { .container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
--bs-gutter-x: 1.5rem; --bs-gutter-x: 1.5rem;
--bs-gutter-y: 0; --bs-gutter-y: 0;
width: 100%; width: 100%;
@ -736,11 +740,31 @@ progress {
margin-left: auto; margin-left: auto;
} }
@media (min-width: 576px) {
.container-sm, .container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container-md, .container-sm, .container {
max-width: 720px;
}
}
@media (min-width: 992px) { @media (min-width: 992px) {
.container-lg, .container-md, .container-sm, .container { .container-lg, .container-md, .container-sm, .container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1140px; max-width: 1140px;
} }
} }
@media (min-width: 1400px) {
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1320px;
}
}
:root { :root {
--bs-breakpoint-xs: 0; --bs-breakpoint-xs: 0;
--bs-breakpoint-sm: 576px; --bs-breakpoint-sm: 576px;
@ -3867,7 +3891,11 @@ textarea.form-control-lg {
} }
.navbar > .container, .navbar > .container,
.navbar > .container-fluid, .navbar > .container-fluid,
.navbar > .container-lg { .navbar > .container-sm,
.navbar > .container-md,
.navbar > .container-lg,
.navbar > .container-xl,
.navbar > .container-xxl {
display: flex; display: flex;
flex-wrap: inherit; flex-wrap: inherit;
align-items: center; align-items: center;

350
src/assets/css/themes/litely-compact.css
View file

@ -309,11 +309,9 @@ p {
} }
abbr[title] { abbr[title] {
-webkit-text-decoration: underline dotted; text-decoration: underline dotted;
text-decoration: underline dotted;
cursor: help; cursor: help;
-webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none;
text-decoration-skip-ink: none;
} }
address { address {
@ -2130,9 +2128,7 @@ progress {
background-color: var(--bs-body-bg); background-color: var(--bs-body-bg);
background-clip: padding-box; background-clip: padding-box;
border: var(--bs-border-width) solid var(--bs-border-color); border: var(--bs-border-width) solid var(--bs-border-color);
-webkit-appearance: none; appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: var(--bs-border-radius); border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
} }
@ -2163,10 +2159,6 @@ progress {
display: block; display: block;
padding: 0; padding: 0;
} }
.form-control::-moz-placeholder {
color: var(--bs-secondary-color);
opacity: 1;
}
.form-control::placeholder { .form-control::placeholder {
color: var(--bs-secondary-color); color: var(--bs-secondary-color);
opacity: 1; opacity: 1;
@ -2178,8 +2170,7 @@ progress {
.form-control::file-selector-button { .form-control::file-selector-button {
padding: 0.375rem 0.75rem; padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem; margin: -0.375rem -0.75rem;
-webkit-margin-end: 0.75rem; margin-inline-end: 0.75rem;
margin-inline-end: 0.75rem;
color: var(--bs-body-color); color: var(--bs-body-color);
background-color: var(--bs-tertiary-bg); background-color: var(--bs-tertiary-bg);
pointer-events: none; pointer-events: none;
@ -2227,8 +2218,7 @@ progress {
.form-control-sm::file-selector-button { .form-control-sm::file-selector-button {
padding: 0.25rem 0.5rem; padding: 0.25rem 0.5rem;
margin: -0.25rem -0.5rem; margin: -0.25rem -0.5rem;
-webkit-margin-end: 0.5rem; margin-inline-end: 0.5rem;
margin-inline-end: 0.5rem;
} }
.form-control-lg { .form-control-lg {
@ -2240,8 +2230,7 @@ progress {
.form-control-lg::file-selector-button { .form-control-lg::file-selector-button {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
margin: -0.5rem -1rem; margin: -0.5rem -1rem;
-webkit-margin-end: 1rem; margin-inline-end: 1rem;
margin-inline-end: 1rem;
} }
textarea.form-control { textarea.form-control {
@ -2294,9 +2283,7 @@ textarea.form-control-lg {
border: var(--bs-border-width) solid var(--bs-border-color); border: var(--bs-border-width) solid var(--bs-border-color);
border-radius: var(--bs-border-radius); border-radius: var(--bs-border-radius);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-webkit-appearance: none; appearance: none;
-moz-appearance: none;
appearance: none;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-select { .form-select {
@ -2374,11 +2361,8 @@ textarea.form-control-lg {
background-position: center; background-position: center;
background-size: contain; background-size: contain;
border: var(--bs-border-width) solid var(--bs-border-color); border: var(--bs-border-width) solid var(--bs-border-color);
-webkit-appearance: none; appearance: none;
-moz-appearance: none; print-color-adjust: exact;
appearance: none;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
} }
.form-check-input[type=checkbox] { .form-check-input[type=checkbox] {
border-radius: 0.25em; border-radius: 0.25em;
@ -2477,9 +2461,7 @@ textarea.form-control-lg {
height: 1.5rem; height: 1.5rem;
padding: 0; padding: 0;
background-color: transparent; background-color: transparent;
-webkit-appearance: none; appearance: none;
-moz-appearance: none;
appearance: none;
} }
.form-range:focus { .form-range:focus {
outline: 0; outline: 0;
@ -2500,14 +2482,11 @@ textarea.form-control-lg {
background-color: #f1641e; background-color: #f1641e;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
-webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-webkit-appearance: none; appearance: none;
appearance: none;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-range::-webkit-slider-thumb { .form-range::-webkit-slider-thumb {
-webkit-transition: none;
transition: none; transition: none;
} }
} }
@ -2529,14 +2508,11 @@ textarea.form-control-lg {
background-color: #f1641e; background-color: #f1641e;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
-moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-moz-appearance: none; appearance: none;
appearance: none;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-range::-moz-range-thumb { .form-range::-moz-range-thumb {
-moz-transition: none;
transition: none; transition: none;
} }
} }
@ -2597,17 +2573,10 @@ textarea.form-control-lg {
.form-floating > .form-control-plaintext { .form-floating > .form-control-plaintext {
padding: 1rem 0.75rem; padding: 1rem 0.75rem;
} }
.form-floating > .form-control::-moz-placeholder, .form-floating > .form-control-plaintext::-moz-placeholder {
color: transparent;
}
.form-floating > .form-control::placeholder, .form-floating > .form-control::placeholder,
.form-floating > .form-control-plaintext::placeholder { .form-floating > .form-control-plaintext::placeholder {
color: transparent; color: transparent;
} }
.form-floating > .form-control:not(:-moz-placeholder-shown), .form-floating > .form-control-plaintext:not(:-moz-placeholder-shown) {
padding-top: 1.625rem;
padding-bottom: 0.625rem;
}
.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown), .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-control-plaintext:focus, .form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown) { .form-floating > .form-control-plaintext:not(:placeholder-shown) {
@ -2623,10 +2592,6 @@ textarea.form-control-lg {
padding-top: 1.625rem; padding-top: 1.625rem;
padding-bottom: 0.625rem; padding-bottom: 0.625rem;
} }
.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {
color: rgba(var(--bs-body-color-rgb), 0.65);
transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}
.form-floating > .form-control:focus ~ label, .form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control-plaintext ~ label,
@ -2634,15 +2599,6 @@ textarea.form-control-lg {
color: rgba(var(--bs-body-color-rgb), 0.65); color: rgba(var(--bs-body-color-rgb), 0.65);
transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
} }
.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label::after {
position: absolute;
inset: 1rem 0.375rem;
z-index: -1;
height: 1.5em;
content: "";
background-color: var(--bs-body-bg);
border-radius: var(--bs-border-radius);
}
.form-floating > .form-control:focus ~ label::after, .form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after, .form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-control-plaintext ~ label::after,
@ -2966,9 +2922,7 @@ textarea.form-control-lg {
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
cursor: pointer; cursor: pointer;
-webkit-user-select: none; user-select: none;
-moz-user-select: none;
user-select: none;
border: var(--bs-btn-border-width) solid var(--bs-btn-border-color); border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
border-radius: var(--bs-btn-border-radius); border-radius: var(--bs-btn-border-radius);
background-color: var(--bs-btn-bg); background-color: var(--bs-btn-bg);
@ -5353,9 +5307,7 @@ textarea.form-control-lg {
} }
.btn-close:disabled, .btn-close.disabled { .btn-close:disabled, .btn-close.disabled {
pointer-events: none; pointer-events: none;
-webkit-user-select: none; user-select: none;
-moz-user-select: none;
user-select: none;
opacity: var(--bs-btn-close-disabled-opacity); opacity: var(--bs-btn-close-disabled-opacity);
} }
@ -5405,7 +5357,6 @@ textarea.form-control-lg {
--bs-toast-zindex: 1090; --bs-toast-zindex: 1090;
position: absolute; position: absolute;
z-index: var(--bs-toast-zindex); z-index: var(--bs-toast-zindex);
width: -moz-max-content;
width: max-content; width: max-content;
max-width: 100%; max-width: 100%;
pointer-events: none; pointer-events: none;
@ -6306,8 +6257,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.offcanvas-end { .offcanvas-sm.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6315,8 +6264,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.offcanvas-top { .offcanvas-sm.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6326,8 +6273,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.offcanvas-bottom { .offcanvas-sm.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6336,13 +6281,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.showing, .offcanvas-sm.show:not(.hiding) { .offcanvas-sm.showing, .offcanvas-sm.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 575.98px) {
.offcanvas-sm.showing, .offcanvas-sm.hiding, .offcanvas-sm.show { .offcanvas-sm.showing, .offcanvas-sm.hiding, .offcanvas-sm.show {
visibility: visible; visibility: visible;
} }
@ -6394,8 +6335,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.offcanvas-end { .offcanvas-md.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6403,8 +6342,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.offcanvas-top { .offcanvas-md.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6414,8 +6351,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.offcanvas-bottom { .offcanvas-md.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6424,13 +6359,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.showing, .offcanvas-md.show:not(.hiding) { .offcanvas-md.showing, .offcanvas-md.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 767.98px) {
.offcanvas-md.showing, .offcanvas-md.hiding, .offcanvas-md.show { .offcanvas-md.showing, .offcanvas-md.hiding, .offcanvas-md.show {
visibility: visible; visibility: visible;
} }
@ -6482,8 +6413,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.offcanvas-end { .offcanvas-lg.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6491,8 +6420,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.offcanvas-top { .offcanvas-lg.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6502,8 +6429,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.offcanvas-bottom { .offcanvas-lg.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6512,13 +6437,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.showing, .offcanvas-lg.show:not(.hiding) { .offcanvas-lg.showing, .offcanvas-lg.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 991.98px) {
.offcanvas-lg.showing, .offcanvas-lg.hiding, .offcanvas-lg.show { .offcanvas-lg.showing, .offcanvas-lg.hiding, .offcanvas-lg.show {
visibility: visible; visibility: visible;
} }
@ -6570,8 +6491,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.offcanvas-end { .offcanvas-xl.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6579,8 +6498,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.offcanvas-top { .offcanvas-xl.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6590,8 +6507,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.offcanvas-bottom { .offcanvas-xl.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6600,13 +6515,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.showing, .offcanvas-xl.show:not(.hiding) { .offcanvas-xl.showing, .offcanvas-xl.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 1199.98px) {
.offcanvas-xl.showing, .offcanvas-xl.hiding, .offcanvas-xl.show { .offcanvas-xl.showing, .offcanvas-xl.hiding, .offcanvas-xl.show {
visibility: visible; visibility: visible;
} }
@ -6658,8 +6569,6 @@ textarea.form-control-lg {
border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(-100%); transform: translateX(-100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.offcanvas-end { .offcanvas-xxl.offcanvas-end {
top: 0; top: 0;
right: 0; right: 0;
@ -6667,8 +6576,6 @@ textarea.form-control-lg {
border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateX(100%); transform: translateX(100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.offcanvas-top { .offcanvas-xxl.offcanvas-top {
top: 0; top: 0;
right: 0; right: 0;
@ -6678,8 +6585,6 @@ textarea.form-control-lg {
border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(-100%); transform: translateY(-100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.offcanvas-bottom { .offcanvas-xxl.offcanvas-bottom {
right: 0; right: 0;
left: 0; left: 0;
@ -6688,13 +6593,9 @@ textarea.form-control-lg {
border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
transform: translateY(100%); transform: translateY(100%);
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.showing, .offcanvas-xxl.show:not(.hiding) { .offcanvas-xxl.showing, .offcanvas-xxl.show:not(.hiding) {
transform: none; transform: none;
} }
}
@media (max-width: 1399.98px) {
.offcanvas-xxl.showing, .offcanvas-xxl.hiding, .offcanvas-xxl.show { .offcanvas-xxl.showing, .offcanvas-xxl.hiding, .offcanvas-xxl.show {
visibility: visible; visibility: visible;
} }
@ -6849,17 +6750,14 @@ textarea.form-control-lg {
} }
} }
.placeholder-wave { .placeholder-wave {
-webkit-mask-image: linear-gradient(130deg, #222 55%, rgba(0, 0, 0, 0.8) 75%, #222 95%); mask-image: linear-gradient(130deg, #222 55%, rgba(0, 0, 0, 0.8) 75%, #222 95%);
mask-image: linear-gradient(130deg, #222 55%, rgba(0, 0, 0, 0.8) 75%, #222 95%); mask-size: 200% 100%;
-webkit-mask-size: 200% 100%;
mask-size: 200% 100%;
animation: placeholder-wave 2s linear infinite; animation: placeholder-wave 2s linear infinite;
} }
@keyframes placeholder-wave { @keyframes placeholder-wave {
100% { 100% {
-webkit-mask-position: -200% 0%; mask-position: -200% 0%;
mask-position: -200% 0%;
} }
} }
.clearfix::after { .clearfix::after {
@ -7232,28 +7130,23 @@ textarea.form-control-lg {
} }
.object-fit-contain { .object-fit-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-cover { .object-fit-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-fill { .object-fit-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-scale { .object-fit-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-none { .object-fit-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.opacity-0 { .opacity-0 {
@ -8333,33 +8226,27 @@ textarea.form-control-lg {
} }
.column-gap-0 { .column-gap-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-1 { .column-gap-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-2 { .column-gap-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-3 { .column-gap-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-4 { .column-gap-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-5 { .column-gap-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.font-monospace { .font-monospace {
@ -8915,21 +8802,15 @@ textarea.form-control-lg {
} }
.user-select-all { .user-select-all {
-webkit-user-select: all !important; user-select: all !important;
-moz-user-select: all !important;
user-select: all !important;
} }
.user-select-auto { .user-select-auto {
-webkit-user-select: auto !important; user-select: auto !important;
-moz-user-select: auto !important;
user-select: auto !important;
} }
.user-select-none { .user-select-none {
-webkit-user-select: none !important; user-select: none !important;
-moz-user-select: none !important;
user-select: none !important;
} }
.pe-none { .pe-none {
@ -9195,24 +9076,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-sm-contain { .object-fit-sm-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-sm-cover { .object-fit-sm-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-sm-fill { .object-fit-sm-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-sm-scale { .object-fit-sm-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-sm-none { .object-fit-sm-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-sm-inline { .d-sm-inline {
display: inline !important; display: inline !important;
@ -9712,28 +9588,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-sm-0 { .column-gap-sm-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-sm-1 { .column-gap-sm-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-sm-2 { .column-gap-sm-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-sm-3 { .column-gap-sm-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-sm-4 { .column-gap-sm-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-sm-5 { .column-gap-sm-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-sm-start { .text-sm-start {
text-align: left !important; text-align: left !important;
@ -9756,24 +9626,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-md-contain { .object-fit-md-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-md-cover { .object-fit-md-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-md-fill { .object-fit-md-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-md-scale { .object-fit-md-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-md-none { .object-fit-md-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-md-inline { .d-md-inline {
display: inline !important; display: inline !important;
@ -10273,28 +10138,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-md-0 { .column-gap-md-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-md-1 { .column-gap-md-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-md-2 { .column-gap-md-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-md-3 { .column-gap-md-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-md-4 { .column-gap-md-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-md-5 { .column-gap-md-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-md-start { .text-md-start {
text-align: left !important; text-align: left !important;
@ -10317,24 +10176,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-lg-contain { .object-fit-lg-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-lg-cover { .object-fit-lg-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-lg-fill { .object-fit-lg-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-lg-scale { .object-fit-lg-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-lg-none { .object-fit-lg-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-lg-inline { .d-lg-inline {
display: inline !important; display: inline !important;
@ -10834,28 +10688,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-lg-0 { .column-gap-lg-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-lg-1 { .column-gap-lg-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-lg-2 { .column-gap-lg-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-lg-3 { .column-gap-lg-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-lg-4 { .column-gap-lg-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-lg-5 { .column-gap-lg-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-lg-start { .text-lg-start {
text-align: left !important; text-align: left !important;
@ -10878,24 +10726,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-xl-contain { .object-fit-xl-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-xl-cover { .object-fit-xl-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-xl-fill { .object-fit-xl-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-xl-scale { .object-fit-xl-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-xl-none { .object-fit-xl-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-xl-inline { .d-xl-inline {
display: inline !important; display: inline !important;
@ -11395,28 +11238,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-xl-0 { .column-gap-xl-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-xl-1 { .column-gap-xl-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-xl-2 { .column-gap-xl-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-xl-3 { .column-gap-xl-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-xl-4 { .column-gap-xl-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-xl-5 { .column-gap-xl-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-xl-start { .text-xl-start {
text-align: left !important; text-align: left !important;
@ -11439,24 +11276,19 @@ textarea.form-control-lg {
float: none !important; float: none !important;
} }
.object-fit-xxl-contain { .object-fit-xxl-contain {
-o-object-fit: contain !important; object-fit: contain !important;
object-fit: contain !important;
} }
.object-fit-xxl-cover { .object-fit-xxl-cover {
-o-object-fit: cover !important; object-fit: cover !important;
object-fit: cover !important;
} }
.object-fit-xxl-fill { .object-fit-xxl-fill {
-o-object-fit: fill !important; object-fit: fill !important;
object-fit: fill !important;
} }
.object-fit-xxl-scale { .object-fit-xxl-scale {
-o-object-fit: scale-down !important; object-fit: scale-down !important;
object-fit: scale-down !important;
} }
.object-fit-xxl-none { .object-fit-xxl-none {
-o-object-fit: none !important; object-fit: none !important;
object-fit: none !important;
} }
.d-xxl-inline { .d-xxl-inline {
display: inline !important; display: inline !important;
@ -11956,28 +11788,22 @@ textarea.form-control-lg {
row-gap: 3rem !important; row-gap: 3rem !important;
} }
.column-gap-xxl-0 { .column-gap-xxl-0 {
-moz-column-gap: 0 !important; column-gap: 0 !important;
column-gap: 0 !important;
} }
.column-gap-xxl-1 { .column-gap-xxl-1 {
-moz-column-gap: 0.25rem !important; column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
} }
.column-gap-xxl-2 { .column-gap-xxl-2 {
-moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
} }
.column-gap-xxl-3 { .column-gap-xxl-3 {
-moz-column-gap: 1rem !important; column-gap: 1rem !important;
column-gap: 1rem !important;
} }
.column-gap-xxl-4 { .column-gap-xxl-4 {
-moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
} }
.column-gap-xxl-5 { .column-gap-xxl-5 {
-moz-column-gap: 3rem !important; column-gap: 3rem !important;
column-gap: 3rem !important;
} }
.text-xxl-start { .text-xxl-start {
text-align: left !important; text-align: left !important;
@ -12037,4 +11863,6 @@ textarea.form-control-lg {
.d-print-none { .d-print-none {
display: none !important; display: none !important;
} }
}/*# sourceMappingURL=litely-compact.css.map */ }
/*# sourceMappingURL=litely-compact.css.map */

32
src/assets/css/themes/litely-red.css
View file

@ -725,7 +725,11 @@ progress {
.container, .container,
.container-fluid, .container-fluid,
.container-lg { .container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
--bs-gutter-x: 1.5rem; --bs-gutter-x: 1.5rem;
--bs-gutter-y: 0; --bs-gutter-y: 0;
width: 100%; width: 100%;
@ -735,11 +739,31 @@ progress {
margin-left: auto; margin-left: auto;
} }
@media (min-width: 576px) {
.container-sm, .container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container-md, .container-sm, .container {
max-width: 720px;
}
}
@media (min-width: 992px) { @media (min-width: 992px) {
.container-lg, .container-md, .container-sm, .container { .container-lg, .container-md, .container-sm, .container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1140px; max-width: 1140px;
} }
} }
@media (min-width: 1400px) {
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1320px;
}
}
:root { :root {
--bs-breakpoint-xs: 0; --bs-breakpoint-xs: 0;
--bs-breakpoint-sm: 576px; --bs-breakpoint-sm: 576px;
@ -3866,7 +3890,11 @@ textarea.form-control-lg {
} }
.navbar > .container, .navbar > .container,
.navbar > .container-fluid, .navbar > .container-fluid,
.navbar > .container-lg { .navbar > .container-sm,
.navbar > .container-md,
.navbar > .container-lg,
.navbar > .container-xl,
.navbar > .container-xxl {
display: flex; display: flex;
flex-wrap: inherit; flex-wrap: inherit;
align-items: center; align-items: center;

32
src/assets/css/themes/litely.css
View file

@ -725,7 +725,11 @@ progress {
.container, .container,
.container-fluid, .container-fluid,
.container-lg { .container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
--bs-gutter-x: 1.5rem; --bs-gutter-x: 1.5rem;
--bs-gutter-y: 0; --bs-gutter-y: 0;
width: 100%; width: 100%;
@ -735,11 +739,31 @@ progress {
margin-left: auto; margin-left: auto;
} }
@media (min-width: 576px) {
.container-sm, .container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container-md, .container-sm, .container {
max-width: 720px;
}
}
@media (min-width: 992px) { @media (min-width: 992px) {
.container-lg, .container-md, .container-sm, .container { .container-lg, .container-md, .container-sm, .container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1140px; max-width: 1140px;
} }
} }
@media (min-width: 1400px) {
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1320px;
}
}
:root { :root {
--bs-breakpoint-xs: 0; --bs-breakpoint-xs: 0;
--bs-breakpoint-sm: 576px; --bs-breakpoint-sm: 576px;
@ -3866,7 +3890,11 @@ textarea.form-control-lg {
} }
.navbar > .container, .navbar > .container,
.navbar > .container-fluid, .navbar > .container-fluid,
.navbar > .container-lg { .navbar > .container-sm,
.navbar > .container-md,
.navbar > .container-lg,
.navbar > .container-xl,
.navbar > .container-xxl {
display: flex; display: flex;
flex-wrap: inherit; flex-wrap: inherit;
align-items: center; align-items: center;

4
src/shared/components/community/community.tsx
View file

@ -317,7 +317,7 @@ export class Community extends Component<
/> />
<div className="row"> <div className="row">
<div className="col-12 col-md-8"> <div className="col-12 col-md-8 col-lg-9">
{this.communityInfo(res)} {this.communityInfo(res)}
<div className="d-block d-md-none"> <div className="d-block d-md-none">
<button <button
@ -340,7 +340,7 @@ export class Community extends Component<
{this.listings(res)} {this.listings(res)}
<Paginator page={page} onChange={this.handlePageChange} /> <Paginator page={page} onChange={this.handlePageChange} />
</div> </div>
<div className="d-none d-md-block col-md-4"> <div className="d-none d-md-block col-md-4 col-lg-3">
{this.sidebar(res)} {this.sidebar(res)}
</div> </div>
</div> </div>

4
src/shared/components/home/home.tsx
View file

@ -387,7 +387,7 @@ export class Home extends Component<any, HomeState> {
/> />
{site_setup && ( {site_setup && (
<div className="row"> <div className="row">
<main role="main" className="col-12 col-md-8"> <main role="main" className="col-12 col-md-8 col-lg-9">
{tagline && ( {tagline && (
<div <div
id="tagline" id="tagline"
@ -397,7 +397,7 @@ export class Home extends Component<any, HomeState> {
<div className="d-block d-md-none">{this.mobileView}</div> <div className="d-block d-md-none">{this.mobileView}</div>
{this.posts} {this.posts}
</main> </main>
<aside className="d-none d-md-block col-md-4"> <aside className="d-none d-md-block col-md-4 col-lg-3">
{this.mySidebar} {this.mySidebar}
</aside> </aside>
</div> </div>

4
src/shared/components/post/post-listing.tsx
View file

@ -1413,10 +1413,10 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
my_vote={this.postView.my_vote} my_vote={this.postView.my_vote}
/> />
)} )}
<div className="col-sm-2 pe-0 post-media"> <div className="col-sm-1 col-md-2 pe-0 post-media">
<div className="">{this.thumbnail()}</div> <div className="">{this.thumbnail()}</div>
</div> </div>
<div className="col-12 col-sm-9"> <div className="col-12 col-sm-8 col-md-9 ">
<div className="row"> <div className="row">
<div className="col-12"> <div className="col-12">
{this.postTitleLine()} {this.postTitleLine()}

6
src/shared/components/post/post.tsx
View file

@ -348,7 +348,7 @@ export class Post extends Component<any, PostState> {
const res = this.state.postRes.data; const res = this.state.postRes.data;
return ( return (
<div className="row"> <div className="row">
<div className="col-12 col-md-8 mb-3"> <div className="col-12 col-md-8 col-lg-9 mb-3">
<HtmlTags <HtmlTags
title={this.documentTitle} title={this.documentTitle}
path={this.context.router.route.match.url} path={this.context.router.route.match.url}
@ -416,7 +416,9 @@ export class Post extends Component<any, PostState> {
{this.state.commentViewType == CommentViewType.Flat && {this.state.commentViewType == CommentViewType.Flat &&
this.commentsFlat()} this.commentsFlat()}
</div> </div>
<div className="d-none d-md-block col-md-4">{this.sidebar()}</div> <div className="d-none d-md-block col-md-4 col-lg-3">
{this.sidebar()}
</div>
</div> </div>
); );
} }