added theming for the Hope Dice toggle and labels

This commit is contained in:
CPTN Cosmo 2025-05-10 18:57:41 +02:00
parent 351b6911d1
commit ce5f914c1a

View file

@ -33,6 +33,7 @@ h1 {
.field-title { .field-title {
font-size: 1rem; font-size: 1rem;
color: #e7c74b; color: #e7c74b;
font-weight: bold;
} }
input[type="number"], input[type="number"],
@ -89,3 +90,26 @@ select:-moz-focusring {
color: transparent; color: transparent;
text-shadow: 0 0 0 #ffffff; text-shadow: 0 0 0 #ffffff;
} }
/* Modern checkbox styling */
.modern-checkbox {
appearance: none;
width: 1.5em;
height: 1.5em;
border: 2px solid #555;
border-radius: 4px;
background-color: #fff;
cursor: pointer;
display: inline-block;
vertical-align: middle;
margin-left: 0.5em;
}
.modern-checkbox:checked {
background-color: #4caf50;
border-color: #4caf50;
background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M20.285 6.708a1 1 0 0 0-1.414-1.416l-9.192 9.193-4.243-4.243a1 1 0 0 0-1.414 1.414l5 5a1 1 0 0 0 1.414 0l10-10z"/></svg>');
background-repeat: no-repeat;
background-position: center;
background-size: 1em;
}