diff --git a/src/components/navbar/Navbar.module.scss b/src/components/navbar/Navbar.module.scss
index dd41935..8c1347f 100644
--- a/src/components/navbar/Navbar.module.scss
+++ b/src/components/navbar/Navbar.module.scss
@@ -81,9 +81,16 @@
color: var(--primary-color);
margin-right: auto;
margin-left: 2rem;
+
}
.backIcon {
margin-right: 0.5rem;
font-size: 1.5rem;
}
+
+@media (max-width: 650px) {
+ .backButton{
+ font-size: 1.25rem;
+ }
+}
diff --git a/src/pages/CreateServer/CreateServer.module.scss b/src/pages/CreateServer/CreateServer.module.scss
index 2a8ae86..915ca10 100644
--- a/src/pages/CreateServer/CreateServer.module.scss
+++ b/src/pages/CreateServer/CreateServer.module.scss
@@ -59,7 +59,7 @@ img {
background-color: #2f2f2f;
color: white;
cursor: pointer;
-
+ border: none;
visibility: hidden;
opacity: 0;
}
@@ -84,4 +84,26 @@ img {
.imgCard{
width: 22rem;
height: auto;
-}
\ No newline at end of file
+}
+
+@media (max-width: 1000px) {
+ .GamesContainer {
+ flex-direction: column;
+ flex-wrap: row;
+ margin-top: 40rem;
+ height: 100%;
+
+ }
+
+ .GameCard {
+ margin: 1rem;
+ width: 20rem;
+ padding: 2.5rem;
+ }
+}
+
+@media (max-width: 750px) {
+ .GamesContainer {
+ margin-top: 50rem;
+ }
+}
diff --git a/src/pages/CreateServer/Javapick/java.module.scss b/src/pages/CreateServer/Javapick/java.module.scss
index e256bab..98f8f2e 100644
--- a/src/pages/CreateServer/Javapick/java.module.scss
+++ b/src/pages/CreateServer/Javapick/java.module.scss
@@ -126,3 +126,15 @@
background-color: #145a32;
transform: scale(1.05);
}
+
+
+@media (max-width: 900px) {
+ .VersionContainer {
+ grid-template-columns: repeat(4, 1fr);
+ }
+
+ .inputContainer.inputValid {
+ transform: translateX(-20%);
+ }
+
+}
diff --git a/src/pages/PlayersStatus/PlayersStatus.module.scss b/src/pages/PlayersStatus/PlayersStatus.module.scss
index 6b0daed..2c594c3 100644
--- a/src/pages/PlayersStatus/PlayersStatus.module.scss
+++ b/src/pages/PlayersStatus/PlayersStatus.module.scss
@@ -52,4 +52,34 @@ input {
.playerName {
font-size: 1.5rem;
font-weight: 400;
-}
\ No newline at end of file
+}
+
+@media (max-width: 650px) {
+
+input {
+ font-size: 1rem;
+ padding: .35rem;
+
+}
+
+.sendButton {
+ margin-left: .25rem;
+ padding: .35rem .75rem;
+
+}
+
+
+.titlesection {
+ font-size: 1.5rem;
+}
+
+.playerAvatar {
+ width: 1.5rem;
+ height: 1.5rem;
+}
+
+.playerName {
+ font-size: 1rem;
+}
+ }
+
\ No newline at end of file
diff --git a/src/pages/ServerDetails/ServerDetails.jsx b/src/pages/ServerDetails/ServerDetails.jsx
index 99ca6b9..b4c4148 100644
--- a/src/pages/ServerDetails/ServerDetails.jsx
+++ b/src/pages/ServerDetails/ServerDetails.jsx
@@ -11,7 +11,7 @@ import PropTypes from "prop-types";
import { FaCogs, FaUserFriends, FaGlobe, FaHistory, FaClipboardList, FaSave, FaLock } from 'react-icons/fa';
import { FiChevronsLeft, FiChevronsRight } from "react-icons/fi";
import NotFoundPage from '../NotFoundPage/NotFoundPage';
-import { useLocation,useNavigate} from 'react-router-dom';
+import { useLocation, useNavigate } from 'react-router-dom';
const ServerDetails = ({ user }) => {
const { serverName } = useParams();
@@ -19,7 +19,18 @@ const ServerDetails = ({ user }) => {
const navigate = useNavigate();
const initialStatus = location.state?.status ?? JSON.parse(localStorage.getItem('status')) ?? false;
const [status, setStatus] = useState(initialStatus);
- const [isSidebarCollapsed, setIsSidebarCollapsed] = useState(false);
+ const [isSidebarCollapsed, setIsSidebarCollapsed] = useState(window.innerWidth < 900);
+
+ useEffect(() => {
+ const handleResize = () => {
+ setIsSidebarCollapsed(window.innerWidth < 900);
+ };
+
+ window.addEventListener('resize', handleResize);
+ return () => {
+ window.removeEventListener('resize', handleResize);
+ };
+ }, []);
useEffect(() => {
if (location.pathname.includes('/console')) {
@@ -47,46 +58,45 @@ const ServerDetails = ({ user }) => {