feat: add responsiveness

This commit is contained in:
Kentai Radiquum 2024-05-19 18:02:15 +05:00
parent 0b09f1b50f
commit 78efd2500a
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
3 changed files with 86 additions and 8 deletions

View file

@ -1250,6 +1250,22 @@ input:checked + .toggle-bg {
width: 100%;
}
.w-auto {
width: auto;
}
.w-\[25\%\] {
width: 25%;
}
.w-\[50\%\] {
width: 50%;
}
.w-\[100\%\] {
width: 100%;
}
.max-w-\[1440px\] {
max-width: 1440px;
}
@ -1336,6 +1352,10 @@ input:checked + .toggle-bg {
flex-direction: row;
}
.flex-wrap {
flex-wrap: wrap;
}
.items-start {
align-items: flex-start;
}
@ -1500,6 +1520,16 @@ input:checked + .toggle-bg {
background-color: rgb(227 160 8 / var(--tw-bg-opacity));
}
.bg-slate-200 {
--tw-bg-opacity: 1;
background-color: rgb(226 232 240 / var(--tw-bg-opacity));
}
.bg-slate-50 {
--tw-bg-opacity: 1;
background-color: rgb(248 250 252 / var(--tw-bg-opacity));
}
.object-cover {
-o-object-fit: cover;
object-fit: cover;
@ -1550,6 +1580,16 @@ input:checked + .toggle-bg {
padding-bottom: 0.75rem;
}
.px-4 {
padding-left: 1rem;
padding-right: 1rem;
}
.py-4 {
padding-top: 1rem;
padding-bottom: 1rem;
}
.pb-6 {
padding-bottom: 1.5rem;
}
@ -1902,6 +1942,44 @@ input:checked + .toggle-bg {
--tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity));
}
@media (min-width: 768px) {
.md\:w-auto {
width: auto;
}
.md\:flex-nowrap {
flex-wrap: nowrap;
}
.md\:justify-start {
justify-content: flex-start;
}
}
@media (min-width: 1024px) {
.lg\:w-auto {
width: auto;
}
.lg\:flex-nowrap {
flex-wrap: nowrap;
}
.lg\:justify-start {
justify-content: flex-start;
}
}
@media (min-width: 1280px) {
.xl\:w-auto {
width: auto;
}
.xl\:flex-nowrap {
flex-wrap: nowrap;
}
}
.rtl\:rotate-180:where([dir="rtl"], [dir="rtl"] *) {
--tw-rotate: 180deg;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));