diff --git a/client/src/components/AppHeader/AppHeader.css b/client/src/components/AppHeader/AppHeader.css index 7b4a3d9d..4ce64688 100644 --- a/client/src/components/AppHeader/AppHeader.css +++ b/client/src/components/AppHeader/AppHeader.css @@ -1,5 +1,5 @@ .header { - position: fixed; + position: sticky; top: 0; left: 0; width: 100%; diff --git a/client/src/components/Contribution/contribution.css b/client/src/components/Contribution/contribution.css index 8b9648f5..7b64b005 100644 --- a/client/src/components/Contribution/contribution.css +++ b/client/src/components/Contribution/contribution.css @@ -9,8 +9,6 @@ height: 100%; box-sizing: border-box; grid-area: con; - margin-bottom: 80px; - margin-top: 2%; } .activity-table table { diff --git a/client/src/components/Info/info.css b/client/src/components/Info/info.css index fae3c6cc..7e63b04f 100644 --- a/client/src/components/Info/info.css +++ b/client/src/components/Info/info.css @@ -2,44 +2,37 @@ body { margin: 0; padding: 0; font-family: "Arial", sans-serif; - color: #333; } .front-container { display: flex; flex-direction: column; - align-items: center; + align-items: flex-start; justify-content: center; padding: 20px; position: relative; - height: 90vh; - margin: 20px; background-image: url("https://cdni.iconscout.com/illustration/premium/thumb/cute-panda-working-on-laptop-illustration-download-in-svg-png-gif-file-formats--business-illustrations-3535311.png?f=webp"); - background-size: 35% 60%; + background-size: 30% auto; background-position: right center; background-repeat: no-repeat; } .cyf-img { - width: 15%; - position: relative; - left: 97%; - top: 25%; + width: 10%; + position: absolute; + right: calc(18% - 5px); + top: calc(52% - 30px); } .background-overlay { - position: absolute; - top: 0; - left: 0; - width: 70%; - height: 100%; + width: 63%; background: linear-gradient(to right, #dedede 70%, transparent 100%); z-index: 1; } .front-container h1 { - margin-top: 10%; + margin-top: 50px; font-size: 3rem; color: #333333; margin-left: 24%; diff --git a/client/src/components/Profile/Profile.css b/client/src/components/Profile/Profile.css index ac8f736b..bf587ceb 100644 --- a/client/src/components/Profile/Profile.css +++ b/client/src/components/Profile/Profile.css @@ -1,17 +1,15 @@ .profile-container { + flex: 1; background-color: #e3e3e3; display: grid; grid-template-columns: 1fr 1fr; - grid-template-rows: 1fr 1fr 1fr; + grid-template-rows: auto; grid-template-areas: "myAv myAv" "readme mypr" "con con"; - grid-gap: 10px; - padding: 10px; + grid-gap: 20px 10px; + padding: 20px 10px; width: 100%; - height: 100vh; box-sizing: border-box; - position: relative; - top: 100px; } \ No newline at end of file diff --git a/client/src/index.css b/client/src/index.css new file mode 100644 index 00000000..52d6eb58 --- /dev/null +++ b/client/src/index.css @@ -0,0 +1,6 @@ +#root{ + min-height: 100dvh; + display: flex; + flex-direction: column; + justify-content: space-between; +} \ No newline at end of file diff --git a/client/src/index.js b/client/src/index.js index c306da4d..2f61c2bc 100644 --- a/client/src/index.js +++ b/client/src/index.js @@ -1,5 +1,6 @@ import { createRoot } from "react-dom/client"; import { BrowserRouter } from "react-router-dom"; +import "./index.css"; import App from "./App"; diff --git a/client/src/pages/FormStyles.css b/client/src/pages/FormStyles.css index da0cf998..d44327c2 100644 --- a/client/src/pages/FormStyles.css +++ b/client/src/pages/FormStyles.css @@ -89,8 +89,9 @@ /* General styling for form containers */ .signUpCard, .updatePasswordForm-container, .signInCard { + width: 80%; max-width: 400px; - margin: 100px auto; + margin: 0px auto; padding: 20px; background-color: #ffffff; /* Clean white background */ border-radius: 8px; /* Rounded corners */ diff --git a/client/src/pages/Home.css b/client/src/pages/Home.css index 6750bc09..2c4a7fd8 100644 --- a/client/src/pages/Home.css +++ b/client/src/pages/Home.css @@ -3,7 +3,6 @@ main { flex-direction: column; align-items: center; justify-content: center; - min-height: calc(100vh - 80px); background-color: #ffffff; font-family: Arial, sans-serif; color: #333333; @@ -15,7 +14,6 @@ main > div { } .main_page_logo { - padding-top: 80px; height: 50dvh; min-height: 300px; width: auto; diff --git a/client/src/pages/MentorDashboard.css b/client/src/pages/MentorDashboard.css index e88a50ef..d6421223 100644 --- a/client/src/pages/MentorDashboard.css +++ b/client/src/pages/MentorDashboard.css @@ -1,8 +1,8 @@ .mentor-dashboard { + flex: 1; font-family: 'Arial', sans-serif; padding: 20px; background-color: #F9F9F9; - min-height: 100vh; } .mentor-dashboard header { @@ -10,7 +10,6 @@ justify-content: space-between; align-items: center; padding: 20px; - margin-top: 75px; } .mentor-dashboard header h1 { diff --git a/client/src/pages/SignOut.css b/client/src/pages/SignOut.css index 3aaf7b9d..9a067016 100644 --- a/client/src/pages/SignOut.css +++ b/client/src/pages/SignOut.css @@ -1,10 +1,9 @@ .signOut { + flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; - height: 100vh; - background-color: #f0f0f0; font-family: Arial, sans-serif; }