Difference between revisions of "User:Certified nqh/common.css"

Revision as of 14:09, 16 October 2023

/* This style sheet works with all skins. */
/* Made by NQH */

/* One can only dream. */
.blink { animation: blink 1s step-end infinite; }
.marquee { display: flex; overflow: hidden; animation: marquee 40s linear infinite; animation-delay: -10s; }

@keyframes blink { 67% { opacity: 0 } }

@keyframes marquee { from { transform: translateX(-50%); } to { transform: translateX(150%); } }

@keyframes rainbow {
 from { background-color: hsl(0, 30%, 50%); border-color: hsl(180, 30%, 50%); }
 to   { background-color: hsl(360, 30%, 50%); border-color: hsl(540, 30%, 50%); }
}

@keyframes rainbowtext {
 from { color: hsl(0, 50%, 50%); }
 to   { color: hsl(360, 50%, 50%); }
}

@keyframes rotate {
 0%  { transform: rotate(20deg); }
 50% { transform: rotate(-20deg); }
 100%{ transform: rotate(20deg); }
}

@keyframes speen {
 from{ transform: rotate(0deg); }
 to  { transform: rotate(360deg); }
}

@keyframes punch {
 from{font-size: 2em;}
 to  {font-size: 1em;}
}

.rainbow {
 border: 5px solid black;
 padding: 5px;
 animation: rainbow 10s linear infinite !important;
}

.displaynot {
 width: 0px !important;
 height: 0px !important;
 font-size: 0px !important;
}

:not(.rainbow,body,.rainbow *, a) {
 background-color: black !important;
 color: white !important;
}

.rainbow * {
 background-color: #00000000 !important;
 color: black;
}

@keyframes bouncing {
 0%   {left:0%;}
 50%  {left:20%;}
 100% {left:0%;}
}

span.bounce {
 width: fit-content;
 position: absolute;
 animation: bouncing 10s linear infinite;
}

.mw-wiki-logo {
 background-color: white !important;
 filter: invert(100%);
}

a:hover {
 animation: rainbowtext 0.25s linear infinite, punch 0.5s;
 font-weight: bold;
}

a:active {
 animation: rainbow 0.25s linear infinite;
 color: black !important;
}