diff --git a/frontend/src/Components/ArtPage.tsx b/frontend/src/Components/ArtPage.tsx index 362e2de963f9b82acc594777360ef429dd7c71ef..0cdf90fe4f044025ed31e2e03e964ac6416d7866 100644 --- a/frontend/src/Components/ArtPage.tsx +++ b/frontend/src/Components/ArtPage.tsx @@ -4,6 +4,7 @@ import FavoriteButton from './FavoriteButton'; import DropDown from './DropDown'; import NavButton from './NavButton'; import '../Style/ArtPage.css'; +import '../Style/MainPage.css' import Music from "./Music"; diff --git a/frontend/src/Components/LandingPage.tsx b/frontend/src/Components/LandingPage.tsx index 2e3bc0d97d6945df4df64200947cb527b9cf95c2..ad37105d89a26088d32368595d9eeadd56823f78 100644 --- a/frontend/src/Components/LandingPage.tsx +++ b/frontend/src/Components/LandingPage.tsx @@ -1,6 +1,7 @@ import React, { ReactElement} from 'react'; import NavButton from './NavButton'; import "../Style/LandingPage.css" +import "../Style/MainPage.css" import FavoriteLink from "./FavoriteLink"; import LandingpageSvg from "./LandingpageSVG"; diff --git a/frontend/src/Style/ArtPage.css b/frontend/src/Style/ArtPage.css index 11cc67c9f158c07a1a80855aacb576ea8d162997..87a53f9e18c06a2efb989f16fd2c3e434a13f432 100644 --- a/frontend/src/Style/ArtPage.css +++ b/frontend/src/Style/ArtPage.css @@ -71,19 +71,3 @@ svg { font-family: "Comic Sans MS", serif; } - -.navbutton.left { - grid-area: left; - margin-right: 10rem; -} -.navbutton.right { - grid-area: right; - margin-left: 10rem; -} - -.navbutton button { - font-size: large; - width: 5rem; - height: 2rem; - margin-bottom: 3rem; -} diff --git a/frontend/src/Style/LandingPage.css b/frontend/src/Style/LandingPage.css index a0a6f9ae173b4da368ea50b1f6ec0ec2a2294b1c..5bd0673b7aa6ebe1de637c6d7364d257c844a73a 100644 --- a/frontend/src/Style/LandingPage.css +++ b/frontend/src/Style/LandingPage.css @@ -34,17 +34,8 @@ font-size: 15px; } -.navbutton.left { - grid-area: left; - place-self: center; - position: fixed; - top: 50%; - left: 5%; -} -.navbutton.right { - grid-area: navbutton-right; -} + .flex2 { @@ -72,12 +63,21 @@ font-size: large; } - .navbutton.right { - } - .navbutton.left { + grid-area: left; + place-self: center; + position: static; + top: 90%; + left: 10%; } + .navbutton.right { + grid-area: right; + place-self: center; + position: static; + top: 90%; + right: 5%; + } .flex2 { display: flex; flex-direction: row; diff --git a/frontend/src/Style/MainPage.css b/frontend/src/Style/MainPage.css index 17ba418a6486bedc1f4246db31c1d2728783753a..d08bcf83f4187b96bf5e9846c8d8ff3e690a0ac3 100644 --- a/frontend/src/Style/MainPage.css +++ b/frontend/src/Style/MainPage.css @@ -6,18 +6,13 @@ background-color: grey; } -.navbutton { - grid-row: 3 / 4; - display: flex; -} .navbutton.left { - grid-column: 1 / 2; - flex-direction: row-reverse; + grid-area: left; margin-right: 10rem; } .navbutton.right { - grid-column: 3 / 4; + grid-area: right; margin-left: 10rem; } @@ -26,4 +21,20 @@ width: 5rem; height: 2rem; margin-bottom: 3rem; +} + +.navbutton.left { + grid-area: left; + place-self: center; + position: fixed; + top: 50%; + left: 5%; +} + +.navbutton.right { + grid-area: right; + place-self: center; + position: fixed; + top: 50%; + right: 5%; } \ No newline at end of file