MediaWiki:Common.css: Difference between revisions

MediaWiki interface page
(Added comments to stylesheet and removed weird line from user profiles)
(Modal window for TemplateData editor will appear above wikieditor ui toolbar)
 
(46 intermediate revisions by 3 users not shown)
Line 26: Line 26:
padding: 10px 15px;
padding: 10px 15px;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.04), 0 3px 6px rgba(0, 0, 0, 0.06);
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.04), 0 3px 6px rgba(0, 0, 0, 0.06);
}
.home-card p {
margin-top: 3.2px;
}
.home-card h3 {
margin-top: 0;
}
}


.home-card--col2 {
.home-card--col2 {
grid-column: span 2;
grid-column: span 2;
}
.home-card--row2 {
grid-row: span 2;
}
.home-card--row3 {
grid-row: span 3;
}
}


.home-card--row4 {
.home-card--row4 {
grid-row: span 4;
grid-row: span 4;
}
.home-card--atlas {
background-image: url(https://place-wiki.stefanocoding.me/thumb.php?f=FinalCanvas.png&width=600);
background-position: center center;
background-size: 100%;
transition: background-size .2s;
transition-timing-function: ease;
padding: 0;
display: flex;
align-items: end;
border: 0;
border-radius: 12px;
}
.home-card--atlas:hover {
background-size: 110%;
}
.home-card-atlas-link {
box-sizing: border-box;
height: 100%;
width: 100%;
padding: 10px 15px;
font-weight: bold;
color: #fff;
border-radius: 0 0 12px 12px;
display: flex;
align-items: end;
background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
}
.home-card--atlas a {
color: #fff;
height: 100%;
width: 100%;
    vertical-align: text-bottom;
}
.home-editing--stats {
display: flex;
flex-direction: row;
}
.home-stat {
flex-grow: 1;
display: flex;
flex-direction: column;
}
.home-stat a {
font-weight: bold;
}
.home-stat p {
color: var(--color-base-subtle);
}
}


Line 88: Line 160:
#profile-top {
#profile-top {
border-bottom: 0;
border-bottom: 0;
}
/* Adjust fonts and colors of statistics on account creation page */
.mw-createacct-benefits-container h3 {
font-family: Roboto, system-ui, -apple-system, -sans-serif !important;
color: var(--color-base--emphasized) !important;
}
.mw-createacct-benefits-container p {
color: var(--color-base--subtle);
}
/* Fix various issues with dark mode and image uploading */
/* Make background behind image title in upload dialog match user theme*/
.mw-upload-bookletLayout-filePreview {
background-color: var(--background-color-dp-24);
}
/* Make caption editor in image insert dialog match user theme */
.ve-ui-targetWidget:not(.oo-ui-pendingElement-pending) {
    background-color: var(--color-surface-1);
}
/* Make icons for editing and history appear properly */
.page-actions li:nth-child(2) > a:after {
background-image: url(https://place-wiki.stefanocoding.me/images/e/e0/edit-button.svg);
}
.page-actions li:nth-child(3) > a:after {
background-image: url(https://place-wiki.stefanocoding.me/images/c/cf/history-button.svg);
}
/* Tweak appearance of page history */
#pagehistory {
border-radius: 16px;
border-color: var(--border-color-base);
}
#pagehistory li {
padding: 10px 15px;
}
/* Modal window for TemplateData editor will appear above wikieditor ui toolbar */
.oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup {
z-index: 10;
}
}

Latest revision as of 14:05, 12 April 2022

/* CSS placed here will be applied to all skins */
/* Makes page previews use dark/light mode */
.mwe-popups-container {
	background: var(--background-color-dp-02) !important;
    color: var(--color-base)!important;
}

/* Makes wiki logo fully opaque rather than partially transparent */
.mw-logo-icon {
	opacity: 1.0 !important;
}

/* Hide page header on main page */
body.page-Main_Page.action-view #siteSub,
body.page-Main_Page.action-submit #siteSub,
body.page-Main_Page.action-view h1,
body.page-Main_Page.action-submit h1{
    display: none;
}

