Template:Aspie/styles.css: Difference between revisions

Revision as of 19:08, 13 May 2026

.template-aspie {
	overflow: hidden;
	border: 4px ridge #ffd900;
	background: url("https://soyjakwiki.org/images/8/8c/Aspie.svg");
	background-size: 4rem;
	background-position: center;
	text-shadow: 0 1px 2px #523200;
	color: white;
	box-shadow: inset 0 0 5px 0 #523200;
}

.template-aspie a {
	color: #8dff99;
}

.template-aspie .line1 {
	font-size: 170%;
}

.template-aspie .line2 {
	width: 100%;
}

.template-aspie .random-text-wrapper {
	display: flex;
	position: relative;
}

.template-aspie .random-text {
	display: block;
	animation: text-reveal 7s linear forwards;
	width: 100%;
}

.template-aspie .train {
	position: absolute;
	align-self: center;
	animation: train-animation 7s linear forwards;
}

@keyframes text-reveal {
  from {
    clip-path: inset(0 0 0 -20rem);
  }
  to {
    clip-path: inset(0 0 0 40rem);
  }
}

@keyframes train-animation {
  from {
    transform: translateX(-20rem);
  }
  to {
    transform: translateX(40rem);
  }
}