jonnybarnes.uk/public/assets/app.css

140 lines
No EOL
3 KiB
CSS
Vendored

:root {
/* fonts */
--font-stack-body: "Whitney SSm A", "Whitney SSm B", sans-serif;
--font-stack-headings: "Quarto A", "Quarto B", serif;
--font-stack-monospace: "Operator Mono SSm A", "Operator Mono SSm B", monospace;
/* colours */
--color-background: #004643;
--color-headline: #fffffe;
--color-paragraph: #abd1c6;
--color-button: #f9bc60;
--color-button-text: #001e1d;
/* colours - illustrations */
--color-stroke: #001e1d;
--color-main: #e8e4e6;
--color-highlight: #f9bc60;
--color-secondary: #abd1c6;
--color-tertiary: #e16162; }
body {
font-family: var(--font-stack-body);
font-style: normal;
font-weight: 400;
font-size: 2rem;
background-color: var(--color-background);
color: var(--color-paragraph); }
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--font-stack-headings);
font-style: normal;
font-weight: 800; }
pre,
code {
font-family: var(--font-stack-monospace);
font-style: normal;
font-weight: 400; }
a {
color: var(--color-highlight);
text-decoration: none; }
.h-feed > .note,
.h-feed > .h-entry {
margin-top: 4rem; }
body {
display: flex;
flex-direction: column; }
#top-header {
display: flex;
flex-direction: column;
justify-content: center; }
#top-header h1 {
width: 100%;
text-align: center; }
#top-header nav {
display: flex;
justify-content: center;
flex-wrap: wrap; }
#top-header nav a {
margin: 0 0.5rem; }
@media screen and (max-width: 699px) {
main {
margin-left: 5px;
margin-right: 5px; } }
main .h-feed {
display: flex;
flex-direction: column;
margin: auto; }
main .h-feed img {
max-width: 100%; }
@media screen and (min-width: 700px) {
main .h-feed {
max-width: 700px; }
main .h-feed > .note,
main .h-feed > .h-entry {
padding: 0 1rem; } }
main .h-feed .h-entry:first-child > .bookmark-link {
padding-top: 2rem; }
.note {
display: flex;
flex-direction: column; }
.note .note-metadata {
display: flex;
flex-direction: row;
justify-content: space-between; }
.note .note-metadata .client {
word-break: break-all; }
.note .note-metadata .syndication-links svg {
height: 1em;
width: 1em; }
.note > .e-content > .naked-link .u-photo {
margin: 2rem 0; }
.pagination {
display: flex;
flex-direction: row;
justify-content: space-evenly;
width: 90vw;
list-style-type: none; }
.personal-bio {
padding: 0 2rem; }
footer {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 1.5rem; }
@media screen and (max-width: 699px) {
footer input {
max-width: 95vw; } }
footer .iwc-logo {
max-width: 100%; }
@media screen and (max-width: 699px) {
footer {
margin-left: 5px;
margin-right: 5px; } }
.post-info a {
text-decoration: none; }
.syndication-links .u-syndication {
text-decoration: none; }
.p-bridgy-facebook-content,
.p-bridgy-twitter-content {
display: none; }
/*# sourceMappingURL=app.css.map*/