/* Styles for cards on home page */
.home-card {
	background: var(--background-color-dp-02);
	border-radius: 12px;
	border: 1px solid var( --border-color-base );
	padding: 10px 15px;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.04), 0 3px 6px rgba(0, 0, 0, 0.06);
}

.home-card p {
	margin-top: 3.2px;
}

.home-card h3 {
	margin-top: 0;
}

.home-card--col2 {
	grid-column: span 2;
}

.home-card--row2 {
	grid-row: span 2;
}

.home-card--row3 {
	grid-row: span 3;
}

.home-card--row4 {
	grid-row: span 4;
}

.home-card--atlas {
	background-image: url(https://place-wiki.stefanocoding.me/thumb.php?f=FinalCanvas.png&width=600);
	background-position: center center;
	background-size: 100%;
	transition: background-size .2s;
	transition-timing-function: ease;
	padding: 0;
	display: flex;
	align-items: end;
	border: 0;
	border-radius: 12px;
}

.home-card--atlas:hover {
	background-size: 110%;
}

.home-card-atlas-link {
	box-sizing: border-box;
	height: 100%;
	width: 100%;
	padding: 10px 15px;
	font-weight: bold;
	color: #fff;
	border-radius: 0 0 12px 12px;
	display: flex;
	align-items: end;
	background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
}

.home-card--atlas a {
	color: #fff;
	height: 100%;
	width: 100%;
    vertical-align: text-bottom;
}

.home-editing--stats {
	display: flex;
	flex-direction: row;
}

.home-stat {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

.home-stat a {
	font-weight: bold;
}

.home-stat p {
	color: var(--color-base-subtle);
}

.home-card-discord {
	color: #ffffff; 
	text-align: center; 
	background: #5865F2; 
	border-radius:12px; 
}

.home-card-discord a {
	color: #ffffff;
}

.home-card-reddit {
	color: #ffffff; 
	text-align: center; 
	background: #FF4500; 
	border-radius:12px; 	
}

.home-card-patreon {
	color: #ffffff; 
	text-align: center; 
	background: #FF6871; 
	border-radius:12px; 
}

.home-card-kofi {
	color: #ffffff; 
	text-align: center; 
	background: #52D0FE; 
	border-radius:12px; 	
}

.home-social-link {
	color: #fff; 
	font-weight: bold;
	width:100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-content: center; 
	flex-direction: column;
	transition: transform .2s;
	transition-timing-function: ease;
}

.home-social-link:hover {
	transform:scale(1.1);
}

/* Styles for user profiles */
#profile-top {
	border-bottom: 0;
}

/* Adjust fonts and colors of statistics on account creation page */
.mw-createacct-benefits-container h3 {
	font-family: Roboto, system-ui, -apple-system, -sans-serif !important;
	color: var(--color-base--emphasized) !important;
}

.mw-createacct-benefits-container p {
	color: var(--color-base--subtle);
}

/* Fix various issues with dark mode and image uploading */
/* Make background behind image title in upload dialog match user theme*/
.mw-upload-bookletLayout-filePreview {
	background-color: var(--background-color-dp-24);
}
/* Make caption editor in image insert dialog match user theme */
.ve-ui-targetWidget:not(.oo-ui-pendingElement-pending) {
    background-color: var(--color-surface-1);
}

/* Make icons for editing and history appear properly */
.page-actions li:nth-child(2) > a:after {
	background-image: url(https://place-wiki.stefanocoding.me/images/e/e0/edit-button.svg);
}

.page-actions li:nth-child(3) > a:after {
	background-image: url(https://place-wiki.stefanocoding.me/images/c/cf/history-button.svg);
}

/* Tweak appearance of page history */
#pagehistory {
	border-radius: 16px;
	border-color: var(--border-color-base);
}
#pagehistory li {
	padding: 10px 15px;
}

/* Modal window for TemplateData editor will appear above wikieditor ui toolbar */
.oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup {
	z-index: 10;
}
Cookies help us deliver our services. By using our services, you agree to our use of cookies.