trwnh.com/unified.test.hugo/assets/styles/common/elements.scss

70 lines
1.4 KiB
SCSS
Raw Permalink Normal View History

/* render <kbd> with slight depth */
@supports #{'selector\(:has(kbd))'} {
/* style individual keys only (for the innermost <kbd> element) */
kbd kbd,
kbd:not(:has(kbd)) {
font-family: monospace;
padding: 0.25em;
background: var(--ui-overlay);
color: var(--ui-overlay-text);
border: 1px solid var(--primary-accent-transparent);
margin-inline: 0.25em;
}
}
@supports not #{'selector\(:has(kbd))'} {
/* style the entire key sequence */
kbd {
font-family: monospace;
padding: 0.25em;
background: var(--ui-overlay);
color: var(--ui-overlay-text);
}
/* and prevent double-styling for nested keys */
kbd kbd {
background: none;
}
}
/* render <mark> as highlighting */
mark {
background: var(--primary-accent-transparent);
color: var(--ui-text);
--pad-x-highlight: 0.125em;
padding-inline-start: var(--pad-x-highlight);
padding-inline-end: var(--pad-x-highlight);
}
/* lists */
ul {list-style: disc;}
ol {list-style: decimal;}
/* tables */
table {text-align: center;}
thead {
font-weight: bold;
background: var(--ui-overlay);
color: var(--ui-overlay-text);
}
th, td {
border: 1px solid var(--ui-text);
padding: 0.5em;
}
/* figures */
figure {
margin: 0;
}
figcaption {
padding-block: 1em;
padding-inline: 1em;
}
/* extra style and flair */
code {
background: var(--ui-overlay);
color: var(--ui-overlay-text);
padding: 0.25rem;
}
/* fix pre */
pre {
margin: 0;
2024-10-16 07:43:37 +00:00
}
/* limit img to page width */
img {
2024-10-18 07:33:33 +00:00
max-inline-size: 100%;
}