Add responsive intermediate steps
This commit is contained in:
parent
41d152f0e3
commit
d2594f51d5
1 changed files with 3 additions and 3 deletions
|
@ -16,14 +16,14 @@ export default function Home() {
|
|||
<BurgerMenu />
|
||||
{!heWantsToPlay ? (
|
||||
<>
|
||||
<div className="flex h-36 w-64 items-center justify-center rounded-xl border-4 border-black bg-[#2227] lg:h-[18rem] lg:w-[32rem] lg:border-[6px] xl:h-[26rem] xl:w-[48rem]">
|
||||
<div className="flex h-36 w-64 items-center justify-center rounded-xl border-4 border-black bg-[#2227] sm:h-48 sm:w-96 md:h-72 md:w-[32rem] md:border-[6px] xl:h-[26rem] xl:w-[48rem]">
|
||||
<FontAwesomeIcon
|
||||
className="text-6xl lg:text-8xl"
|
||||
className="text-6xl sm:text-7xl md:text-8xl"
|
||||
icon={faCirclePlay}
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
className="font-farro rounded-lg border-b-4 border-orange-400 bg-warn px-12 pt-5 pb-4 text-2xl font-bold duration-100 active:border-t-4 active:border-b-0 xl:rounded-2xl xl:border-b-8 xl:px-24 xl:pt-10 xl:pb-8 xl:text-5xl xl:active:border-t-8"
|
||||
className="font-farro rounded-lg border-b-4 border-orange-400 bg-warn px-12 pt-5 pb-4 text-2xl font-bold duration-100 active:border-t-4 active:border-b-0 sm:rounded-xl sm:border-b-[6px] sm:px-14 sm:pt-6 sm:pb-5 sm:text-3xl sm:active:border-t-[6px] md:rounded-2xl md:border-b-8 md:px-20 md:pt-7 md:pb-6 md:text-4xl md:active:border-t-8 xl:px-24 xl:pt-10 xl:pb-8 xl:text-5xl"
|
||||
onClick={() => setTimeout(() => setHeWantsToPlay(true), 200)}
|
||||
>
|
||||
START
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue