Alex at 11:25, 29 October 2024

2024-10-29T11:25:29Z

← Older revision		Revision as of 13:25, 29 October 2024
Line 1:		Line 1:
	/* <pre> */		/* <pre> */
	body.page-~~Old_School_RuneScape_Wiki~~ .mw-parser-output {		body.page-RuneRealm_Wiki .mw-parser-output {
	max-width: 75em;		max-width: 75em;
	margin: 0 auto;		margin: 0 auto;
	}		}

	body.page-~~Old_School_RuneScape_Wiki~~.action-view .catlinks,		body.page-RuneRealm_Wiki.action-view .catlinks,
	body.page-~~Old_School_RuneScape_Wiki~~.action-view #contentSub,		body.page-RuneRealm_Wiki.action-view #contentSub,
	body.page-~~Old_School_RuneScape_Wiki~~.action-view #siteNotice {		body.page-RuneRealm_Wiki.action-view #siteNotice {
	display: none;		display: none;
	}		}

	body.page-~~Old_School_RuneScape_Wiki~~ .line-break {		body.page-RuneRealm_Wiki .line-break {
	display: none !important;		display: none !important;
	}		}

Alex at 16:16, 17 October 2024

2024-10-17T16:16:13Z

← Older revision		Revision as of 18:16, 17 October 2024
Line 94:		Line 94:

	.arrow {		.arrow {
	background: url('~~filepath:~~//White-chevron.svg') no-repeat;		background: url('/images/rss/White-chevron.svg') no-repeat;
	display: inline-block;		display: inline-block;
	height: 0.7rem;		height: 0.7rem;
Line 267:		Line 267:
	}		}

	.popular-~~mw.~~pages ul {		.popular-pages ul {
	display: grid;		display: grid;
	grid-template-columns: repeat(3, 1fr);		grid-template-columns: repeat(3, 1fr);
Line 449:		Line 449:

	.mainpage-editing ul {		.mainpage-editing ul {
	list-style-image: url('~~filepath:~~//Transparent-chevron.svg');		list-style-image: url('/images/rss/Transparent-chevron.svg');
	}		}

Line 492:		Line 492:
	}		}

	.popular-~~mw.~~pages ul {		.popular-pages ul {
	grid-template-columns: repeat(2, 1fr);		grid-template-columns: repeat(2, 1fr);
	}		}

Alex at 23:11, 16 October 2024

2024-10-16T23:11:19Z

← Older revision		Revision as of 01:11, 17 October 2024
Line 267:		Line 267:
	}		}

	.popular-pages ul {		.popular-mw.pages ul {
	display: grid;		display: grid;
	grid-template-columns: repeat(3, 1fr);		grid-template-columns: repeat(3, 1fr);
Line 492:		Line 492:
	}		}

	.popular-pages ul {		.popular-mw.pages ul {
	grid-template-columns: repeat(2, 1fr);		grid-template-columns: repeat(2, 1fr);
	}		}

Alex: Created page with "/*

 */ body.page-Old_School_RuneScape_Wiki .mw-parser-output {     max-width: 75em;     margin: 0 auto; }  body.page-Old_School_RuneScape_Wiki.action-view .catlinks, body.page-Old_School_RuneScape_Wiki.action-view #contentSub, body.page-Old_School_RuneScape_Wiki.action-view #siteNotice {     display: none; }  body.page-Old_School_RuneScape_Wiki .line-break {     display: none !important; }  .mainpage-header {     display: flex;     margin: 2.6em 1.75em 1.5em; }  .ma..."

2024-10-13T00:06:50Z

Created page with "<pre>: body.page-Old_School_RuneScape_Wiki .mw-parser-output { max-width: 75em; margin: 0 auto; } body.page-Old_School_RuneScape_Wiki.action-view .catlinks, body.page-Old_School_RuneScape_Wiki.action-view #contentSub, body.page-Old_School_RuneScape_Wiki.action-view #siteNotice { display: none; } body.page-Old_School_RuneScape_Wiki .line-break { display: none !important; } .mainpage-header { display: flex; margin: 2.6em 1.75em 1.5em; } .ma..."

New page

/* <pre> */
body.page-Old_School_RuneScape_Wiki .mw-parser-output {
max-width: 75em;
margin: 0 auto;
}

body.page-Old_School_RuneScape_Wiki.action-view .catlinks,
body.page-Old_School_RuneScape_Wiki.action-view #contentSub,
body.page-Old_School_RuneScape_Wiki.action-view #siteNotice {
display: none;
}

body.page-Old_School_RuneScape_Wiki .line-break {
display: none !important;
}

.mainpage-header {
display: flex;
margin: 2.6em 1.75em 1.5em;
}

.mainpage-header .header-intro {
flex: 2;
}

.mainpage-header .header-intro h1 {
font-size: 2.5em;
font-weight: bold;
border: none;
margin: 0 0 0.15em;
}

.mainpage-header .header-intro p {
font-size: 1.1em;
line-height: 1.7em;
}

.mainpage-header .header-stats {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
margin-top: -1em;
}

.mainpage-body {
display: grid;
grid-template-areas: "update update update" "content content content" "left left right";
gap: 0.9rem;
grid-template-columns: repeat(3, 1fr);
}

.mainpage-body h2 a {
color: var(--text-color);
}

.mainpage-body .tile {
padding-left: 1.75em;
padding-right: 1.75em;
max-width: 100%;
}

.mainpage-body .tile-row {
width: 100%;
margin-bottom: 0;
}

.mainpage-body .tile-row {
display: grid;
gap: 0.9rem;
}

.mainpage-left {
grid-area: left;
flex: 2;
display: flex;
flex-flow: column wrap;
}

.mainpage-left > * {
margin: 0 0 0.9rem;
}

.mainpage-right {
grid-area: right;
flex: 1;
display: flex;
flex-flow: column wrap;
}

.mainpage-right > * {
margin: 0 0 0.9rem;
}

.arrow {
background: url('filepath://White-chevron.svg') no-repeat;
display: inline-block;
height: 0.7rem;
width: 0.45rem;
vertical-align: middle;
}

.arrow.dark {
filter: invert(80%);
}

.mainpage-recent-updates {
grid-area: update;
grid-template-columns: repeat(3, 1fr);
}

.mainpage-recent-updates .tile-halves {
flex: 1;
align-content: flex-start;
}

.mainpage-recent-updates .tile-halves:hover .tile-top img {
transform: scale(1.04);
}

.mainpage-recent-updates .tile-bottom.link-button a {
text-align: left;
padding: 1rem 1.5rem 0.75rem;
}

.mainpage-recent-updates h2 {
margin: -0.5em 0 0.3em;
}

.mainpage-recent-updates p:not(.byline) {
font-size: 0.9em;
line-height: 1.75em;
color: var(--text-color);
}

.mainpage-contents {
grid-area: content;
grid-template-columns: repeat(6, 1fr);
}

.mainpage-contents .tile-halves {
flex: 1;
}

.mainpage-contents .tile-top {
position: relative;
}

.mainpage-contents h2 {
margin: 0;
padding: 0;
}

.mainpage-contents .tile-bottom.link-button a {
padding: 0.75em 0.2em;
}

.mainpage-skills ul {
columns: 3 9em;
margin: 1em 0.7em 0.7em 1em;
}

.mainpage-skills li {
display: flex;
margin-bottom: 0.29em;
}

.mainpage-skills li a:first-child {
border-radius: 2px;
padding: 4px;
width: 25px;
height: 25px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}

.mainpage-skills li a:last-child {
flex: 1;
display: flex;
align-items: center;
font-weight: bold;
padding-left: 0.7em;
text-decoration: none;
}

.mainpage-skills li:hover a:first-child {
border-radius: 2px 0 0 2px;
}

.mainpage-skills li:hover a:last-child {
color: rgba(255, 255, 255, 0.9);
border-radius: 0 2px 2px 0;
}

.skill-agility a:first-child,
.skill-melee a:first-child {
background: #bc483d;
}

.skill-agility:hover a:last-child,
.skill-melee:hover a:last-child {
background: #932419;
}

.skill-ranged a:first-child {
background: #748d36;
}

.skill-ranged:hover a:last-child {
background: #4c6215;
}

.skill-magic a:first-child {
background: #6274ab;
}

.skill-magic:hover a:last-child {
background: #304791;
}

.skill-fishing a:first-child,
.skill-fletching a:first-child {
background: #3e8e9a;
}

.skill-fishing:hover a:last-child,
.skill-fletching:hover a:last-child {
background: #1a6671;
}

.skill-cooking a:first-child,
.skill-thieving a:first-child {
background: #91689e;
}

.skill-cooking:hover a:last-child,
.skill-thieving:hover a:last-child {
background: #713684;
}

