Add styles for .tile-menu
This is currently used for the "submit" page, but hey, maybe we'll end up using it elsewhere too since it's now so convenient to implement.
This commit is contained in:
parent
91893bcac5
commit
69b42a05bc
3 changed files with 44 additions and 2 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -95,6 +95,48 @@ body {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
/* 3. Special Templates
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
/* 3.1 Tile Menu
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.tile-menu {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(16em, 1fr));
|
||||
grid-gap: 1em;
|
||||
grid-auto-rows: minmax(20rem, auto);
|
||||
color: var(--color-darkgrey);
|
||||
}
|
||||
|
||||
.tile-menu .tile {
|
||||
display:block;
|
||||
border: 1px solid var(--color-lightgrey);
|
||||
padding: 2rem;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.tile-menu .tile p {
|
||||
font-size: 1em;
|
||||
line-height: 1.2em;
|
||||
font-family: var(--font-sans);
|
||||
}
|
||||
|
||||
.tile-menu .tile h2 {
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
font-family: var(--font-heading);
|
||||
}
|
||||
|
||||
html.dark-mode .tile-menu {
|
||||
color: var(--color-lightgrey);
|
||||
}
|
||||
|
||||
html.dark-mode .tile-menu .tile {
|
||||
border-color: var(--color-darkgrey);
|
||||
}
|
||||
|
||||
/* 4. Site Header
|
||||
/* ---------------------------------------------------------- */
|
||||
|
|
Loading…
Reference in a new issue