noham/Manuel
1
0
Fork 0
mirror of https://github.com/NohamR/Manuel.git synced 2025-05-24 00:49:10 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix dark mod

Browse Source
This commit is contained in:
NohamR 2023-04-08 20:44:28 +02:00
parent 64277baa82
commit 21025fa127
2 changed files with 17 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
index.html
View File

@ -4,7 +4,7 @@
<head> <head>
<title>Manuel</title> <title>Manuel</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="img/icone.ico" type="image/x-icon"> <link rel="shortcut icon" href="assets/img/icone.ico" type="image/x-icon">
<!-- <script src="js.js"></script> --> <!-- <script src="js.js"></script> -->
</head> </head>
@ -13,7 +13,7 @@
<div id="firstbutton"> <div id="firstbutton">
<div class="changeTheme"> <div class="changeTheme">
<img src="img/blackandwhite.png" alt="blackandwhite" style="max-width: 50px; max-height: 50px; margin: 10px;"> <img src="assets/img/blackandwhite.png" alt="blackandwhite" style="max-width: 50px; max-height: 50px; margin: 10px;">
</div> </div>
<div> <div>
@ -79,8 +79,8 @@
</div> </div>
<div id="img"> <div id="img">
<img id="myimg1" src="img/404.png"> <img id="myimg1" src="assets/img/404.png">
<img id="myimg2" src="img/404.png"> <img id="myimg2" src="assets/img/404.png">
</div> </div>
<div> <div>
@ -282,10 +282,12 @@
// cookie pour le mode sombre // cookie pour le mode sombre
function checkCookie() { function checkCookie() {
if (darkMode == "true") { if (darkMode == "true") {
document.documentElement.style.setProperty('--color-scheme', 'dark')
document.documentElement.style.setProperty('--ecriture', '#f1f1f1'); document.documentElement.style.setProperty('--ecriture', '#f1f1f1');
document.documentElement.style.setProperty('--background', '#262626'); document.documentElement.style.setProperty('--background', '#262626');
toggleTheme--; toggleTheme--;
} else if (darkMode == "false") { } else if (darkMode == "false") {
document.documentElement.style.setProperty('--color-scheme', 'light')
document.documentElement.style.setProperty('--ecriture', '#262626'); document.documentElement.style.setProperty('--ecriture', '#262626');
document.documentElement.style.setProperty('--background', '#f1f1f1'); document.documentElement.style.setProperty('--background', '#f1f1f1');
} }
@ -294,12 +296,18 @@
// mode sombre // mode sombre
const switchThemeBtn = document.querySelector('.changeTheme') const switchThemeBtn = document.querySelector('.changeTheme')
switchThemeBtn.addEventListener('click', () => { switchThemeBtn.addEventListener('click', () => {
// mode sombre
if (toggleTheme === 0) { if (toggleTheme === 0) {
document.documentElement.style.setProperty('--color-scheme', 'dark')
document.documentElement.style.setProperty('--ecriture', '#f1f1f1'); document.documentElement.style.setProperty('--ecriture', '#f1f1f1');
document.documentElement.style.setProperty('--background', '#262626'); document.documentElement.style.setProperty('--background', '#262626');
document.cookie = "dark-mode=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/"; document.cookie = "dark-mode=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
toggleTheme--; toggleTheme--;
} else { }
// mode clairs
else {
document.documentElement.style.setProperty('--color-scheme', 'light')
document.documentElement.style.setProperty('--ecriture', '#262626'); document.documentElement.style.setProperty('--ecriture', '#262626');
document.documentElement.style.setProperty('--background', '#f1f1f1'); document.documentElement.style.setProperty('--background', '#f1f1f1');
document.cookie = "dark-mode=false; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/"; document.cookie = "dark-mode=false; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";

6
style.css
View File

@ -1,11 +1,13 @@
:root { :root {
--color-scheme : light;
--ecriture: black; --ecriture: black;
--background: white; --background: white;
--police: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; --police: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
} }
html { html {
color-scheme: dark !important; /* color-scheme: dark !important; */
color-scheme: var(--color-scheme);
background: var(--background); background: var(--background);
color: var(--ecriture); color: var(--ecriture);
font-size: 1.5rem; font-size: 1.5rem;
@ -53,7 +55,7 @@ input[type="text"] {
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
width: 300px; width: 300px;
border-color: rgb(62, 68, 70); border-color: var(--background);
} }
input[type="radio"] { input[type="radio"] {