mirror of
https://github.com/cheeaun/phanpy.git
synced 2025-02-13 11:36:25 +01:00
88 lines
1.6 KiB
CSS
88 lines
1.6 KiB
CSS
#welcome {
|
|
text-align: center;
|
|
background-image: radial-gradient(
|
|
closest-side at 50% 50%,
|
|
var(--bg-faded-color),
|
|
transparent
|
|
);
|
|
padding: 16px;
|
|
}
|
|
|
|
#welcome h1 {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 1.2em;
|
|
}
|
|
#welcome img {
|
|
vertical-align: top;
|
|
}
|
|
|
|
#welcome h2 {
|
|
font-size: 3em;
|
|
letter-spacing: -0.05ex;
|
|
margin: 16px 0;
|
|
padding: 0;
|
|
/* gradiented text */
|
|
background: linear-gradient(
|
|
45deg,
|
|
var(--blue-color) 30%,
|
|
var(--purple-color),
|
|
var(--red-color) 70%
|
|
);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
}
|
|
|
|
@keyframes psychedelic {
|
|
0% {
|
|
filter: hue-rotate(0deg);
|
|
}
|
|
100% {
|
|
filter: hue-rotate(-90deg);
|
|
}
|
|
}
|
|
#welcome:hover h2 {
|
|
animation: psychedelic 10s infinite alternate;
|
|
}
|
|
|
|
#why-container summary {
|
|
font-weight: bold;
|
|
margin: 16px 0;
|
|
padding: 0;
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
#why-container[open] summary {
|
|
text-decoration: none;
|
|
opacity: 0.5;
|
|
}
|
|
|
|
#why-container .sections section {
|
|
text-align: start;
|
|
max-width: 480px;
|
|
background-color: var(--bg-color);
|
|
border-radius: 30px;
|
|
border: 1px solid var(--bg-color);
|
|
font-weight: 600;
|
|
font-size: 106.25%;
|
|
overflow: hidden;
|
|
box-shadow: 0 0 0 1px var(--outline-color),
|
|
0 4px 16px -8px var(--drop-shadow-color);
|
|
margin-bottom: 16px;
|
|
}
|
|
#why-container .sections section h4 {
|
|
margin: 0;
|
|
padding: 30px 30px 0;
|
|
font-size: 111.765%;
|
|
color: var(--blue-color);
|
|
font-weight: 600;
|
|
}
|
|
#why-container .sections section p {
|
|
margin-inline: 30px;
|
|
margin-bottom: 30px;
|
|
}
|
|
#why-container .sections section img {
|
|
width: 100%;
|
|
height: auto;
|
|
border-top: 1px solid var(--outline-color);
|
|
}
|