Skip to content

Commit a3575fc

Browse files
committed
Dark mode local storage
1 parent db50324 commit a3575fc

File tree

5 files changed

+9
-7
lines changed

5 files changed

+9
-7
lines changed

src/components/AppBanner.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ const AppBanner = () => {
3030
<div className="w-full sm:w-2/3 text-right float-right mt-8 sm:mt-0">
3131
<img
3232
src={
33-
activeTheme === 'light' ? developerLight : developerDark
33+
activeTheme === 'dark' ? developerDark : developerLight
3434
}
3535
alt="Developer"
3636
/>

src/components/AppFooter.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ const AppFooter = () => {
4949
<a
5050
href="https://stoman.me"
5151
target="__blank"
52-
className="text-secondary-dark dark:text-secondary-light font-medium uppercase hover:underline"
52+
className="text-secondary-dark dark:text-secondary-light font-medium uppercase hover:underline ml-1"
5353
>
5454
Stoman
5555
</a>

src/components/AppHeader.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -119,9 +119,9 @@ const AppHeader = () => {
119119
className="ml-8 bg-primary-light dark:bg-ternary-dark p-3 shadow-sm rounded-xl cursor-pointer"
120120
>
121121
{activeTheme === 'dark' ? (
122-
<FiMoon class="text-liText-ternary-dark hover:text-gray-400 dark:text-liText-ternary-light dark:hover:text-liBorder-primary-light text-xl" />
122+
<FiMoon className="text-liText-ternary-dark hover:text-gray-400 dark:text-liText-ternary-light dark:hover:text-liBorder-primary-light text-xl" />
123123
) : (
124-
<FiSun class="text-gray-200 hover:text-gray-50 text-xl" />
124+
<FiSun className="text-gray-200 hover:text-gray-50 text-xl" />
125125
)}
126126
</div>
127127
</div>

src/components/ProjectsFilter.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,12 +24,14 @@ const ProjectsFilter = () => {
2424
dark:text-ternary-light
2525
"
2626
>
27-
<option value class="text-sm sm:text-md">
27+
<option value className="text-sm sm:text-md">
2828
All Projects
2929
</option>
3030

3131
{selectOptions.map((option) => (
32-
<option className="text-normal sm:text-md">{option}</option>
32+
<option className="text-normal sm:text-md" key={option}>
33+
{option}
34+
</option>
3335
))}
3436
</select>
3537
);

src/hooks/ThemeSwitcher.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useEffect, useState } from 'react';
22

33
const ThemeSwitcher = () => {
4-
const [theme, setTheme] = useState('dark');
4+
const [theme, setTheme] = useState(localStorage.theme);
55
const activeTheme = theme === 'dark' ? 'light' : 'dark';
66

77
useEffect(() => {

0 commit comments

Comments
 (0)