Template:Rainbow text/styles.css

From Uncyclopedia, the content-free encyclopedia
Jump to navigation Jump to search
.rainbow-container {
  display: inline-block;
  background: linear-gradient(90deg, hsl(0, 100%, 50%), hsl(30, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(240, 100%, 50%), hsl(275, 100%, 50%), hsl(300, 100%, 50%));
}

.rainbow-text {
	color: transparent;
	filter: drop-shadow(0 1px 0 rgba(0,0,0,0.4));
}

.rainbow-text a {
    background: inherit;
    color: inherit;
    background-size: 50% 100%;
    animation: rainbow-link 1s linear infinite;
}

.rainbow-background {
    color: #fff;
    text-shadow: 1px 1px 1px #111;
    border-radius: 3px;
}

.rainbow-background a {
    color: rgba(255,255,255,0.75) !important;
}

@keyframes rainbow-link {
    0% { background-position: 0% 0%; }
    100% { background-position: 100% 0%; }
}