feat(15): styling of mobile step 1
This commit is contained in:
@@ -669,6 +669,16 @@ video {
|
||||
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-magnolia {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: hsl(217 100% 97% / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-alabaster {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: hsl(231 100% 99% / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-sidebar-mobile {
|
||||
background-image: url("images/bg-sidebar-mobile.svg");
|
||||
}
|
||||
@@ -677,6 +687,10 @@ video {
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.p-1 {
|
||||
padding: 0.25rem;
|
||||
}
|
||||
|
||||
.px-6 {
|
||||
padding-left: 1.5rem;
|
||||
padding-right: 1.5rem;
|
||||
@@ -692,6 +706,34 @@ video {
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
|
||||
.py-3 {
|
||||
padding-top: 0.75rem;
|
||||
padding-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.px-5 {
|
||||
padding-left: 1.25rem;
|
||||
padding-right: 1.25rem;
|
||||
}
|
||||
|
||||
.px-3 {
|
||||
padding-left: 0.75rem;
|
||||
padding-right: 0.75rem;
|
||||
}
|
||||
|
||||
.px-4 {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.pt-2 {
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
|
||||
.pt-3 {
|
||||
padding-top: 0.75rem;
|
||||
}
|
||||
|
||||
.text-3xl {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
@@ -702,10 +744,19 @@ video {
|
||||
line-height: 1.25rem;
|
||||
}
|
||||
|
||||
.text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.font-semibold {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.uppercase {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -715,6 +766,26 @@ video {
|
||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-cool-gray {
|
||||
--tw-text-opacity: 1;
|
||||
color: hsl(231 11% 63% / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-marine-blue {
|
||||
--tw-text-opacity: 1;
|
||||
color: hsl(213 96% 18% / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.drop-shadow-lg {
|
||||
--tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
|
||||
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
||||
}
|
||||
|
||||
.drop-shadow-xl {
|
||||
--tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) drop-shadow(0 8px 5px rgb(0 0 0 / 0.08));
|
||||
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
@@ -763,6 +834,16 @@ html {
|
||||
|
||||
/* } */
|
||||
|
||||
.placeholder\:text-cool-gray::-moz-placeholder {
|
||||
--tw-text-opacity: 1;
|
||||
color: hsl(231 11% 63% / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.placeholder\:text-cool-gray::placeholder {
|
||||
--tw-text-opacity: 1;
|
||||
color: hsl(231 11% 63% / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.md\:row-span-2 {
|
||||
grid-row: span 2 / span 2;
|
||||
|
||||
Reference in New Issue
Block a user