Linux-101/css/theme.css

73 lines
1.3 KiB
CSS
Raw Normal View History

2019-03-09 16:46:03 +00:00
@import "../node_modules/deck3000/dist/deck3000.css";
2019-03-11 19:31:11 +00:00
:root {
--accent-main: #FE6431;
--bg-dark: #323232;
--bg-light: white;
}
html, body { font-size: 175%; }
body {
font-family: sans-serif;
}
article {
width: 100vw !important; height: 100vh !important;
display: flex;
flex-direction: column;
box-sizing: border-box;
}
article.title {
2019-03-14 17:17:36 +00:00
background: url(images/freeside.svg) no-repeat center 4em / 9em;
2019-03-11 19:31:11 +00:00
}
article:not(.title) {
align-items: center;
2019-03-11 20:31:58 +00:00
padding: 0.75em 3em;
2019-03-11 19:31:11 +00:00
background: content-box url("./images/freeside.svg") bottom right / 15% no-repeat;
}
2019-03-14 17:14:23 +00:00
h1, h2, h3, h4, h5, h6 {
2019-03-11 19:31:11 +00:00
color: var(--accent-main);
text-align: center;
margin: 0.5em 0;
}
h1 {
2019-03-14 17:13:29 +00:00
margin: 0; padding: 0.5em 0;
background: var(--bg-dark);
font-size: 150%;
}
h2 { font-size: 125%; margin: 0.1em 0; }
2019-03-11 19:31:11 +00:00
p:first-of-type { margin: 0; }
2019-03-11 20:20:12 +00:00
small { font-size: 50%; }
2019-03-11 19:31:11 +00:00
img {
box-sizing: border-box;
padding: 0.25em;
max-width: fit-content;
max-height: fit-content;
2019-03-11 19:31:11 +00:00
}
.bg-light { background: var(--bg-light); }
.centre-content { text-align: center; }
2019-03-11 20:20:12 +00:00
.flex { display: flex; }
.flex.horizontal { flex-direction: row; }
.flex.vertical { flex-direction: column; }
2019-03-11 19:31:11 +00:00
.flex-1 { flex: 1; }
.flex-2 { flex: 2; }
.flex-3 { flex: 3; }
.flex-4 { flex: 4; }
.flex-5 { flex: 5; }
.flex-6 { flex: 6; }
2019-03-31 13:01:15 +00:00
.flex-align-centre { align-items: center; }
2019-03-14 15:46:28 +00:00
2019-03-14 15:50:57 +00:00
.image-container {
2019-03-14 15:46:28 +00:00
max-height: 100%;
max-width: 100%;
}