From 247b116310f993ab08630701e0fb3179cfee5b2c Mon Sep 17 00:00:00 2001 From: fikretellek Date: Fri, 9 Aug 2024 11:48:40 +0100 Subject: [PATCH] footer bug resolved once again --- client/src/components/AppHeader/AppHeader.css | 3 --- .../components/Contribution/contribution.css | 2 -- client/src/components/Footer/Footer.css | 3 --- client/src/components/Info/info.css | 20 +++++++------------ client/src/components/Profile/Profile.css | 10 ++++------ client/src/index.css | 6 ++++++ client/src/index.js | 2 +- client/src/pages/FormStyles.css | 3 ++- client/src/pages/Home.css | 3 +-- client/src/pages/SignOut.css | 2 +- 10 files changed, 22 insertions(+), 32 deletions(-) create mode 100644 client/src/index.css diff --git a/client/src/components/AppHeader/AppHeader.css b/client/src/components/AppHeader/AppHeader.css index 7b4a3d9d..35d7b7ec 100644 --- a/client/src/components/AppHeader/AppHeader.css +++ b/client/src/components/AppHeader/AppHeader.css @@ -1,7 +1,4 @@ .header { - position: fixed; - top: 0; - left: 0; width: 100%; display: flex; justify-content: space-between; 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/Footer/Footer.css b/client/src/components/Footer/Footer.css index d1500b17..ad93aa40 100644 --- a/client/src/components/Footer/Footer.css +++ b/client/src/components/Footer/Footer.css @@ -9,9 +9,6 @@ padding: 10px 20px; box-sizing: border-box; font-family: Raleway, Arial; - position: fixed; - bottom: 0; - left: 0; } .footer-content { diff --git a/client/src/components/Info/info.css b/client/src/components/Info/info.css index fae3c6cc..bf8f7325 100644 --- a/client/src/components/Info/info.css +++ b/client/src/components/Info/info.css @@ -9,31 +9,25 @@ body { .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; } 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..4318c1e6 100644 --- a/client/src/index.js +++ b/client/src/index.js @@ -1,6 +1,6 @@ import { createRoot } from "react-dom/client"; import { BrowserRouter } from "react-router-dom"; - +import "./index.css"; import App from "./App"; createRoot(document.getElementById("root")).render( 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..27769ba5 100644 --- a/client/src/pages/Home.css +++ b/client/src/pages/Home.css @@ -1,9 +1,9 @@ main { + flex: 1; display: flex; 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 +15,6 @@ main > div { } .main_page_logo { - padding-top: 80px; height: 50dvh; min-height: 300px; width: auto; diff --git a/client/src/pages/SignOut.css b/client/src/pages/SignOut.css index 3aaf7b9d..82028951 100644 --- a/client/src/pages/SignOut.css +++ b/client/src/pages/SignOut.css @@ -1,9 +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; }