Add dark color-scheme for samples

This commit is contained in:
Simon Rozman 2025-03-03 14:23:31 +01:00
parent 72b6fb2d91
commit d558b38cd7
2 changed files with 30 additions and 2 deletions

View File

@ -1,3 +1,14 @@
body {
color: #000;
background-color: #eee;
}
input, textarea {
color: #000;
background-color: #f5f5f5;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.my-block { .my-block {
max-width: 500px; max-width: 500px;
margin: 0 auto; margin: 0 auto;
@ -52,3 +63,22 @@
.bes-status-icon.bes-status-mistakes { .bes-status-icon.bes-status-mistakes {
background-image: url('images/mistake-svgrepo-com.svg'); background-image: url('images/mistake-svgrepo-com.svg');
} }
@media (prefers-color-scheme: dark) {
body {
color: #eee;
background-color: #444;
font-weight: bolder;
}
input, textarea {
color: #eee;
background-color: #222;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
.my-control {
background-color: #222;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
}

View File

@ -1,5 +1,3 @@
/* TODO: Dark mode theme */
/* Mistake types styles */ /* Mistake types styles */
.bes-spelling-mistake { .bes-spelling-mistake {
border-bottom: 2px solid #ff7300; border-bottom: 2px solid #ff7300;