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} {title}
</h2> </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) => {items.map((item, i) =>
!item.dropdown ? ( !item.dropdown ? (
<Link <Link
@ -45,7 +45,7 @@ export const HomeActions: FC<Props> = ({ className }) => {
<Button <Button
variant={"teritary"} variant={"teritary"}
size={"lg"} 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} {item.text}
</Button> </Button>
@ -65,7 +65,7 @@ export const HomeActions: FC<Props> = ({ className }) => {
<Button <Button
size={"lg"} size={"lg"}
variant={"teritary"} 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} {item.text}
<Chevron w={"40"} h={"40"} color="white" /> <Chevron w={"40"} h={"40"} color="white" />

View File

@ -8,22 +8,22 @@ export const TimerItem = ({
prevValue: string; prevValue: string;
}) => ( }) => (
<div className="timer-item flex flex-col items-center"> <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 <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 !== value ? " opacity-0" : " opacity-100"
}`} }`}
> >
{prevValue} {prevValue}
</span> </span>
<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" prevValue !== value ? "opacity-100" : "opacity-0"
}`} }`}
> >
{value} {value}
</span> </span>
</div> </div>
<div className="label normal uppercase text-xl">{label}</div> <div className="label normal uppercase sm:text-xl text-base">{label}</div>
</div> </div>
); );