diff --git a/prediction-polls/frontend/src/Components/MobileMenu/MobileMenu.module.css b/prediction-polls/frontend/src/Components/MobileMenu/MobileMenu.module.css
index 44e66bc1..66d4d38a 100644
--- a/prediction-polls/frontend/src/Components/MobileMenu/MobileMenu.module.css
+++ b/prediction-polls/frontend/src/Components/MobileMenu/MobileMenu.module.css
@@ -1,46 +1,4 @@
-.mobileMenu {
- width: 80vw;
- height: 100vh;
- box-sizing: border-box;
- display: flex;
- flex-direction: column;
- align-items: stretch;
- padding-top: 20px;
- background-color: var(--primary-50);
- justify-content: space-between;
- overflow: auto;
-}
-.wrapper {
- position: fixed;
- width: 100vw;
- height: 100vh;
- overflow: hidden;
-}
-.menuItem {
- padding: 20px;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- gap: 20px;
- background-color: var(--primary-50);
- color: var(--neutral-900);
- cursor: pointer;
- border-bottom: 1px solid var(--neutral-300);
-}
-
-.menuItem:last-child {
- border-bottom: none;
-}
-
-.logo {
- width: 100%;
- flex-shrink: 0;
- display: flex;
- justify-content: center;
- align-items: center;
- pointer-events: none;
-}
.mobileMenuButton {
display: none;
@@ -48,8 +6,11 @@
color: var(--neutral-900);
cursor: pointer;
}
+.wrapper {
+ display: none;
+}
-@media (max-width: 640px) {
+@media (max-width: 768px) {
.mobileMenuButton {
justify-content: flex-start;
height: 50px;
@@ -60,8 +21,52 @@
cursor: pointer;
padding-left: 10px;
}
-}
-.point {
+ .mobileMenu {
+ width: 80vw;
+ height: 100%;
+ box-sizing: border-box;
+ display: flex;
+ flex-direction: column;
+ align-items: stretch;
+ padding-top: 20px;
+ background-color: var(--primary-50);
+ justify-content: space-between;
+ }
+ .wrapper {
+ flex-grow: 1;
+ position: fixed;
+ width: 100vw;
+ height: 100%;
+ z-index: 3;
+ display: flex;
+ align-items: stretch;
+ }
+
+ .menuItem {
+ padding: 20px;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ gap: 20px;
+ background-color: var(--primary-50);
+ color: var(--neutral-900);
+ cursor: pointer;
+ border-bottom: 1px solid var(--neutral-300);
+ }
+
+ .menuItem:last-child {
+ border-bottom: none;
+ }
+
+ .logo {
+ width: 100%;
+ flex-shrink: 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ pointer-events: none;
+ }
+ .point {
display: flex;
justify-content: center;
gap: 20px;
@@ -73,3 +78,5 @@
font-size: 20px;
font-weight: 700;
}
+}
+
diff --git a/prediction-polls/frontend/src/Components/MobileMenu/index.jsx b/prediction-polls/frontend/src/Components/MobileMenu/index.jsx
index e7e67b1e..902c7f3b 100644
--- a/prediction-polls/frontend/src/Components/MobileMenu/index.jsx
+++ b/prediction-polls/frontend/src/Components/MobileMenu/index.jsx
@@ -26,9 +26,7 @@ const menuData = [
const MobileMenuItem = ({ pageKey, Icon, label, navigate, to, theme }) => {
return (
navigate(to)}>
- {Icon && (
-
- )}
+ {Icon && }
{label || pageKey}
);
@@ -44,11 +42,13 @@ const MobileMenu = () => {
return (
<>
- {!menuActive && (
+ {!menuActive ? (
+ ) : (
+
)}
{menuActive && (
setMenuActive(false)}>
diff --git a/prediction-polls/frontend/src/Components/PollCard/PollCard.module.css b/prediction-polls/frontend/src/Components/PollCard/PollCard.module.css
index 99b0aea0..9362480a 100644
--- a/prediction-polls/frontend/src/Components/PollCard/PollCard.module.css
+++ b/prediction-polls/frontend/src/Components/PollCard/PollCard.module.css
@@ -163,4 +163,26 @@
a{
text-decoration: none;
+}
+
+.buttonText{
+ margin: 0px;
+}
+
+@media (max-width:769px){
+ .buttonText{
+ display: none;
+ }
+ .commentButton,
+.shareButton,
+.reportButton {
+ padding: 12px;
+}
+}
+@media (max-width:1025px){
+ .card{
+ padding: 25px 15px ;
+
+ }
+
}
\ No newline at end of file
diff --git a/prediction-polls/frontend/src/Components/PollCard/index.jsx b/prediction-polls/frontend/src/Components/PollCard/index.jsx
index 9542531d..43e9e40a 100644
--- a/prediction-polls/frontend/src/Components/PollCard/index.jsx
+++ b/prediction-polls/frontend/src/Components/PollCard/index.jsx
@@ -79,7 +79,7 @@ function PollCard({ PollData }) {
{`${PollData.comments.length} comment${
@@ -90,13 +90,14 @@ function PollCard({ PollData }) {
diff --git a/prediction-polls/frontend/src/Components/Sidebar/Sidebar.module.css b/prediction-polls/frontend/src/Components/Sidebar/Sidebar.module.css
index 6885b0a8..f4875e15 100644
--- a/prediction-polls/frontend/src/Components/Sidebar/Sidebar.module.css
+++ b/prediction-polls/frontend/src/Components/Sidebar/Sidebar.module.css
@@ -58,7 +58,7 @@
border: none;
}
-@media (max-width: 640px) {
+@media (max-width: 768px) {
.sidebar {
display: none;
}
diff --git a/prediction-polls/frontend/src/Pages/Auth/SignIn/SignIn.module.css b/prediction-polls/frontend/src/Pages/Auth/SignIn/SignIn.module.css
index e85184fe..29ef13b4 100644
--- a/prediction-polls/frontend/src/Pages/Auth/SignIn/SignIn.module.css
+++ b/prediction-polls/frontend/src/Pages/Auth/SignIn/SignIn.module.css
@@ -85,4 +85,10 @@
.messageStyle {
color: var(--neutral-100);
color: var(--warning-600)
+}
+@media (max-width: 768px) {
+ .imageStyle{
+ display: none;
+ }
+
}
\ No newline at end of file
diff --git a/prediction-polls/frontend/src/Pages/Auth/SignUp/SignUp.module.css b/prediction-polls/frontend/src/Pages/Auth/SignUp/SignUp.module.css
index 09ea98bc..3c4d04c7 100644
--- a/prediction-polls/frontend/src/Pages/Auth/SignUp/SignUp.module.css
+++ b/prediction-polls/frontend/src/Pages/Auth/SignUp/SignUp.module.css
@@ -58,6 +58,7 @@
display: flex;
flex-direction: column;
align-items: center;
+ justify-content: center
}
.logoStyle {
@@ -67,4 +68,11 @@
margin-bottom: 20px;
max-width: 80%;
max-height: 80%;
- }
\ No newline at end of file
+ }
+
+ @media (max-width: 768px) {
+ .imageContainerStyle{
+ display: none;
+ }
+
+ }
\ No newline at end of file
diff --git a/prediction-polls/frontend/src/Pages/Feed/Feed.module.css b/prediction-polls/frontend/src/Pages/Feed/Feed.module.css
index ba3df987..d8e406b8 100644
--- a/prediction-polls/frontend/src/Pages/Feed/Feed.module.css
+++ b/prediction-polls/frontend/src/Pages/Feed/Feed.module.css
@@ -2,16 +2,31 @@
display: flex;
background-color: var(--neutral-white);
width: 100%;
+ box-sizing: border-box;
}
-@media (max-width: 640px) {
+@media (max-width: 768px) {
.page{
flex-direction: column;
}
+ .pointsButton{
+ display:none;
+ }
+ .pollList{
+ display: flex;
+ flex-direction: column;
+ width: 100%;
+ padding: 20px;
+ justify-content: center;
+ align-items: center;
+ }
}
+
+@media (min-width: 769px) {
.pollList{
display: flex;
flex-direction: column;
padding-left: 20px;
width: 60%;
- margin-top: 30px;
+ padding-top: 100px;
+}
}
\ No newline at end of file
diff --git a/prediction-polls/frontend/src/Pages/Feed/index.jsx b/prediction-polls/frontend/src/Pages/Feed/index.jsx
index 5996afc1..97144f71 100644
--- a/prediction-polls/frontend/src/Pages/Feed/index.jsx
+++ b/prediction-polls/frontend/src/Pages/Feed/index.jsx
@@ -16,7 +16,8 @@ function Feed() {
))
}
-
+
);
}