mylloon.fr/static/css/web3.css
Mylloon 91f0b45d18
Some checks are pending
ci/woodpecker/push/publish Pipeline is pending
change cookie bg
2023-10-15 21:35:56 +02:00

120 lines
1.7 KiB
CSS

:root {
--anim-type: cubic-bezier(0.46, 0.03, 0.52, 0.96) infinite normal none running; /* Quadratic */
}
html {
background-image: url("../pics/bg-web3.gif");
background-repeat: revert;
color: white;
}
div#scroll-banner {
overflow: hidden;
border: 3px double white;
}
div#scroll-text {
text-align: right;
white-space: nowrap;
animation: 8s var(--anim-type) marquee;
}
div#scroll-banner > div#scroll-text > * {
font-size: 200%;
margin: 0;
}
@keyframes marquee {
from {
transform: translateX(100%);
}
to {
transform: translateX(-150%);
}
}
@media only screen and (max-width: 850px) {
/* Mobile display */
div#scroll-text {
animation: 9s var(--anim-type) marquee_min;
}
@keyframes marquee_min {
from {
transform: translateX(100%);
}
to {
transform: translateX(-320%);
}
}
}
h1 {
font-size: 250%;
}
.pre {
font-family: monospace;
}
p,
a {
font-size: 125%;
}
a {
color: rgb(147, 107, 255);
}
li > a {
color: rgb(195, 86, 155);
font-size: 100%;
}
img {
vertical-align: middle;
}
footer {
text-align: center;
}
/* Cookie banner */
#cookie .cookie-flag {
display: none;
}
#cookie .cookie-container {
display: block;
pointer-events: none;
position: relative;
}
#cookie .cookie-content {
border: 1px solid white;
background: slategray;
display: flex;
}
#cookie .cookie-flag:checked ~ .cookie-close,
#cookie .cookie-flag:checked ~ .cookie-content {
display: none;
}
#cookie .cookie-close {
pointer-events: all;
position: absolute;
top: 1rem;
right: 1rem;
font-size: 32px;
cursor: pointer;
}
#cookie-icon {
font-size: 40px;
margin: 1%;
margin-top: 3rem;
}