zoe
/
hugo-battheme
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

icon formatting

This commit is contained in:
zoe 2022-04-10 21:57:17 +02:00
parent 8c62a099cc
commit 427d35661b
5 changed files with 45 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
assets/scss/font.scss
View File

@ -5,29 +5,34 @@ $medium: 16pt;
$small: 12pt; $small: 12pt;
@font-face { @font-face {
font-family: CaskaydiaCove; font-family: CaskaydiaCove;
src: url(/font/CaskaydiaCove.ttf); src: url(/font/CaskaydiaCove.ttf);
} }
@font-face { @font-face {
font-family: CaskaydiaCoveMono; font-family: CaskaydiaCoveMono;
src: url(/font/CaskaydiaCoveMono.ttf); src: url(/font/CaskaydiaCoveMono.ttf);
} }
* { * {
font-family: CaskaydiaCove; font-family: CaskaydiaCove;
font-size: $small; font-size: $small;
} }
h1 {font-size: $huge;}
h1 {
font-size: $huge;
}
a { a {
text-decoration: none; text-decoration: none;
} }
footer * { footer * {
font-size: $big; font-size: $large;
font-family: CaskaydiaCoveMono;
} }
label::after{ label::after {
font-family: CaskaydiaCoveMono; font-family: CaskaydiaCoveMono;
font-size: $big;
} }

25
assets/scss/layout.scss
View File

@ -5,8 +5,8 @@ body {
} }
footer { footer {
height: 10%; height: 6%;
min-height: 24pt; min-height: 42pt;
position: sticky; position: sticky;
display: flex; display: flex;
align-items: center; align-items: center;
@ -15,28 +15,37 @@ footer {
} }
#content { #content {
min-height: 90%; min-height: 94%;
right: auto; right: auto;
} }
#footer-left { #footer-left {
margin-top: auto;
margin-bottom: auto;
margin-left: 24pt; margin-left: 24pt;
justify-self: left; justify-self: left;
margin-right: auto; margin-right: auto;
display: inline-flex;
} }
#footer-right { #footer-right {
margin-top: auto;
margin-bottom: auto;
margin-left: auto; margin-left: auto;
justify-self: right; justify-self: right;
margin-right: 24pt; margin-right: 24pt;
align-content: center; align-content: center;
display: inline-flex;
} }
#footer-center { #footer-center {
margin-top: auto;
margin-bottom: auto;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
justify-content: center; justify-content: center;
justify-self: center; justify-self: center;
display: inline-flex;
} }
* { * {
@ -46,5 +55,15 @@ footer {
#footer-right *{ #footer-right *{
display: flex; display: flex;
margin-top: auto;
margin-bottom: auto;
}
#footer-center *{
display: flex;
margin-right: 8pt;
margin-left: 8pt;
margin-top: auto;
margin-bottom: auto;
} }

4
assets/scss/style.scss
View File

@ -6,7 +6,9 @@ input[type="checkbox"]{
cursor: pointer; cursor: pointer;
} }
.toggleinput{ .toggleinput{
visibility: hidden; opacity: 0;
max-height: 0;
overflow: hidden;
} }
.togglelabel{ .togglelabel{

4
layouts/partials/footer.html
View File

@ -9,8 +9,8 @@
</nav> </nav>
</span> </span>
<span id="footer-right"> <span id="footer-right">
<input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput"> <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput" aria-hidden="true">
<label class="togglelabel colorswitch" for="darkmode-toggle"></label> <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" tabindex=0 role="checkbox"></label>
</span> </span>
</footer> </footer>
<script src="/js/darkmode.js"></script> <script src="/js/darkmode.js"></script>

2
static/js/darkmode.js
View File

@ -8,7 +8,7 @@ if (localStorage.getItem("dark")) {
} }
checkbox.checked = localStorage.getItem("dark"); checkbox.checked = localStorage.getItem("dark");
checkbox.addEventListener("click", function () { checkbox.addEventListener("change", function () {
localStorage.setItem("dark", this.checked); localStorage.setItem("dark", this.checked);
if (this.checked) { if (this.checked) {
switchToDark(); switchToDark();