abtmtr-v13/assets/elements.css
2024-09-01 16:28:26 -05:00

159 lines
No EOL
2.7 KiB
CSS

h1, h2, h3, h4, h5, h6, p, li, br {
font-weight: normal;
margin: 0;
/* text-shadow: 1px 1px 0 var(--color-text-shadow); */
line-height: 1.5rem;
}
h1, h2, h3, h4, h5, h6 {
margin-block: 1.5rem;
padding-inline: 1ch;
font-size: 1rem;
background-color: var(--color-text);
color: var(--color-bg);
}
h3, h4, h5, h6 {
margin-block: 0;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
display: block;
margin-inline: -1ch;
padding-inline: 1ch;
background-color: var(--color-accent);
color: var(--color-bg);
}
a.noblock {
display: inline;
margin-inline: 0;
padding-block: 0.25rem;
}
p {
margin-inline: 2ch;
margin-block: 1.5rem;
}
p.nomargin {
margin-block: unset;
}
ul {
margin: 0;
padding-inline-start: 4ch;
list-style-type: "- ";
}
ul li {
margin-block: 1.5rem;
}
details > summary {
list-style-type: '► ';
}
details[open] > summary {
list-style-type: '▼ ';
}
summary > h1, summary > h2, summary > h3, summary > h4, summary > h5, summary > h6 {
display: inline-block;
}
section {
margin-block: 1.5em;
margin-inline-start: 2ch;
}
img {
vertical-align: middle;
background-color: #fff8;
}
a {
color: var(--color-accent);
text-decoration: underline solid currentColor 1px;
}
code {
display: inline-block;
max-width: 100%;
box-sizing: border-box;
font: inherit;
background-color: var(--color-code);
padding-inline: 1ch;
color: var(--color-code-text);
user-select: all;
word-break: break-word;
overflow: auto;
vertical-align: top;
}
button, input, textarea, select {
border: none;
background: transparent;
color: inherit;
font: inherit;
padding: 0;
line-height: 1.5rem;
resize: none;
}
select {
height: 1.5rem;
}
:focus {
outline: 1ch solid var(--color-text);
}
input[type=text], input[type=url], textarea, select {
padding-inline: 1ch;
border-inline: 1ch solid var(--color-accent);
background-color: var(--color-bg-scrim);
}
button, input[type=submit] {
padding-inline: 1ch;
background-color: var(--color-accent);
color: var(--color-bg);
cursor: pointer;
}
button:active, input[type=submit]:active {
background-color: transparent;
color: var(--color-accent);
}
marquee {
vertical-align: top;
}
.clearfix:after {
content: "";
display: table;
clear: both;
}
progress {
border: none;
border-radius: 0;
border-inline: 1ch solid var(--color-text);
background-color: var(--color-bg-scrim);
height: 1.5rem;
vertical-align: top;
}
progress::-webkit-progress-bar {
border: none;
border-radius: 0;
border-inline: 1ch solid var(--color-text);
background-color: var(--color-bg-scrim);
}
progress::-webkit-progress-value {
background-color: var(--color-accent);
}
progress::-moz-progress-bar {
background-color: var(--color-accent);
}