diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md
index b90a79f..71f8cf4 100644
--- a/CONTRIBUTORS.md
+++ b/CONTRIBUTORS.md
@@ -132,6 +132,18 @@
aachal28
+
+
+
+
+ divy-03
+
+ |
+
diff --git a/community-website/components/DarkModeButton.tsx b/community-website/components/DarkModeButton.tsx
index d8ccfb7..f6028ed 100644
--- a/community-website/components/DarkModeButton.tsx
+++ b/community-website/components/DarkModeButton.tsx
@@ -5,28 +5,29 @@ import React, { useState, useEffect } from "react";
import { DarkModeSwitch } from "react-toggle-dark-mode";
export default function DarkModeButton() {
- const [darkMode, setDarkMode] = useState(false);
+ const [darkMode, setDarkMode] = useState(() => {
+ if (typeof window !== "undefined") {
+ return (
+ localStorage.theme === "dark" ||
+ (!("theme" in localStorage) &&
+ window.matchMedia("(prefers-color-scheme: dark)").matches)
+ );
+ }
+ return false;
+ });
useEffect(() => {
- if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
- document.documentElement.classList.add('dark');
- setDarkMode(true);
- } else {
- document.documentElement.classList.remove('dark');
- setDarkMode(false);
- }
-}, [darkMode])
-
- const toggleDarkMode = (checked: boolean) => {
- if (checked) {
- // Dark mode
+ if (darkMode) {
+ document.documentElement.classList.add("dark");
localStorage.setItem("theme", "dark");
- setDarkMode(checked);
} else {
- // Light mode
+ document.documentElement.classList.remove("dark");
localStorage.setItem("theme", "light");
- setDarkMode(checked);
}
+ }, [darkMode]);
+
+ const toggleDarkMode = (checked: boolean) => {
+ setDarkMode(checked);
};
return (
@@ -37,4 +38,4 @@ export default function DarkModeButton() {
sunColor={"white"}
/>
);
-}
\ No newline at end of file
+}
diff --git a/community-website/pages/contributors.tsx b/community-website/pages/contributors.tsx
index 0bfcfa4..da7e585 100644
--- a/community-website/pages/contributors.tsx
+++ b/community-website/pages/contributors.tsx
@@ -264,6 +264,25 @@ const Contributors: NextPage = () => {
+
+
+
+
+
+ divy-03
+
+
+ |
diff --git a/community-website/styles/LearnGitAndGitHub.module.css b/community-website/styles/LearnGitAndGitHub.module.css
index b84f704..e968752 100644
--- a/community-website/styles/LearnGitAndGitHub.module.css
+++ b/community-website/styles/LearnGitAndGitHub.module.css
@@ -244,3 +244,28 @@
padding: 5px 10px;
}
}
+
+:global(.dark) .slide {
+ background: rgba(30, 30, 30, 0.95);
+ box-shadow: 0 20px 60px rgba(255, 255, 255, 0.1);
+ color: #f1f1f1;
+ border: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+:global(.dark) .slide h2 {
+ color: #cbd5e0;
+}
+
+:global(.dark) .navBtn {
+ background: rgba(0, 0, 0, 0.2);
+ border: 2px solid white;
+ color: white;
+}
+
+:global(.dark) .navBtn:hover {
+ background: rgba(0, 0, 0, 0.3);
+}
+
+:global(.dark) .slide-counter {
+ background: rgba(0, 0, 0, 0.2);
+}