diff --git a/frontend/.env.template b/frontend/.env.template index 7a3df20b2047f40c8eb09fbff8a895ea57d0c2dd..4055e48c96107e4df5cbba1e7093d64bf957f722 100644 --- a/frontend/.env.template +++ b/frontend/.env.template @@ -1,2 +1 @@ -REACT_APP_BASE_URL_BACK=http://localhost:3001/api -REACT_APP_BASE_URL_FRONT=http://localhost:3000 \ No newline at end of file +REACT_APP_BASE_URL_BACK=http://localhost:3001/api \ No newline at end of file diff --git a/frontend/src/components/Header.js b/frontend/src/components/Header.js index 5d57d1f4f48731b189cd7392997828edcf3c14b5..c7eeadea94d9f9dd54a4f600bd7a0bdf99218153 100644 --- a/frontend/src/components/Header.js +++ b/frontend/src/components/Header.js @@ -26,11 +26,12 @@ export default function Header({ selection, setSelection }) { }, [connected]); return ( - <div id="header-container"> + <div id="header-container" style={!selection ? { flexDirection: "row" } : {}}> <div id="header-restaurant-status"> - {!selection - ? "Accueil" - : `${selection.name} : actuellement ${selection.status ? "ouvert" : "fermé"}`} + {width && + (!selection + ? "Accueil" + : `${selection.name} : actuellement ${selection.status ? "ouvert" : "fermé"}`)} </div> <Link id="header-home-link" to="/" onClick={() => setSelection(null)}> <h2>{width || !selection ? "Eatfast" : selection.name}</h2> @@ -44,6 +45,8 @@ export default function Header({ selection, setSelection }) { ) ) : user ? ( <BiLogOutCircle + id="header-button" + title="Déconnexion" onClick={() => { localStorage.removeItem("user"); window.location.assign(`${process.env.REACT_APP_BASE_URL_BACK}/auth/logout`); @@ -51,6 +54,8 @@ export default function Header({ selection, setSelection }) { /> ) : ( <BiLogInCircle + id="header-button" + title="Connexion" onClick={() => { window.location.assign(`${process.env.REACT_APP_BASE_URL_BACK}/auth/login`); }} diff --git a/frontend/src/styles/Header.css b/frontend/src/styles/Header.css index ddfdc39cb8fe67100c03df190fc6992aa98701f1..f37a45cee5114a5d4048c0f1cc9b62fb98c79aea 100644 --- a/frontend/src/styles/Header.css +++ b/frontend/src/styles/Header.css @@ -1,7 +1,7 @@ #header-container { display: flex; justify-content: space-between; - align-items: baseline; + align-items: center; padding-left: 1rem; padding-right: 1rem; background-color: rgb(33, 37, 41); @@ -24,15 +24,20 @@ font-weight: lighter; } +#header-button { + height: 2rem; + width: 2rem; +} + +#header-button:hover { + cursor: pointer; +} + @media only screen and (max-width: 600px) { #header-home-link > h2 { font-size: 2rem; } - #header-restaurant-status { - display: none; - } - #header-container { flex-direction: column; align-items: center;