changed home page message and misc stuff

This commit is contained in:
sundae 2025-06-11 13:54:09 +03:00
parent dfba7f8f29
commit ea235120f8
No known key found for this signature in database
7 changed files with 106 additions and 114 deletions

View file

@ -7,9 +7,17 @@
transform: translateY(-4px);
}
}
@keyframes fadeIn {
0% {
color: inherit;
}
100% {
color: transparent;
}
}
@media (prefers-color-scheme: light) {
#intro span[id]::before {
text-shadow: 0 0 1rem var(--primary-dark-500);
#badges a:is(:hover, :focus) img {
filter: drop-shadow(4px 6px 0 var(--primary-500));
}
#collection {
& a:is(:hover, :focus) {
@ -23,8 +31,8 @@
}
}
@media (prefers-color-scheme: dark) {
#intro span[id]::before {
text-shadow: 0 0 1rem var(--secondary-900);
#badges a:is(:hover, :focus) img {
filter: drop-shadow(4px 6px 0 var(--secondary-500));
}
#collection {
& a:is(:hover, :focus) {
@ -64,54 +72,42 @@ body [id]:not(:nth-child(1)) ul {
}
#agender {
background-image: linear-gradient(
black 0 14.28%,
silver 0 28.57%,
white 0 42.85%,
#000 0 14.28%,
#c0c0c0 0 28.57%,
#fff 0 42.85%,
#a3fa73 0 57.14%,
white 0 71.42%,
silver 0 85.71%,
black 0
#fff 0 71.42%,
#c0c0c0 0 85.71%,
#000 0
);
}
#aromantic {
background-image: linear-gradient(
#0a2 20%,
#7d6 0 40%,
white 0 60%,
darkgray 0 80%,
black 0
#fff 0 60%,
#a9a9a9 0 80%,
#000 0
);
}
#pansexual {
background-image: linear-gradient(#f09 33.33%, gold 0 66.66%, deepskyblue 0);
}
#agender::before {
content: "agender";
}
#aromantic::before {
content: "aromantic";
}
#pansexual::before {
content: "pansexual";
}
#intro span[id]::before {
width: inherit;
height: inherit;
position: absolute;
z-index: -1;
}
#intro span[id] {
font-size: 2rem;
color: transparent;
background-clip: text;
background-size: 2rem;
background-position: center;
background-repeat: repeat-x;
background-image: linear-gradient(#f09 33.33%, #ffd700 0 66.66%, #00bfff 0);
}
#intro {
& p {
& p, ul {
font-family: "Urbanist", sans-serif;
font-size: 1.8rem;
font-size: 1.3rem;
}
& ul {
margin: 0;
}
& span[id] {
background-clip: text;
background-repeat: repeat;
&:hover {
animation: fadeIn var(--trans) linear forwards;
filter: drop-shadow(2px 2px 1px #0006);
}
}
}
#collection {
@ -120,12 +116,12 @@ body [id]:not(:nth-child(1)) ul {
& ul {
margin: 0;
padding: 0;
justify-content: center;
justify-content: start;
}
& li {
display: flex;
& a {
padding: 8px;
padding-top: 8px;
transition: background-color var(--trans);
text-decoration: none;
}
@ -151,12 +147,12 @@ body [id]:not(:nth-child(1)) ul {
list-style-type: none;
}
& a {
outline: none;
display: flex;
padding: inherit;
margin: 0;
}
& a:is(:hover, :focus) img {
filter: drop-shadow(4px 6px 0 #0006);
transform: translateY(-4px);
transition: 0.3s;
}