fix dark mod

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

View File

@ -4,7 +4,7 @@
<head>
<title>Manuel</title>
<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> -->
</head>
@ -13,7 +13,7 @@
<div id="firstbutton">
<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>
@ -79,8 +79,8 @@
</div>
<div id="img">
<img id="myimg1" src="img/404.png">
<img id="myimg2" src="img/404.png">
<img id="myimg1" src="assets/img/404.png">
<img id="myimg2" src="assets/img/404.png">
</div>
<div>
@ -282,10 +282,12 @@
// cookie pour le mode sombre
function checkCookie() {
if (darkMode == "true") {
document.documentElement.style.setProperty('--color-scheme', 'dark')
document.documentElement.style.setProperty('--ecriture', '#f1f1f1');
document.documentElement.style.setProperty('--background', '#262626');
toggleTheme--;
} else if (darkMode == "false") {
document.documentElement.style.setProperty('--color-scheme', 'light')
document.documentElement.style.setProperty('--ecriture', '#262626');
document.documentElement.style.setProperty('--background', '#f1f1f1');
}
@ -294,12 +296,18 @@
// mode sombre
const switchThemeBtn = document.querySelector('.changeTheme')
switchThemeBtn.addEventListener('click', () => {
// mode sombre
if (toggleTheme === 0) {
document.documentElement.style.setProperty('--color-scheme', 'dark')
document.documentElement.style.setProperty('--ecriture', '#f1f1f1');
document.documentElement.style.setProperty('--background', '#262626');
document.cookie = "dark-mode=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
toggleTheme--;
} else {
}
// mode clairs
else {
document.documentElement.style.setProperty('--color-scheme', 'light')
document.documentElement.style.setProperty('--ecriture', '#262626');
document.documentElement.style.setProperty('--background', '#f1f1f1');
document.cookie = "dark-mode=false; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";

View File

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