delta/kitsu-site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactored common css

Browse source
This commit is contained in:
Vivi 2024-02-05 23:01:41 -05:00
parent e5f437218d
commit 7a623fdb24
3 changed files with 42 additions and 71 deletions
Download patch file Download diff file Expand all files Collapse all files

36
index.html
View file

@ -1,46 +1,12 @@
<!doctype html> <!doctype html>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>kitsu love</title> <title>kitsu love</title>
<link rel="stylesheet" href="/main.css"/>
<style> <style>
:root {
--l0-bg: #18191a;
--l1-bg: #391145;
--l2-br: #a73590;
--l3-bg: #96234e;
--l3-tx: #d74a7f;
--l4-bg: #714d87;
--l4-tx: #9c74b6;
--l5-tx: #e4c6c6;
--gr-bg: #9e6d22;
--gr-tx: #D29442;
}
body {
background-color: var(--l0-bg);
color: var(--l5-tx);
margin: 0;
padding: 0;
}
.text { .text {
font-weight: bold; font-weight: bold;
color: var(--l3-tx); color: var(--l3-tx);
} }
main {
width: fit-content;
margin: 2em;
border: 2px solid #988;
padding: 1.5em;
line-height: 1.4;
border-radius: 5px 25px 25px 25px;
position: relative;
z-index: 1;
box-shadow: 2px 4px 0 0 var(--gr-bg), 4px 2px 0 0 var(--gr-bg), 4px 4px 0 0 var(--gr-bg),
4px 9px 0 0 var(--l4-bg), 9px 4px 0 0 var(--l4-bg), 9px 9px 0 0 var(--l4-bg),
6px 14px 0 0 var(--l3-bg), 14px 6px 0 0 var(--l3-bg), 14px 14px 0 0 var(--l3-bg);
}
</style> </style>
<main> <main>
<div> <div>

38
main.css Normal file
View file

@ -0,0 +1,38 @@
:root {
--l0-bg: #18191a;
--l1-bg: #391145;
--l2-br: #a73590;
--l3-bg: #96234e;
--l3-tx: #d74a7f;
--l4-bg: #714d87;
--l4-tx: #9c74b6;
--l5-tx: #e4c6c6;
--gr-bg: #9e6d22;
--gr-tx: #D29442;
}
html {
margin: 0;
padding: 0;
background-color: var(--l0-bg);
}
body {
color: var(--l5-tx);
margin: 0;
padding: 0;
}
main {
width: fit-content;
margin: 2em;
border: 2px solid #988;
padding: 1.5em;
line-height: 1.4;
border-radius: 5px 25px 25px 25px;
position: relative;
z-index: 1;
box-shadow: 2px 4px 0 0 var(--gr-bg), 4px 2px 0 0 var(--gr-bg), 4px 4px 0 0 var(--gr-bg),
4px 9px 0 0 var(--l4-bg), 9px 4px 0 0 var(--l4-bg), 9px 9px 0 0 var(--l4-bg),
6px 14px 0 0 var(--l3-bg), 14px 6px 0 0 var(--l3-bg), 14px 14px 0 0 var(--l3-bg);
}

39
pronouns/index.html
View file

@ -1,30 +1,11 @@
<!doctype html> <!doctype html>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>how to: Rena's pronouns</title> <title>how to: Rena's pronouns</title>
<link rel="stylesheet" href="/main.css"/>
<style> <style>
:root {
--l0-bg: #18191a;
--l1-bg: #391145;
--l2-br: #a73590;
--l3-bg: #96234e;
--l3-tx: #d74a7f;
--l4-bg: #714d87;
--l4-tx: #9c74b6;
--l5-tx: #e4c6c6;
--gr-bg: #9e6d22;
--gr-tx: #D29442;
}
html { main {
margin: 0; max-width: 960px;
padding: 0;
background-color: var(--l0-bg);
}
body {
color: var(--l5-tx);
margin: 0;
padding: 0;
} }
.name { .name {
@ -51,20 +32,6 @@
padding: 1em; padding: 1em;
} }
main {
max-width: 960px;
margin: 2em;
border: 2px solid #988;
padding: 1.5em;
line-height: 1.4;
border-radius: 5px 25px 25px 25px;
position: relative;
z-index: 1;
box-shadow: 2px 4px 0 0 var(--gr-bg), 4px 2px 0 0 var(--gr-bg), 4px 4px 0 0 var(--gr-bg),
4px 9px 0 0 var(--l4-bg), 9px 4px 0 0 var(--l4-bg), 9px 9px 0 0 var(--l4-bg),
6px 14px 0 0 var(--l3-bg), 14px 6px 0 0 var(--l3-bg), 14px 14px 0 0 var(--l3-bg);
}
hr { hr {
border-color: #555; border-color: #555;
margin: 2em 40%; margin: 2em 40%;