From e1ccbf205f3a706a911eeb1cab9921afb35703f6 Mon Sep 17 00:00:00 2001 From: deadvey Date: Tue, 8 Oct 2024 23:11:49 +0100 Subject: [PATCH] dark/light mode toggle --- README.md | 1 + README.md~ | 0 assets/moon.png | Bin 0 -> 6494 bytes assets/sun.png | Bin 0 -> 1656 bytes components/header.html | 23 +++++++++++++++-------- index.html | 3 ++- style.css | 20 ++++++++++++++++++++ 7 files changed, 38 insertions(+), 9 deletions(-) create mode 100644 README.md create mode 100644 README.md~ create mode 100644 assets/moon.png create mode 100644 assets/sun.png diff --git a/README.md b/README.md new file mode 100644 index 0000000..c5ce284 --- /dev/null +++ b/README.md @@ -0,0 +1 @@ +Javalsai's website https://javalsai.dynv6.net/ \ No newline at end of file diff --git a/README.md~ b/README.md~ new file mode 100644 index 0000000..e69de29 diff --git a/assets/moon.png b/assets/moon.png new file mode 100644 index 0000000000000000000000000000000000000000..16c1040e6b8a5fe4c591302ac0f47b54dbcad763 GIT binary patch literal 6494 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 - + + diff --git a/index.html b/index.html index c635bcc..404dc14 100644 --- a/index.html +++ b/index.html @@ -27,7 +27,7 @@ - +
@@ -96,6 +96,7 @@ and no, no light mode, I have enough with this

+ diff --git a/style.css b/style.css index 64f267a..ff74633 100644 --- a/style.css +++ b/style.css @@ -21,6 +21,26 @@ body { color: var(--text); caret-color: var(--primary); } +.light-mode { + background-color: white; + color: black; + .theme-toggle-image { + content:url("/assets/moon.png"); + } + button { + background-color: white; + border: 0px; + margin: 0px + } +} +.theme-toggle-image { + content:url("/assets/sun.png"); +} +button { + background-color: black; + border: 0px; + margin: 0px +} *, *::before, *::after { transition: all .3s ease-out;