From 25785a91ec20ecaebb7d00a5aab819cda9008eea Mon Sep 17 00:00:00 2001
From: Mohammad Khalilzadeh <muhammadkhalilzadeh1998@gmail.com>
Date: Tue, 23 Jul 2024 20:20:18 +0330
Subject: [PATCH] applying changes

---
 Client/src/Components/Charts/Servers/serverStatus.css | 4 ++--
 Client/src/Components/NavBar/index.jsx                | 5 +++--
 Client/src/Layouts/HomeLayout/index.css               | 2 +-
 Client/src/Pages/Monitors/Configure/index.jsx         | 1 +
 Client/src/Pages/Monitors/CreateMonitor/index.jsx     | 1 +
 Client/src/Pages/Monitors/Details/index.jsx           | 1 +
 Client/src/Pages/Monitors/index.css                   | 2 ++
 Client/src/Pages/Monitors/index.jsx                   | 1 +
 Client/src/Pages/Settings/index.jsx                   | 1 +
 Client/src/index.css                                  | 1 +
 10 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/Client/src/Components/Charts/Servers/serverStatus.css b/Client/src/Components/Charts/Servers/serverStatus.css
index 97a4fec3f..b3cad9429 100644
--- a/Client/src/Components/Charts/Servers/serverStatus.css
+++ b/Client/src/Components/Charts/Servers/serverStatus.css
@@ -14,7 +14,7 @@
 .server-status-tile {
   min-width: 250px;
   width: calc(100% - 310px);
-  padding: var(--spacing-general-1);
+  padding: var(--spacing-general-0);
   border: 1px solid var(--color-border-0);
   border-radius: var(--border-radius-0);
 }
@@ -22,7 +22,7 @@
 .server-status-tile-title {
   font-size: var(--font-size-0);
   font-weight: bold;
-  margin-bottom: 25px;
+  margin-bottom: calc(var(--spacing-general-1) / 2);
 }
 
 .server-status-tile-value {
diff --git a/Client/src/Components/NavBar/index.jsx b/Client/src/Components/NavBar/index.jsx
index 1b3dd8c6a..f99ad14b6 100644
--- a/Client/src/Components/NavBar/index.jsx
+++ b/Client/src/Components/NavBar/index.jsx
@@ -99,8 +99,9 @@ function NavBar() {
       position="sticky"
       sx={{
         width: "100%",
-        backgroundColor: "white",
-        boxShadow: "var(--env-var-shadow-1)",
+        backgroundColor: "transparent",
+        boxShadow: "none",
+        borderBottom: "1px solid var(--color-border-0)",
       }}
     >
       <Container maxWidth="xxl" sx={{ width: "100%" }}>
diff --git a/Client/src/Layouts/HomeLayout/index.css b/Client/src/Layouts/HomeLayout/index.css
index 76065015b..607e0b34d 100644
--- a/Client/src/Layouts/HomeLayout/index.css
+++ b/Client/src/Layouts/HomeLayout/index.css
@@ -6,7 +6,7 @@
   justify-content: flex-start;
 }
 
-.main-content>div:nth-child(2){
+.main-content > div:nth-child(2) {
   position: relative;
   /* overflow-y: auto; */
   flex: 1;
diff --git a/Client/src/Pages/Monitors/Configure/index.jsx b/Client/src/Pages/Monitors/Configure/index.jsx
index c6ce13f89..8c5fa4f20 100644
--- a/Client/src/Pages/Monitors/Configure/index.jsx
+++ b/Client/src/Pages/Monitors/Configure/index.jsx
@@ -127,6 +127,7 @@ const Configure = () => {
       style={{
         maxWidth: "1200px",
         padding: `${theme.content.pY} ${theme.content.pX}`,
+        backgroundColor: "var(--env-var-color-30)",
       }}
     >
       <Button
diff --git a/Client/src/Pages/Monitors/CreateMonitor/index.jsx b/Client/src/Pages/Monitors/CreateMonitor/index.jsx
index 16b002abc..8e321e0aa 100644
--- a/Client/src/Pages/Monitors/CreateMonitor/index.jsx
+++ b/Client/src/Pages/Monitors/CreateMonitor/index.jsx
@@ -133,6 +133,7 @@ const CreateMonitor = () => {
       style={{
         maxWidth: "1200px",
         padding: `${theme.content.pY} ${theme.content.pX}`,
+        backgroundColor: "var(--env-var-color-30)",
       }}
     >
       <Button
diff --git a/Client/src/Pages/Monitors/Details/index.jsx b/Client/src/Pages/Monitors/Details/index.jsx
index 8eaac61ab..6616e7ee0 100644
--- a/Client/src/Pages/Monitors/Details/index.jsx
+++ b/Client/src/Pages/Monitors/Details/index.jsx
@@ -203,6 +203,7 @@ const DetailsPage = () => {
       className="monitor-details"
       style={{
         padding: `${theme.content.pY} ${theme.content.pX}`,
+        backgroundColor: "var(--env-var-color-30)",
       }}
     >
       <Button
diff --git a/Client/src/Pages/Monitors/index.css b/Client/src/Pages/Monitors/index.css
index c680b4942..fac513a88 100644
--- a/Client/src/Pages/Monitors/index.css
+++ b/Client/src/Pages/Monitors/index.css
@@ -5,6 +5,7 @@
 
 .monitors {
   font-family: var(--env-var-font-familt-1);
+  background-color: var(--env-var-color-30);
 }
 
 .monitors-bar {
@@ -23,6 +24,7 @@
   margin-top: var(--env-var-spacing-2);
   display: flex;
   gap: 24px;
+  height: 100px;
 }
 
 .monitors-gaps-medium {
diff --git a/Client/src/Pages/Monitors/index.jsx b/Client/src/Pages/Monitors/index.jsx
index e08e973e1..bbe6779fe 100644
--- a/Client/src/Pages/Monitors/index.jsx
+++ b/Client/src/Pages/Monitors/index.jsx
@@ -126,6 +126,7 @@ const Monitors = () => {
       className="monitors"
       style={{
         padding: `${theme.content.pY} ${theme.content.pX}`,
+        backgroundColor: "var(--env-var-color-30)",
       }}
     >
       <div className="monitors-bar">
diff --git a/Client/src/Pages/Settings/index.jsx b/Client/src/Pages/Settings/index.jsx
index 40cca5e66..98188a6f0 100644
--- a/Client/src/Pages/Settings/index.jsx
+++ b/Client/src/Pages/Settings/index.jsx
@@ -16,6 +16,7 @@ const Settings = () => {
         maxWidth: "1200px",
         padding: `${theme.content.pY} ${theme.content.pX}`,
         paddingBottom: 0,
+        backgroundColor: "var(--env-var-color-30)",
       }}
     >
       <form className="settings-form" noValidate spellCheck="false">
diff --git a/Client/src/index.css b/Client/src/index.css
index daf95c0a4..a414b1f89 100644
--- a/Client/src/index.css
+++ b/Client/src/index.css
@@ -48,6 +48,7 @@
   --lighter-env-var-color-27: rgba(254, 207, 96, 0.1);
   --env-var-color-28: #f79009;
   --env-var-color-29: #d0d5dd;
+  --env-var-color-30: #fcfcfd;
 
   --env-var-radius-1: 4px;
   --env-var-radius-2: 8px;