MediaWiki:Common.css: Difference between revisions

From Ylvapedia
Jump to navigation Jump to search
mNo edit summary
m (April Showers bring May Flowers (◠‿◠✿))
Tag: Reverted
Line 53: Line 53:
padding: 0;
padding: 0;
padding-left: .5em;
padding-left: .5em;
}
/* April Showers Bring May Flowers */
@keyframes rain {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(100vh);
    }
}
.raindrop {
    position: absolute;
    top: -50px;
    left: calc(10% + (80% * random()));
    animation: rain 5s linear infinite;
}
.raindrop img {
    width: 20px;
    height: 20px;
}
.raindrop:nth-child(1) {
    animation-delay: 0s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Putit.png');
}
.raindrop:nth-child(2) {
    animation-delay: 1s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Slime.png');
}
.raindrop:nth-child(3) {
    animation-delay: 2s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Bubble.png');
}
.raindrop:nth-child(4) {
    animation-delay: 5s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Snow_Putit.png');
}
.raindrop:nth-child(5) {
    animation-delay: 10s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Pudding.png');
}
.raindrop:nth-child(6) {
    animation-delay: 15s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Metal_Putit.png');
}
.raindrop:nth-child(7) {
    animation-delay: 30s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Cat.png');
}
}

Revision as of 17:00, 1 April 2024

/* CSS placed here will be applied to all skins */

/* Main Page title and tagline are centered*/
body.page-Main_Page #firstHeading, #contentSub {
	text-align:center;
}

/* Images viewed in Media Viewer are scaled up and remain pixelated. */
.mw-mmv-image img {
	max-width: 100%;
	height: 100%;
	object-fit: contain;
	image-rendering: pixelated;
}
.infobox-profile, .infobox-classrace {
	float: right;
	max-width: 24em;
}
/* Thumbnails and specified images remain pixelated. */
.thumb img, .pixelated img {
	image-rendering: pixelated;
}
/* Styling for superscripts in green on wikitables */
table.wikitable sup {
    color: darkgreen;
}
/* Styling for subscripts in red on wikitables */
table.wikitable sub {
    color: red;
}

/* Front page styling */

.news-box {
	border: 1px solid;
	margin: 0.5em 0;
	padding: 0.5em 1em;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.news-header {
	border-bottom: 1px solid;
	font-size: 20px;
	margin: 0.5em 0;
	padding: 0.4em;
}

.news-subheader {
	border-left: 3px solid;
	margin: 1.5em 0 0 0;
	padding: 0;
	padding-left: .5em;
}
/* April Showers Bring May Flowers */
@keyframes rain {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(100vh);
    }
}

.raindrop {
    position: absolute;
    top: -50px; 
    left: calc(10% + (80% * random())); 
    animation: rain 5s linear infinite;
}


.raindrop img {
    width: 20px;
    height: 20px;
}


.raindrop:nth-child(1) {
    animation-delay: 0s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Putit.png');
}
.raindrop:nth-child(2) {
    animation-delay: 1s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Slime.png');
}
.raindrop:nth-child(3) {
    animation-delay: 2s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Bubble.png');
}
.raindrop:nth-child(4) {
    animation-delay: 5s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Snow_Putit.png');
}
.raindrop:nth-child(5) {
    animation-delay: 10s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Pudding.png');
}
.raindrop:nth-child(6) {
    animation-delay: 15s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Metal_Putit.png');
}
.raindrop:nth-child(7) {
    animation-delay: 30s;
    background-image: url('https://ylvapedia.wiki/wiki/File:Elin_Npc_Sprite_Cat.png');
}