Antoine/lhoist-stay-safe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactoring home component

Browse Source
This commit is contained in:
Antoine M 2024-02-01 18:24:07 +01:00
parent dccc7c17b4
commit a678d0b3e8
2 changed files with 6 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/assets/css/pages/Home.scss
View File

@ -1,12 +1,10 @@
.page-container--home {
.screen {
@apply flex flex-col justify-center items-center relative overflow-hidden;
.screen_worker_1,
.screen_worker_2 {
@apply absolute;
@apply hidden lg:block absolute;
max-height: 60%;
bottom: -2rem;
bottom: -3rem;
}
.screen_worker_1 {
@apply left-0;
@ -15,14 +13,6 @@
@apply -right-16;
}
&__content {
@apply text-center pt-12 px-16 w-fit mx-auto h-auto overflow-visible relative;
padding-bottom: -100px;
background-image: url("../../img/mask.svg");
background-position: center;
background-size: cover;
.cover_worker {
@apply mx-auto;
transform: translate(0%, -50%);
@ -42,7 +32,7 @@
}
.application_description {
@apply max-w-2xl text-xl px-20;
@apply max-w-2xl text-xl px-20 font-bold;
margin-bottom: -40px;
}
.cta--play {

6
src/pages/Home.jsx
View File

@ -1,5 +1,5 @@
import Menu from "../components/Menu";
import { useWordpressCustomData, useUmamiDatas, useUmamiUpdateDatas } from "../hooks/WordpressFetchData";
import { useWordpressCustomData } from "../hooks/WordpressFetchData";
import coverWorker from "../assets/img/cover_worker.svg";
import screenWorker1 from "../assets/img/screen_worker_1.svg";
import screenWorker2 from "../assets/img/screen_worker_2.svg";
@ -7,7 +7,7 @@ import { Link } from "react-router-dom";
import { useEffect, useState } from "react";
export default function Home() {
const welcomeScreenDatas = useWordpressCustomData("/interface-content/welcome");
const welcomeScreenDatas = useWordpressCustomData("/screen/welcome");
if (!welcomeScreenDatas) {
return <div>Chargement...</div>;
@ -27,7 +27,7 @@ export default function Home() {
</p>
<Link
to='/select-profile'
className='cta cta--construction cta--round cta--play '
className='cta cta--construction cta--round cta--button-icon cta--play '
/>
</section>
<img className='screen_worker_1' src={screenWorker1} alt='' />