make theme look more modern

This commit is contained in:
zoe 2022-04-12 23:13:28 +02:00
parent 618d5e639f
commit 3888d39a01
3 changed files with 119 additions and 33 deletions

View File

@ -9,3 +9,5 @@ sectionPagesMenu = "main"
identifier = "home" identifier = "home"
name = '' name = ''
url = '/' url = '/'
title = 'home'

View File

@ -1,15 +1,15 @@
@charset "UTF-8"; @charset "UTF-8";
body { body {
background-color: #4b3d44; background-color: #27234c;
color: #d2c9a5; color: #e88dc3;
transition: 1s; } transition: 1s; }
body.light { body.light {
background-color: #d2c9a5; background-color: #d2c9a5;
color: #4b3d44; } color: #4b3d44; }
a { a {
background-color: #c77b58; background-color: #f2504b;
color: #4b3d44; color: #27234c;
transition: 1s; } transition: 1s; }
a.light { a.light {
background-color: #79444a; background-color: #79444a;
@ -17,9 +17,9 @@ a {
a.footer-nav-item.active, a.footer-nav-item.active,
a.footer-nav-item:hover { a.footer-nav-item:hover {
color: #8caba1; color: #f2504b;
background-color: #4b3d44; background-color: #27234c;
border-color: #4b3d44; border-color: #27234c;
transition: 0.24s; } transition: 0.24s; }
a.footer-nav-item.active.light, a.footer-nav-item.active.light,
a.footer-nav-item:hover.light { a.footer-nav-item:hover.light {
@ -28,24 +28,24 @@ a.footer-nav-item:hover {
border-color: #d2c9a5; } border-color: #d2c9a5; }
footer { footer {
background-color: #8caba1; background-color: #f2504b;
color: #4b3d44; color: #27234c;
transition: 1s; } transition: 1s; }
footer.light { footer.light {
background-color: #4b726e; background-color: #4b726e;
color: #d2c9a5; } color: #d2c9a5; }
footer a { footer a {
color: #4b3d44; color: #27234c;
background-color: #8caba1; background-color: #f2504b;
transition: 1s; } transition: 1s; }
footer a.light { footer a.light {
color: #d2c9a5; color: #d2c9a5;
background-color: #4b726e; } background-color: #4b726e; }
.togglelabel { .togglelabel {
background-color: #8caba1; background-color: #f2504b;
border-color: #4b3d44; border-color: #27234c;
transition: 1s; } transition: 1s; }
.togglelabel.light { .togglelabel.light {
background-color: #4b726e; background-color: #4b726e;
@ -57,8 +57,8 @@ footer a {
transition: 1s; } transition: 1s; }
.togglelabel::after { .togglelabel::after {
background-color: #4b3d44; background-color: #27234c;
color: #8caba1; color: #f2504b;
transition: 1s; } transition: 1s; }
body.light #title { body.light #title {
@ -67,26 +67,72 @@ body.light #title {
transition: 1s; } transition: 1s; }
body #title { body #title {
color: #4b3d44; color: #27234c;
background-color: #8caba1; background-color: #f2504b;
transition: 1s; } transition: 1s; }
article { article {
background-color: #4b3d44; background-color: #27234c;
border-color: #8caba1; } border-color: #f2504b;
transition: 1s; }
article.light { article.light {
background-color: #d2c9a5; background-color: #d2c9a5;
border-color: #4b726e; } border-color: #4b726e; }
article h2, article h2 {
article h3 { background-color: #b296ff;
background-color: #8caba1; color: #27234c;
color: #4b3d44; } transition: 1s; }
article h3 {
background-color: #39b8a3;
color: #27234c;
transition: 1s; }
article.light h2,
article.light h3 { article.light h3 {
background-color: #4b726e; background-color: #733c7c;
color: #d2c9a5; } color: #d2c9a5;
transition: 1s; }
article h4 {
background-color: #dde4ff;
color: #27234c;
transition: 1s; }
article.light h4 {
background-color: #007582;
color: #d2c9a5;
transition: 1s; }
article.light h2 {
background-color: #225091;
color: #d2c9a5;
transition: 1s; }
article h5,
article h6,
article a {
background-color: #f2504b;
color: #27234c;
transition: 1s; }
article.light h5,
article.light h6,
article.light a {
background-color: #79444a;
color: #d2c9a5;
transition: 1s; }
a:hover {
color: #f2504b;
background-color: transparent; }
a:hover.light {
color: #79444a;
background-color: transparent; }
article.light a:hover {
color: #79444a;
background-color: transparent; }
html, html,
body { body {
@ -104,13 +150,14 @@ footer {
#content { #content {
min-height: calc(100% - 42pt * 3); min-height: calc(100% - 42pt * 3);
right: auto; right: auto;
padding-bottom: 84pt; } margin-bottom: 84pt; }
#content p, #content p,
#content ul, #content ul,
#content ol, #content ol,
#content table { #content table {
padding-inline: 4em; } margin-right: 24%;
margin-left: 24%; }
#footer-left { #footer-left {
margin-top: auto; margin-top: auto;
@ -156,13 +203,35 @@ footer {
justify-content: center; justify-content: center;
align-items: center; } align-items: center; }
h2, h3, h4, h5, h6 { h1,
margin-top: 1em; } h2,
h3,
h4,
h5,
h6 {
padding-right: 6%;
padding-top: 12pt;
padding-bottom: 12pt;
margin-right: 6%;
justify-content: right;
display: flex;
align-items: center; }
h2,
h3,
h4,
h5,
h6 {
margin-top: 1em;
margin-bottom: 1em; }
article { article {
margin-top: 42pt;
margin-inline: auto; } margin-inline: auto; }
.titlecontainer {
width: 100%;
padding-top: 42pt; }
@font-face { @font-face {
font-family: CaskaydiaCove; font-family: CaskaydiaCove;
src: url(/font/CaskaydiaCove.ttf); } src: url(/font/CaskaydiaCove.ttf); }
@ -199,6 +268,9 @@ label::after {
font-family: CaskaydiaCoveMono; font-family: CaskaydiaCoveMono;
font-size: 24pt; } font-size: 24pt; }
h6 {
font-style: italic; }
* { * {
border-width: 2pt; } border-width: 2pt; }
@ -213,7 +285,7 @@ input[type="checkbox"] {
.togglelabel { .togglelabel {
width: 42pt; width: 42pt;
height: 24pt; height: 24pt;
border-radius: 24pt; border-radius: 48pt;
cursor: pointer; cursor: pointer;
align-items: center; align-items: center;
display: flex; } display: flex; }
@ -252,3 +324,15 @@ input:checked + label::after {
.togglelabel { .togglelabel {
border: solid; } border: solid; }
h1, h2, h3, h4, h5, h6 {
border-top-right-radius: 48pt;
border-bottom-right-radius: 48pt; }
#content p,
#content ul,
#content ol,
#content table {
border-left-style: solid;
border-width: 0.24em;
padding-left: 2em; }

@ -1 +1 @@
Subproject commit f62a00c10fd2690c3cc6f9792a382d8a7438484c Subproject commit 7e8352b90ea5dd1b22e0d7ac014698cb09933383