drath/drath.cc
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
Drath
2023-06-28 20:16:39 +02:00
commit 7eeb201f1f
26 changed files with 627 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
app/static/styles/downloads.css Normal file
View File

@@ -0,0 +1,15 @@
body {
max-width: 60rem !important;
}
a {
font-variation-settings: 'wght' 400 !important;
}
table {
width: 100%;
text-align: left;
font-size: 1.05rem;
line-height: 160%;
padding: 0.6rem 1.2rem;
}

20
app/static/styles/fonts.css Normal file
View File

@@ -0,0 +1,20 @@
@font-face {
font-family: 'dejavu_serifbold';
src: url('DejaVuSerif-Bold-webfont.woff') format('woff');
}
@font-face {
font-family: 'dejavu_serif';
src: url('DejaVuSerif-webfont.woff') format('woff');
}
@font-face {
font-family: 'Cantarell vf';
font-weight: 100 900;
font-display: swap;
font-style: normal;
font-named-instance: 'Regular';
src: url('/static/fonts/Cantarell-VF.woff2') format('woff2'),
url('/static/fonts/Cantarell-VF.otf') format('opentype');
}

51
app/static/styles/gnomecolors.css Normal file
View File

@@ -0,0 +1,51 @@
:root {
--rounded-corner: 12px;
--gnomeblue: #1c71d8;
--blue1: rgb(153,193,241);
--blue2: rgb(98,160,234);
--blue3: rgb(53,132,228);
--blue4: rgb(28,113,216);
--blue5: rgb(26,95,180);
--green1: rgb(143,240,164);
--green2: rgb(87,227,137);
--green3: rgb(51,209,122);
--green4: rgb(46,194,126);
--green5: rgb(38,162,105);
--yellow1: rgb(249,240,107);
--yellow2: rgb(248,228,92);
--yellow3: rgb(246,211,45);
--yellow4: rgb(245,194,17);
--yellow5: rgb(229,165,10);
--orange1: rgb(255,190,111);
--orange2: rgb(255,163,72);
--orange3: rgb(255,120,0);
--orange4: rgb(230,97,0);
--orange5: rgb(198,70,0);
--red1: rgb(246,97,81);
--red2: rgb(237,51,59);
--red3: rgb(224,27,36);
--red4: rgb(192,28,40);
--red5: rgb(165,29,45);
--purple1: rgb(220,138,221);
--purple2: rgb(192,97,203);
--purple3: rgb(145,65,172);
--purple4: rgb(129,61,156);
--purple5: rgb(97,53,131);
--brown1: rgb(205,171,143);
--brown2: rgb(181,131,90);
--brown3: rgb(152,106,68);
--brown4: rgb(134,94,60);
--brown5: rgb(99,69,44);
--light1: rgb(255,255,255);
--light2: rgb(246,245,244);
--light3: rgb(222,221,218);
--light4: rgb(192,191,188);
--light5: rgb(154,153,150);
--dark1: rgb(119,118,123);
--dark2: rgb(94,92,100);
--dark3: rgb(61,56,70);
--dark4: rgb(36,31,49);
--dark5: rgb(0,0,0);
--text: #f6f5f4;
--maxwidth: 56rem;
}

102
app/static/styles/style.css Normal file
View File

@@ -0,0 +1,102 @@
:root {
--rounded-corner: 12px;
--shade: 220;
}
body {
color: hsl(var(--root-hue),80%,20%);
background-color: hsl(var(--root-hue),15%,90%);
font-size: 18px;
max-width: 40rem;
font: 1.2rem/1.6 'Cantarell vf', 'Cantarell', sans-serif;
padding: 1.5rem 1.1rem;
margin: 1rem auto;
}
header {
color: hsl(var(--root-hue),100%,20%);
}
a {
color: hsl(var(--root-hue),50%,35%);
text-decoration: none;
font-variation-settings: 'wght' 400;
transition: font-variation-settings 200ms, color 150ms;
}
a:hover {
color: hsl(var(--root-hue),75%,50%);
text-decoration: underline;
font-variation-settings: 'wght' 650;
}
@media (prefers-color-scheme: dark) {
body {
color: hsl(var(--root-hue),40%,85%);
background-color: hsl(var(--root-hue),8%,15%);
}
header {
color: hsl(var(--root-hue),90%,90%);
}
a {
color: hsl(var(--root-hue),30%,60%) !important;
}
a:hover {
color: hsl(var(--root-hue),70%,80%) !important;
}
}
h1 {
font-variation-settings: 'wght' 900;
font-size: 2rem;
line-height: 1.2;
}
section, aside, footer {
margin: 1.5rem auto;
}
img {
margin: 1.5rem auto;
}
@keyframes annoyingAnimation {
/* 0% { font-variation-settings: 'wght' 400; } */
50% {
font-variation-settings: 'wght' 650;
color: hsl(var(--root-hue),75%,50%);
}
100% {
font-variation-settings: 'wght' 400;
color: hsl(var(--root-hue),70%,35%);
}
}
.animate {
font-size: 1.4rem;
font-variation-settings: 'wght' 400;
animation: annoyingAnimation 1s linear infinite;
}
.center {
text-align: center;
}
.rounded {
border-radius: var(--rounded-corner);
}
.largeShadow {
--xTrans: 0px;
--yTrans: 7px;
--radius: 20px;
--spread: 3px;
--alpha: 0.3;
-webkit-box-shadow: var(--xTrans) var(--yTrans) var(--radius) var(--spread) hsla(var(--root-hue),35%,30%,var(--alpha));
-moz-box-shadow: var(--xTrans) var(--yTrans) var(--radius) var(--spread) hsla(var(--root-hue),35%,30%,var(--alpha));
box-shadow: var(--xTrans) var(--yTrans) var(--radius) var(--spread) hsla(var(--root-hue),35%,30%,var(--alpha));
}

47
app/static/styles/test.css Normal file
View File

@@ -0,0 +1,47 @@
@import url("../resources/gnomecolors.css");
.button {
display: inline-block;
padding: 10px 20px;
font-size: 1.5rem;
font-variation-settings: 'wght' 420; /* heheh */
color: rgba(0,0,0,0.75);
border-radius: var(--rounded-corner);
background-color: rgba(255, 255, 255, 0.4);
border: solid rgba(0, 0, 0, 0.75);
border-width: 2px;
-webkit-backdrop-filter: blur(15px) saturate(1.4) contrast(1.3);
backdrop-filter: blur(15px) saturate(1.4) contrast(1.3);
-webkit-box-shadow: 0px 5px 15px 2px rgba(0,0,0,0.4);
box-shadow: 0px 5px 15px 2px rgba(0,0,0,0.4);
transition: font-variation-settings 150ms, border-width 150ms;
}
@media (prefers-color-scheme: dark) {
.button {
color: rgba(255,255,255,0.75);
background-color: rgba(0, 0, 0, 0.4);
border: solid rgba(255, 255, 255, 0.75);
}
}
.button:hover {
border-width: 4px;
font-variation-settings: 'wght' 700;
}
.container {
position: relative;
text-align: center;
}
.contCenter {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}