Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.
The main server is currently down. We are running on a backup server, so editing and search functionality are temporarily disabled. Please check back in a few hours.

MediaWiki:Vector.css: Difference between revisions

MediaWiki interface page
No edit summary
No edit summary
Line 68: Line 68:
/*
/*
CSS to improve content page width in new 2022 vector skin.
CSS to improve content page width in new 2022 vector skin.
This is an improvement over deselecting the "Enable limited width" checkbox in preferences.
*/
*/


Line 83: Line 82:
}
}
.mw-page-container-inner {  
.mw-page-container-inner {  
     grid-template-columns: 200px minmax(0,1fr);  
     grid-template-columns: 20px minmax(0,1fr);  
}
}
}
}

Revision as of 07:27, 2 April 2023

/* All CSS here will be loaded for users of the Vector skin */

/*Main Section*/
.home-header {
    text-align: center;
}

.heading-main1 {
    text-align: center;
    font-weight: 600;
}

.not-available {
    filter: opacity(0.5);
}

/* Infobox section */

table.infobox {
    margin-left: 1.4rem;
    clear: right;
    float: right;
    z-index: 3!important;
    overflow: hidden;
    width: 320px;
    padding: 5px;
    max-width: 100%;
    margin-bottom: 1.6rem;
    padding-bottom: 20px!important;
    background: var(--color-surface-2);
    border-radius: var(--border-radius--medium);
    border-spacing: 0;
    border: 1px solid #62626226;
    box-shadow: var(--box-shadow-card);
    font-size: 0.875rem;
}


th.infobox-title{
    padding-top: 10px;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 5px;
    color: var(--color-base--emphasized);
    font-size: 1.4rem;
    line-height: 1.4;
}

th.infobox-header{
width: 100%;
    padding-top: 15px;
    border-color: var(--border-color-base);
    margin-top: 15px;
    color: var(--color-base--emphasized);
    font-size: 1rem;
}

table.infobox>tbody {
    text-align: center;
}

/* all */
html, body {
    font-family: sans-serif;
}


/*
CSS to improve content page width in new 2022 vector skin.
*/

/* left sidebar content width (was something like 224px) 
#vector-toc-pinned-container .sidebar-toc:after, #vector-toc-pinned-container .sidebar-toc, #vector-toc-pinned-container .vector-toc:after, #vector-toc-pinned-container .vector-toc, .vector-feature-page-tools-disabled .vector-main-menu, .vector-main-menu-container .vector-main-menu {
    width: 200px;
}*/


@media screen and (min-width: 1000px) {
.mw-page-container { 
    padding-left: 1em;
    padding-right: 1em; 
}
.mw-page-container-inner { 
    grid-template-columns: 20px minmax(0,1fr); 
}
}

/* maximum width of content (was 60em) */
.vector-feature-page-tools-disabled .mw-content-container, .vector-feature-page-tools-disabled .mw-table-of-contents-container {
    max-width: 80em;
}

/* cargo table */
button, input, optgroup, select, textarea {
    border: 1px solid grey;
}

table.dataTable tfoot th, table.dataTable tfoot td {
    display: none;
}


/* Home Grid Section*/
.home-grid {
	display: grid;
	grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) );
	/*grid-auto-rows: minmax( 3rem, auto );*/
	grid-gap: 0.625rem;
}

.home-grid--col2 {
	grid-template-columns: 1fr 1fr;
}

.home-grid a.external {
	background-image: none;
}

.home-card {
	position: relative;
	padding: 10px;
	background: var(--color-surface-2);
	border-radius: 4px;
        box-shadow: none;
	font-size: 0.875rem;
}

/*box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );*/


.home-card table.timeline {
	margin-top: 0.2rem;
}

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

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

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

.home-card--row8 {
	grid-row: span 8 / auto;
}

.home-card__label {
	font-size: 0.8125rem;
	letter-spacing: 0.75px;
    text-align: center;
}

h3.home-card__header {
	margin-top: 0;
	font-size: 1rem;
}

.home-card__header a {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.home-card__header a:after {
	content: '▶';
	font-size: 0.8125rem;
}

.home-card__background {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border-radius: 4px;
}

.home-card__background1 {
background: transparent;
}

.home-card__background2 {
background: transparent;
}

.home-card__background3 {
background: transparent;
}

.home-card__background4 {
background: transparent;
}

.home-card__background5 {
background: transparent;
}

.home-card__background6 {
background: transparent;
}


.home-card__background img {
	width: 100%;
	height: 100%;
	object-fit: scale-down;
	object-position: center;
	transition: transform 0.2s ease;
}

/*.home-card:hover .home-card__background img {
	transform: scale( 1.1 );
}*/

.home-card--button:hover {
    transform: scale( 1.05 );
}

.home-card__foreground {
	position: absolute;
}

.home-card__foreground .home-card__label {
	color: #bababa;
}

.home-card__foreground .home-card__header {
	color: #fff;
}

.home-card p {
	margin-top: 0.2rem;
	font-size: 0.875rem;
}

.home-card.home-card--button {
	overflow: hidden;
        padding: 5px 5px 10px 5px;
        height: 135px;
}

.home-card--button a {
	display: flex;
	height: 100%;
	align-items: center;
	padding: 0 15px;
	background: transparent;
	color: #fff;
	font-weight: 500;
}

.home-card--button .home-card__background a {
	padding: 0;
}


/* LinkBar CSS */
ul.hbmenu {
    display: flex;
    border-bottom: 1px solid #d3d7da;
    list-style: none;
    justify-content: space-around;
    margin: 10px 0px 10px 0px;
}


/* galley */
ul.gallery.mw-gallery-nolines {
    margin: 0px;
}

ul.mw-gallery-nolines li.gallerybox div.thumb {
    box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 0.1);
    margin-bottom: 5px;
}

div.gallerytext {
    color: none !important;
    font-size: inherit !important;
    font-style: normal !important;
}

div.gallerytext > pre {
    margin-top: -20px !important;
    font-family: inherit;
    color: gray;
    border: none;
    background: none;
    overflow: hidden;
}

Advertising: