Merge pull request #663 from RadhikaMalpani1702/main

Fixed the Dark Mode is Working and Enhanced the Contributors Page and Other Pages
Priyaaa1 · Aug 1, 2024 · a4133d2 · a4133d2
2 parents b361e36 + b0cb1a7
commit a4133d2
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 20 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -47,14 +47,14 @@ import Contributors from './Pages/Contributors.jsx';
 const ThemeContext = createContext();
 
 const App = () => {
-  const theme = useSelector((state) => state.theme.value) ? "dark" : "light";
-  const [currentTheme, setTheme] = useState(theme);
+   const theme = useSelector((state) => state.theme.value) ? "dark" : "light"; 
+   const [currentTheme, setTheme] = useState(theme);
 
-  const toggleTheme = () => {
-    const newTheme = currentTheme === 'light' ? 'dark' : 'light';
-    setTheme(newTheme);
-    localStorage.setItem('theme', newTheme);
-  };
+   const toggleTheme = () => {
+     const newTheme = currentTheme === 'light' ? 'dark' : 'light';
+     setTheme(newTheme);
+     localStorage.setItem('theme', newTheme);
+   };
 
   useEffect(() => {
     AOS.init({

diff --git a/src/Pages/Blogs.jsx b/src/Pages/Blogs.jsx
@@ -122,13 +122,13 @@ const BlogsWrapper = styled.div`
   max-width: 1200px;
   margin: 0 auto;
   line-height: 1.6;
-  background-color: #e3f2fd;
+  
 
   h1 {
     font-size: 2.5rem;
     margin-top: 80px;
     text-align: center;
-    color: #212ea0;
+    
   }
 `;
 

diff --git a/src/Pages/Contributors.css b/src/Pages/Contributors.css
@@ -1,10 +1,15 @@
-
 .contributors-container {
   width: 100%;
   height: 100%; 
   padding-top: 2rem;
   overflow: hidden;
-  background-color: rgb(221, 229, 246); /* Change background color to white or any light color */
+
+}
+
+.github-icon {
+  margin-right: 0.5rem;
+  vertical-align: middle;
+  fill: white; /* Adjust color as needed */
 }
 
 
@@ -13,7 +18,6 @@
   text-align: center;
   font-size: 2.5rem;
   font-weight: 600;
-  color: #1f2937;
   margin-bottom: 2rem;
   text-transform: uppercase;
 }
@@ -23,7 +27,7 @@
   flex-wrap: wrap;
   justify-content: center;
   gap: 2rem;
-  margin-bottom: 1rem;
+  margin-bottom: 4rem;
 }
 
 .contributor-card {
@@ -32,8 +36,8 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  background-color: #1f2937;
-  border: 1px solid #d1d5db;
+  background-color: rgb(0, 0, 85);
+  border: 2px solid #6969ff;
   border-radius: 0.5rem;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   padding: 1rem;
@@ -55,6 +59,7 @@
   border-radius: 50%;
   object-fit: cover;
   margin-bottom: 1rem;
+  border: 2.5px solid #9e9eff;
 }
 
 .contributor-name {

diff --git a/src/Pages/Contributors.jsx b/src/Pages/Contributors.jsx
@@ -37,7 +37,18 @@ function Contributors() {
                 className="contributor-avatar"
               />
             </a>
-            <h2 className="contributor-name">{contributor.login}</h2>
+            <h2 className="contributor-name">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="1.2rem"
+                height="1.2rem"
+                className="github-icon"
+              >
+                <path d="M12 2C6.48 2 2 6.48 2 12c0 4.42 2.87 8.17 6.84 9.49.5.09.68-.22.68-.49v-1.76c-2.78.6-3.37-1.35-3.37-1.35-.45-1.14-1.1-1.44-1.1-1.44-.9-.62.07-.61.07-.61 1 .07 1.53 1.03 1.53 1.03.89 1.53 2.34 1.09 2.91.83.09-.65.35-1.09.64-1.34-2.23-.25-4.58-1.12-4.58-4.98 0-1.1.4-2 1.07-2.71-.11-.26-.47-1.31.1-2.73 0 0 .85-.27 2.78 1.02a9.639 9.639 0 0 1 2.54-.34c.87.01 1.76.12 2.54.34 1.92-1.29 2.77-1.02 2.77-1.02.57 1.42.21 2.47.1 2.73.66.71 1.07 1.61 1.07 2.71 0 3.88-2.35 4.73-4.61 4.98.36.31.69.92.69 1.85v2.73c0 .27.18.59.69.49C21.13 20.17 24 16.42 24 12c0-5.52-4.48-10-10-10z" />
+              </svg>
+              {contributor.login}
+            </h2>
             <p className="contributor-contributions">
               Contributions: {contributor.contributions}
             </p>

diff --git a/src/Pages/Licensing.jsx b/src/Pages/Licensing.jsx
@@ -8,7 +8,6 @@ const Container = styled.div`
   margin-top: 60px;
   padding: 20px;
   font-family: Arial, sans-serif;
-  background-color: #f9f9f9;
   border-radius: 5px;
 `;
 

diff --git a/src/Pages/feedback.css b/src/Pages/feedback.css
@@ -13,12 +13,12 @@
   align-items: center;
   justify-content: center;
   padding: 20px;
-  background-color: #f9f9f9;
   border-radius: 10px;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
   width: 100%;
   max-width: 600px;
   box-sizing: border-box;
+  margin-top: 55px;
 }
 
 .feedback-form h2 {
@@ -29,7 +29,7 @@
 }
 
 .feedback-form p {
-  color: #666;
+
   font-size: 16px;
   margin-bottom: 20px;
   text-align: center;
@@ -58,7 +58,7 @@
 .feedback-form label {
   font-size: 14px;
   margin-bottom: 5px;
-  color: #333;
+
 }
 
 .feedback-form input[type="text"],