Sections, v0.0.2

This commit is contained in:
2025-06-14 21:57:30 +02:00
parent f7076a1073
commit 903bf5d3f5

View File

@@ -1,12 +1,12 @@
/** /**
* digui structure and theming * digui structure and theming
* v0.0.1 * v0.0.2
* *
* Created by: Michiel Scholten * Created by: Michiel Scholten
* Source: https://github.com/aquatix/digui * Source: https://github.com/aquatix/digui
*/ */
/* Main structure */ /** Colours and themes */
:root { :root {
--padding: .5rem; --padding: .5rem;
@@ -128,6 +128,8 @@ html[data-theme='silo'] {
display: none !important; display: none !important;
} }
/** Main structure */
body { body {
background: var(--background-color); background: var(--background-color);
color: var(--text-color); color: var(--text-color);
@@ -142,7 +144,6 @@ main {
padding-top: .5em; padding-top: .5em;
} }
/* Navigation */ /* Navigation */
header { header {
@@ -191,7 +192,7 @@ header li h1 {
border-bottom: 3px dotted #23B0FF; border-bottom: 3px dotted #23B0FF;
} }
/* Generic elements */ /** Generic elements */
/* https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/Heading_Elements#specifying_a_uniform_font_size_for_h1 */ /* https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/Heading_Elements#specifying_a_uniform_font_size_for_h1 */
h1 { h1 {
@@ -228,6 +229,7 @@ ol li::marker, ul li::marker {
} }
/* Buttons */ /* Buttons */
button, input, select, textarea { button, input, select, textarea {
border: var(--border-width) solid var(--border-color); border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius); border-radius: var(--border-radius);
@@ -291,6 +293,7 @@ button:focus {
} }
/* Cards */ /* Cards */
.cards { .cards {
display: grid; display: grid;
grid-column-gap: 1rem; grid-column-gap: 1rem;
@@ -385,7 +388,8 @@ button:focus {
} }
*/ */
/** Tags/chips */ /* Tags/chips */
.chip { .chip {
font-size: .8rem; font-size: .8rem;
border-radius: var(--border-radius); border-radius: var(--border-radius);
@@ -400,12 +404,14 @@ button:focus {
border-radius: var(--border-radius); border-radius: var(--border-radius);
} }
/** Status */ /* Status */
.error { .error {
color: var(--color-error); color: var(--color-error);
} }
/** Footer */
footer { footer {
/*background-color: var(--secondary-background-color);*/ /*background-color: var(--secondary-background-color);*/
margin-top: 1rem; margin-top: 1rem;