Styl checkboxów

2026-05-03 05:28:13 +00:00 · 2022-11-17 21:11:38 +01:00
parent 2119399c45
commit e8574efa42
3 changed files with 43 additions and 7 deletions
@@ -143,3 +143,40 @@ ul {
    overflow: auto;
  }
 }
+
+// Checkbox
+label.g-checkbox {
+  display: inline-block;
+  margin: 0.25em 0;
+  cursor: pointer;
+  color: #aaa;
+
+  span::before {
+    content: '';
+    display: inline-block;
+    width: 1ch;
+    height: 1ch;
+
+    background-color: #aaa;
+    border-radius: 50%;
+    margin-right: 0.25em;
+  }
+
+  input {
+    width: 0;
+    opacity: 0;
+
+    &:focus-visible + span {
+      text-decoration: underline;
+    }
+
+    &:checked + span {
+      color: greenyellow;
+
+      &::before {
+        background-color: greenyellow;
+      }
+    }
+  }
+}
+