57 lines
802 B
CSS
57 lines
802 B
CSS
/* https://stackoverflow.com/a/40244401/15436737 */
|
|
|
|
/* Title */
|
|
h1 {
|
|
margin: 0;
|
|
}
|
|
|
|
h1 + p {
|
|
margin: 8px;
|
|
}
|
|
|
|
/* List */
|
|
main ul {
|
|
column-count: 2;
|
|
column-gap: 5em;
|
|
}
|
|
|
|
main li {
|
|
break-inside: avoid-column;
|
|
}
|
|
|
|
main li > p {
|
|
margin: 0;
|
|
padding: 3%;
|
|
}
|
|
|
|
/* breakpoint */
|
|
@media only screen and (max-width: 640px) {
|
|
main ul {
|
|
column-count: 1;
|
|
}
|
|
}
|
|
|
|
/* Links */
|
|
main a {
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
color: color-mix(in srgb, var(--font-color) 30%, var(--link-color));
|
|
}
|
|
|
|
main a:after {
|
|
display: block;
|
|
content: "";
|
|
border-bottom: solid 3px;
|
|
transform: scaleX(0);
|
|
transition: transform 250ms ease-in-out;
|
|
transform-origin: 100% 50%;
|
|
}
|
|
|
|
main a:hover:after {
|
|
transform: scaleX(1);
|
|
transform-origin: 0 50%;
|
|
}
|
|
|
|
main a:hover {
|
|
text-decoration: none;
|
|
}
|