diff --git a/src/assets/css/components/layout/EditorInnerContent.scss b/src/assets/css/components/layout/EditorInnerContent.scss index 102a6d6..565f08d 100644 --- a/src/assets/css/components/layout/EditorInnerContent.scss +++ b/src/assets/css/components/layout/EditorInnerContent.scss @@ -1,6 +1,7 @@ .editor_inner_content { @apply text-xl; - @apply max-w-screen-md mx-auto px-4 md:px-8 pt-32 xl:p-32 pb-0 text-white; + @apply w-full max-w-screen-md mx-auto px-4 md:px-8 pt-32 xl:p-32 pb-0 text-white; + box-sizing: border-box; .page-title { @apply flex flex-col lg:flex-row gap-8 lg:items-end mb-12; &__title { @@ -33,7 +34,7 @@ @apply mt-4 mb-6; } h1 { - @apply text-8xl tracking-wide; + @apply text-4xl md:text-8xl tracking-wide; line-height: 0.8; } h2 { @@ -42,7 +43,7 @@ ul li { list-style: square; - @apply pb-8; + @apply pb-1; &::marker { @apply text-construction; } diff --git a/src/assets/css/components/layout/Footer.scss b/src/assets/css/components/layout/Footer.scss index 9df4f24..88854d5 100644 --- a/src/assets/css/components/layout/Footer.scss +++ b/src/assets/css/components/layout/Footer.scss @@ -3,7 +3,6 @@ } .footer { @apply px-10 py-24 xl:p-32 w-screen relative z-10 text-slate-900; - margin: 10rem calc(50% - 50vw) -50px calc(50% - 50vw) !important; transform: translateY(30px); diff --git a/src/assets/css/components/ui/CountrySelect.scss b/src/assets/css/components/ui/CountrySelect.scss index e6967eb..1dae69c 100644 --- a/src/assets/css/components/ui/CountrySelect.scss +++ b/src/assets/css/components/ui/CountrySelect.scss @@ -17,7 +17,8 @@ flex pl-8 my-0 - w-80 + w-72 + md:w-80 items-center; transform: skew(-6deg); diff --git a/src/assets/css/components/ui/Marquee.scss b/src/assets/css/components/ui/Marquee.scss index 6fd4dcd..85f21c9 100644 --- a/src/assets/css/components/ui/Marquee.scss +++ b/src/assets/css/components/ui/Marquee.scss @@ -1,7 +1,10 @@ .marquee { @apply w-screen bg-construction p-4 py-10 text-black text-zuume uppercase text-6xl xl:text-7xl font-bold; - margin: 2rem calc(50% - 50vw) !important; rotate: -2deg; + translate: -20px; + @screen md { + margin: 2rem calc(50% - 50vw) !important; + } div { @apply flex; diff --git a/src/assets/css/pages/Home.scss b/src/assets/css/pages/Home.scss index bc52295..03d555f 100644 --- a/src/assets/css/pages/Home.scss +++ b/src/assets/css/pages/Home.scss @@ -30,7 +30,7 @@ } } &__content { - @apply mt-40 xl:mt-0; + @apply mt-44 xl:mt-0; .cover_worker { @apply mx-auto; transform: translate(0%, -60%); diff --git a/src/assets/css/pages/Rating.scss b/src/assets/css/pages/Rating.scss index c22336d..9642e99 100644 --- a/src/assets/css/pages/Rating.scss +++ b/src/assets/css/pages/Rating.scss @@ -6,7 +6,7 @@ transition: 0.3s; .screen__content { - @apply pb-6; + @apply pb-6 mt-12; h1 { @apply text-3xl; } diff --git a/src/assets/css/pages/welcome.scss b/src/assets/css/pages/welcome.scss index f29b9ce..9eb7696 100644 --- a/src/assets/css/pages/welcome.scss +++ b/src/assets/css/pages/welcome.scss @@ -1,5 +1,5 @@ .page-container--welcome { - @apply bg-lhoist flex flex-col items-center justify-center text-center; + @apply bg-lhoist flex flex-col items-center justify-center text-center pb-24 md:pb-0; min-height: 100dvh; .application-logo { @@ -17,7 +17,7 @@ } } .interaction-buttons { - @apply flex flex-col md:flex-row items-stretch gap-6; + @apply flex flex-col md:flex-row items-stretch gap-y-2 gap-x-6; .cta--start, .language-select {