nova/kittygirl.online
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style footer, fix blobs, change link styling, various other misc styling changes

Browse source
This commit is contained in:
nova ember madeline 2025-05-04 16:55:05 +02:00
parent 4bd9aec6b9
commit 1a734f8282
2 changed files with 44 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/css/dark.css
View file

@ -31,6 +31,12 @@
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.dark main a {
font-family: "Righteous";
text-decoration: underline;
color: var(--pink);
}
.dark a:hover { .dark a:hover {
color: #ffffff; color: #ffffff;
text-shadow: 0 0 8px rgba(229, 202, 255, 0.9); text-shadow: 0 0 8px rgba(229, 202, 255, 0.9);

50
src/css/light.css
View file

@ -24,6 +24,12 @@ a {
transition: all 0.3s ease; transition: all 0.3s ease;
} }
main a {
font-family: "Righteous";
text-decoration: underline;
color: #910c75;
}
a:hover { a:hover {
color: #000; color: #000;
} }
@ -40,6 +46,7 @@ html, body {
gap: 3em; gap: 3em;
margin: 0 10em; margin: 0 10em;
background: transparent; background: transparent;
font-family: "Poppins";
} }
.cards { .cards {
@ -150,7 +157,7 @@ a.card-link {
/* Blobs */ /* Blobs */
.blob-cont { .blob-cont {
display: flex; display: flex;
flex-direction: column; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
z-index: -2; z-index: -2;
@ -174,18 +181,18 @@ a.card-link {
height: 200px; height: 200px;
width: 200px; width: 200px;
animation: blob4 8s infinite linear; animation: blob1 8s infinite linear;
} }
#blob2 { #blob2 {
background-color: var(--red); background-color: var(--red);
position: absolute; position: absolute;
top: 200px; top: 200px;
left: 100px; right: 0;
height: 200px; height: 200px;
width: 200px; width: 200px;
animation: blob1 8s infinite ease; animation: blob2 8s infinite ease;
} }
#blob3 { #blob3 {
@ -196,7 +203,7 @@ a.card-link {
height: 200px; height: 200px;
width: 250px; width: 250px;
animation: blob2 8s infinite ease; animation: blob3 8s infinite ease;
} }
#blob4 { #blob4 {
@ -207,28 +214,28 @@ a.card-link {
height: 250px; height: 250px;
width: 200px; width: 200px;
animation: blob3 8s infinite linear; animation: blob4 8s infinite linear;
} }
@keyframes blob1 { @keyframes blob1 {
0% { 0% {
top: 200px; top: 200px;
left: 100px; right: 100px;
transform: scale(1); transform: scale(1);
} }
30% { 30% {
top: 300px; top: 300px;
left: 150px; right: 140px;
transform: scale(1.2); transform: scale(1.2);
} }
60% { 60% {
top: 100px; top: 100px;
left: 200px; right: 180px;
transform: scale(1.3); transform: scale(1.3);
} }
100% { 100% {
top: 200px; top: 200px;
left: 100px; right: 100px;
transform: scale(1); transform: scale(1);
} }
} }
@ -270,7 +277,7 @@ a.card-link {
60% { 60% {
top: 250px; top: 250px;
right: 100px; right: 100px;
transform: scale(1); transform: scale(1.2);
} }
100% { 100% {
top: 250px; top: 250px;
@ -346,11 +353,17 @@ nav {
margin-top: 10vh; margin-top: 10vh;
font-size: 5em; font-size: 5em;
} }
.page-content { .page-content {
font-size: 24px; font-size: 20px;
margin: 0 20px; margin: 0 20px;
} }
main {
max-width: 75em;
align-self: center;
}
:root::-webkit-scrollbar { :root::-webkit-scrollbar {
display: none; display: none;
} }
@ -434,3 +447,16 @@ transition: opacity 0.3s ease;
transform: translateY(-15px); transform: translateY(-15px);
} }
} }
:not(pre) > code {
padding: 0.2em 0.3em;
background-color: hsl(220, 13%, 18%);
color: hsl(220, 14%, 71%);
border-radius: 0.3em;
white-space: nowrap; /* prevent line breaks in inline code */
}
footer {
margin: 3em;
text-align: center;
}