.skill-farming a:first-child,
.skill-woodcutting a:first-child {
background: #59924f;
}

.skill-farming:hover a:last-child,
.skill-woodcutting:hover a:last-child {
background: #306f25;
}

.skill-mining a:first-child {
background: #6385a8;
}

.skill-mining:hover a:last-child {
background: #315f8d;
}

.skill-smithing a:first-child {
background: #d2b244;
}

.skill-smithing:hover a:last-child {
background: #b69213;
}

.popular-pages ul {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 0.6em;
margin: 1em 0 0.7em 0;
}

.mp-popular-page-light {
display: flex;
align-items: center;
background-color: var(--button-background);
transition: 100ms;
}

.mp-popular-page-light a {
flex: 1;
display: block;
color: #fff;
font-weight: bold;
text-align: center;
text-decoration: none;
padding: 0.7em 1em;
}

.mp-popular-page-light:hover {
filter: brightness(115%);
transition: 100ms;
}

.mainpage-discord {
border: none;
box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}

.mainpage-discord .tile-top {
display: flex;
align-items: center;
background: #5865f2;
padding: 1em 1.75em;
}

.mainpage-discord .tile-top a {
flex: 1;
position: relative;
text-decoration: none;
}

.mainpage-discord .tile-top a:hover .arrow {
transform: translateX(50%);
}

.mainpage-discord .tile-bottom {
background: #525ee0;
border: none;
padding: 1em 1.75em;
}

.mainpage-discord .tile-bottom p {
color: #fff;
font-weight: bold;
font-size: 0.9em;
text-align: center;
text-transform: uppercase;
letter-spacing: 0.03em;
margin: 0;
}

.mainpage-discord .partner-icon {
margin-right: 0.75em;
}

.mainpage-discord .server-name {
color: #fff;
font-weight: bold;
font-size: 1.25em;
margin: 0.5em 0 -0.15em;
}

.mainpage-discord .server-tagline {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 0.5em;
}

.mainpage-discord .arrow {
position: absolute;
top: calc(50% - .5em);
right: 0;
height: 1em;
width: 0.7em;
background-size: 0.7em 1em;
transition: 0.3s ease-out;
}

.mainpage-twitter {
border: none;
box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}

.mainpage-twitter .tile-top {
display: flex;
align-items: center;
background: #00aced;
padding: 1em 1.75em;
}

.mainpage-twitter .tile-top a {
flex: 1;
position: relative;
text-decoration: none;
}

.mainpage-twitter .tile-top a:hover .arrow {
transform: translateX(50%);
}

.mainpage-twitter .tile-bottom {
background: #0084b4;
border: none;
padding: 1em 1.75em;
}

.mainpage-twitter .tile-bottom p {
color: #fff;
font-weight: bold;
font-size: 0.9em;
text-align: center;
text-transform: uppercase;
letter-spacing: 0.03em;
margin: 0;
}

.mainpage-twitter .twitter-logo {
margin-right: 0.75em;
}

.mainpage-twitter .twitter-name {
color: #fff;
font-weight: bold;
font-size: 1.25em;
margin: 0.5em 0 -0.15em;
}

.mainpage-twitter .twitter-tagline {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 0.5em;
}

.mainpage-twitter .arrow {
position: absolute;
top: calc(50% - .5em);
right: 0;
height: 1em;
width: 0.7em;
background-size: 0.7em 1em;
transition: 0.3s ease-out;
}

.mainpage-editing {
border: none;
box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}

.mainpage-editing .tile-top {
background: #438ab5;
}

.mainpage-editing .tile-bottom {
background: #3980ab;
border: none;
padding: 0.8rem 1.5rem 0.4rem;
}

.mainpage-editing h2,
.mainpage-editing a {
color: #fff;
}

.mainpage-editing p {
color: rgba(255, 255, 255, 0.9);
}

.mainpage-editing ul {
list-style-image: url('filepath://Transparent-chevron.svg');
}

.mainpage-poll .ajaxpoll {
border: none;
background: none;
padding: 0;
width: auto;
}

@media only screen and (max-width: 1200px) {
.mainpage-contents {
grid-template-columns: repeat(3, 1fr);
}

}

