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"],