mob layout

This commit is contained in:
Batyr 2025-05-23 19:36:28 +05:00
parent b774861815
commit b550cd332b
2 changed files with 7 additions and 7 deletions

View File

@ -34,7 +34,7 @@ export const HomeActions: FC<Props> = ({ className }) => {
{title}
</h2>
<div className="grid grid-cols-3 gap-6">
<div className="grid md:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-6">
{items.map((item, i) =>
!item.dropdown ? (
<Link
@ -45,7 +45,7 @@ export const HomeActions: FC<Props> = ({ className }) => {
<Button
variant={"teritary"}
size={"lg"}
className="w-full drop-shadow-sm shadow-md text-xl bg-teritary text-on_teritary hover:bg-teritary/90"
className="w-full drop-shadow-sm shadow-md md:text-xl text-lg bg-teritary text-on_teritary hover:bg-teritary/90"
>
{item.text}
</Button>
@ -65,7 +65,7 @@ export const HomeActions: FC<Props> = ({ className }) => {
<Button
size={"lg"}
variant={"teritary"}
className="w-full drop-shadow-sm shadow-md text-xl bg-teritary text-on_teritary hover:bg-teritary/90"
className="w-full drop-shadow-sm shadow-md md:text-xl text-lg bg-teritary text-on_teritary hover:bg-teritary/90"
>
{item.text}
<Chevron w={"40"} h={"40"} color="white" />

View File

@ -8,22 +8,22 @@ export const TimerItem = ({
prevValue: string;
}) => (
<div className="timer-item flex flex-col items-center">
<div className="relative h-14 w-16 overflow-hidden font-bold">
<div className="relative sm:h-14 h-10 w-16 overflow-hidden font-bold">
<span
className={`absolute left-1/2 -translate-x-1/2 black bg-gradient-to-t from-[#F38835] to-[#F1700D] text-transparent bg-clip-text text-5xl leading-none transition-all duration-300 ${
className={`absolute left-1/2 -translate-x-1/2 black bg-gradient-to-t from-[#F38835] to-[#F1700D] text-transparent bg-clip-text sm:text-5xl text-3xl leading-none transition-all duration-300 ${
prevValue !== value ? " opacity-0" : " opacity-100"
}`}
>
{prevValue}
</span>
<span
className={`absolute left-1/2 -translate-x-1/2 black bg-gradient-to-t from-[#F38835] to-[#F1700D] text-transparent bg-clip-text text-5xl leading-none transition-all duration-300 ${
className={`absolute left-1/2 -translate-x-1/2 black bg-gradient-to-t from-[#F38835] to-[#F1700D] text-transparent bg-clip-text sm:text-5xl text-3xl leading-none transition-all duration-300 ${
prevValue !== value ? "opacity-100" : "opacity-0"
}`}
>
{value}
</span>
</div>
<div className="label normal uppercase text-xl">{label}</div>
<div className="label normal uppercase sm:text-xl text-base">{label}</div>
</div>
);