diff --git a/frontend/src/Components/MainPage.tsx b/frontend/src/Components/MainPage.tsx index 49a3d2d2e1f98e62c5193736ddc84dd69e5af401..57075c64f7f20961dca28ba2c9e8834f0a63ef67 100644 --- a/frontend/src/Components/MainPage.tsx +++ b/frontend/src/Components/MainPage.tsx @@ -41,9 +41,6 @@ class MainPage extends React.Component<props, state> { render() { return ( <div className={'main-page'}> - <div className={'header'}> - Header - </div> <div className={'body'}> <PageContext.Provider value={{ changePage: this.changePage, diff --git a/frontend/src/Components/NavButton.tsx b/frontend/src/Components/NavButton.tsx index cde5bf05c25ef5bacde28129f90f84334a838cc4..03d86be15ef1d5f59f7cd8f23be0c1ae5ebcbac1 100644 --- a/frontend/src/Components/NavButton.tsx +++ b/frontend/src/Components/NavButton.tsx @@ -23,7 +23,6 @@ const NavButton = (props: props) => { style={{ width: '4rem', height: '4rem' }} onClick={onClick} /> - // <button onClick={onClick}>{props.direction}</button> ) }; diff --git a/frontend/src/Style/ArtPage.css b/frontend/src/Style/ArtPage.css index 14a0749a72df6963ce7e8a39534b5eafd1c8f05e..e9ee5d8d541ba7ff6956d61bd0e3dcdb9f8f8ce0 100644 --- a/frontend/src/Style/ArtPage.css +++ b/frontend/src/Style/ArtPage.css @@ -3,10 +3,15 @@ grid-template-columns: 1fr 2fr 1fr; grid-template-rows: 1fr 10fr 1fr; height: 100vh; + grid-template-areas: + "favorite . dropdown" + "left exhibition right" + ". . ." ; } .exhibition-piece { display: flex; + grid-area: exhibition; grid-row: 2 / 3; grid-column: 2 / 3; align-items: center; @@ -58,11 +63,13 @@ .navbutton.left { grid-column: 1 / 2; + grid-area: left; flex-direction: row-reverse; margin-right: 10rem; } .navbutton.right { grid-column: 3 / 4; + grid-area: right; margin-left: 10rem; } @@ -71,4 +78,4 @@ width: 5rem; height: 2rem; margin-bottom: 3rem; -} \ No newline at end of file +} diff --git a/frontend/src/Style/LandingPage.css b/frontend/src/Style/LandingPage.css index dc29b4453efc050f352f5d300b27c93c6f50ada6..7695dfb2d6487dc89c9a39975fdf2442420aad44 100644 --- a/frontend/src/Style/LandingPage.css +++ b/frontend/src/Style/LandingPage.css @@ -1,13 +1,12 @@ .landing-page { - display: grid; - grid-template-columns: 1fr 2fr 1fr; - grid-template-rows: 1fr 1fr 1fr 1fr 1fr; - gap: 0px 0px; - grid-template-areas: - ". Title ." - ". welcome-svg ." - ". welcome-svg ." - "navbutton-left welcome-p navbutton-right"; + display: grid; + grid-template-columns: 1fr 2fr 1fr; + grid-template-rows: 1fr 10fr 1fr; + height: 100vh; + grid-template-areas: + ". Title ." + "left welcomesvg right" + ". welcomep ." ; } .title { @@ -17,18 +16,18 @@ } .welcome-svg { - grid-area: welcome-svg; + grid-area: welcomesvg; place-self: center; } .favorites { - grid-area: welcome-p; + grid-area: welcomep; padding-top: 7rem; padding-left: 3rem; } .welcome-p { - grid-area: welcome-p; + grid-area: welcomep; text-align: left; margin: 25px 50px 100px; font-family: Arial, Helvetica, sans-serif; @@ -36,9 +35,17 @@ } .navbutton.left { - grid-area: navbutton-left; + grid-area: left; + place-self: center; + position: fixed; + top: 50%; + left: 5%; } .navbutton.right { - grid-area: navbutton-right; + grid-area: right; + place-self: center; + position: fixed; + top: 50%; + right: 5%; }