Create initial theme
All checks were successful
continuous-integration/laminar-elessar Build 71 succeeded in 42 seconds .
All checks were successful
continuous-integration/laminar-elessar Build 71 succeeded in 42 seconds .
This commit is contained in:
parent
fd7a215c96
commit
380a8d0aae
2 changed files with 66 additions and 2 deletions
|
@ -1 +1,55 @@
|
||||||
@import "../node_modules/deck3000/dist/deck3000.css";
|
@import "../node_modules/deck3000/dist/deck3000.css";
|
||||||
|
|
||||||
|
: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 {
|
||||||
|
background: var(--bg-dark);
|
||||||
|
color: var(--bg-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
article:not(.title) {
|
||||||
|
padding: 1em 3em;
|
||||||
|
|
||||||
|
background: content-box url("./images/freeside.svg") bottom right / 15% no-repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3 {
|
||||||
|
color: var(--accent-main);
|
||||||
|
text-align: center;
|
||||||
|
margin: 0.5em 0;
|
||||||
|
}
|
||||||
|
h1 { font-size: 150%; }
|
||||||
|
h2 { font-size: 125%; margin-top: 0.1em; }
|
||||||
|
|
||||||
|
p:first-of-type { margin: 0; }
|
||||||
|
|
||||||
|
img {
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-light { background: var(--bg-light); }
|
||||||
|
|
||||||
|
.centre-content { text-align: center; }
|
||||||
|
|
||||||
|
.flex-1 { flex: 1; }
|
||||||
|
.flex-2 { flex: 2; }
|
||||||
|
.flex-3 { flex: 3; }
|
||||||
|
.flex-4 { flex: 4; }
|
||||||
|
.flex-5 { flex: 5; }
|
||||||
|
.flex-6 { flex: 6; }
|
||||||
|
|
14
index.html
14
index.html
|
@ -7,9 +7,19 @@
|
||||||
<body>
|
<body>
|
||||||
<main class="js-deck3000">
|
<main class="js-deck3000">
|
||||||
<section>
|
<section>
|
||||||
|
<article class="title">
|
||||||
|
<h1 class="flex-1">Linux 101</h1>
|
||||||
|
<div class="flex-1 bg-light centre-content">
|
||||||
|
<img style="max-height: 100%;" src="./images/freeside.svg" alt="" />
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
<article>
|
<article>
|
||||||
<h1>Linux 101</h1>
|
<h2>Test Content</h2>
|
||||||
<h2><img src="./images/freeside.svg" alt=""></h2>
|
<ul>
|
||||||
|
<li>a</li>
|
||||||
|
<li>b</li>
|
||||||
|
<li>c</li>
|
||||||
|
</ul>
|
||||||
</article>
|
</article>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
Loading…
Reference in a new issue