@media only screen and (max-width: 1000px) {
.mainpage-body {
grid-template-areas: "update update update" "content content content" "left left left" "right right right";
}

.mainpage-recent-updates {
grid-template-columns: repeat(2, 1fr);
}

.mainpage-recent-updates .tile-halves:last-child {
display: none;
}

.mainpage-recent-updates .tile-halves:hover .tile-top img {
transform: scale(1.04);
}

.mainpage-recent-updates .tile-top {
height: 18vw;
min-height: 9em;
}

.mainpage-header .header-stats {
display: none;
}

.popular-pages ul {
grid-template-columns: repeat(2, 1fr);
}

}

@media only screen and (max-width: 720px) {
.mainpage-recent-updates {
grid-template-columns: none;
}

.mainpage-recent-updates .tile-halves:last-child {
display: flex;
}

}

@keyframes slide-up {
from {
opacity: 0;
transform: translateY(1rem);
}

to {
opacity: 1;
transform: translateY(0);
}

}

.mainpage-header {
margin: 2em 1em 0;
}

@media only screen and (max-width: 1000px) {
.mainpage-header .header-intro h1 {
text-align: center;
font-size: 1.8em;
}

.mainpage-header .header-intro p {
font-size: 1em;
}

}

.mainpage-body .tile-row {
width: inherit;
}

.mainpage-left .tile {
padding: 2.5em 1.75em 2em;
}

.mainpage-left .tile h2 {
padding: 0;
margin: 0.65em 0.5em;
}

.mainpage-left .tile-halves h2 {
padding: 0;
margin: 0.65em 0.5em;
}

.mainpage-recent-updates {
padding: 1.5em 1em 2.5em;
}

.mainpage-recent-updates::before {
content: 'Recent updates';
display: block;
margin-left: 1.5em;
color: var(--byline-color);
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0.025em;
grid-column: 1 / 4;
}

.mainpage-recent-updates .tile-halves {
display: inline-block;
width: 100%;
white-space: initial;
flex: unset;
}

.mainpage-recent-updates .tile-halves:nth-child(1) {
animation: 0.9s 0.2s both slide-up;
}

.mainpage-recent-updates .tile-halves:nth-child(2) {
animation: 0.9s 0.4s both slide-up;
}

.mainpage-recent-updates .tile-halves:nth-child(3) {
animation: 0.9s 0.6s both slide-up;
}

.mainpage-recent-updates .tile-top {
height: 9em;
overflow: hidden;
}

.mainpage-recent-updates .tile-bottom {
padding-bottom: 0.5rem;
}

.mainpage-recent-updates .byline {
margin: 0;
}

.mainpage-recent-updates .byline + h2 {
margin: 0.025em 0 0;
padding: 0;
}

@media only screen and (max-width: 720px) {
.mainpage-recent-updates::before {
text-align: center;
margin: 0;
grid-column: auto;
}

}

.mainpage-contents {
background: var(--body-mid);
padding: 55px 1em 2em 2.5em;
overflow-x: auto;
grid-template-columns: repeat(6, 1fr) !important;
position: relative;
scroll-snap-align: center;
}

.mainpage-contents::before {
content: 'Explore';
margin: 1em;
position: absolute;
top: 0;
color: inherit;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0.025em;
grid-column: 1 / 6;
}

.mainpage-contents .tile-halves {
border: none;
background: none;
box-shadow: none;
width: 200px;
}

.mainpage-contents .tile-top {
padding: 0;
height: initial;
}

.mainpage-contents .tile-bottom {
border: none;
}

.mainpage-contents h2 {
width: 100%;
}

@media only screen and (min-width: 1000px) {
.mainpage-skills .tile-top ul {
margin: 0;
}

}

.mainpage-wikinews::before {
content: 'From the wiki';
margin-left: 0.75em;
color: var(--byline-color);
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0.025em;
}

.mainpage-discord .tile-top {
padding: 1em 2em;
height: 70px;
}

.mainpage-discord .tile-top .partner-icon {
margin-right: 1em;
}

.mainpage-discord .tile-top .server-name {
margin: 0;
}

.mainpage-discord .tile-top .server-tagline {
margin: 0;
}

.mainpage-twitter {
margin-bottom: 0;
}

.mainpage-twitter .tile-top {
padding: 1em 2em;
height: 70px;
}

.mainpage-twitter .tile-top .twitter-logo {
margin-right: 1em;
}

.mainpage-twitter .tile-top .twitter-name {
margin: 0;
}

.mainpage-twitter .tile-top .twitter-tagline {
margin: 0;
}

MediaWiki:Test.css - Revision history

Alex at 11:25, 29 October 2024

Alex at 16:16, 17 October 2024

Alex at 23:11, 16 October 2024