MediaWiki:Common.css: Difference between revisions

From Blood in the Six
Jump to navigation Jump to search
(Created page with "→‎CSS placed here will be applied to all skins: @media only screen and (min-width: 80rem) { .hidel { display:none } } @media only screen and (max-width: 64rem) { .hidem { display:none } } @media only screen and (max-width: 48rem) { .hides { display:none } } .grid-container { display: grid; grid-template-areas: "header header header header header header" "middle middle middle middle middle right" "middle2 middl...")
 
No edit summary
 
(19 intermediate revisions by the same user not shown)
Line 61: Line 61:
.middle3 {
.middle3 {
     grid-area: middle3
     grid-area: middle3
}
.gridBG2 {
    background: #951e1e url(https://nightfall.nyc3.cdn.digitaloceanspaces.com/images/wiki/section-header.jpg) repeat left center;
}
a {
    text-decoration: none;
    color: #0645ad;
    background: none;
}
.mw-body h1, .mw-body-content h1, .mw-body-content h2 {
    margin-bottom: 0.25em;
    padding: 0;
    font-family: 'Linux Libertine', 'Georgia', 'Times', serif;
    line-height: 1.3;
}
.mw-body-content .plainlist ol, .mw-body-content .plainlist ul {
    line-height: inherit;
    list-style: none none;
    margin: 0;
}
.portable-infobox {
    box-sizing: border-box;
    margin: 0 0 1em 1em;
    padding: 2px;
    color: black;
    background-color: white;
    margin: 0 0 10px;
    margin-left: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}vertical-align: top;
}
.portable-infobox {
    --pi-background: var(--theme-page-background-color);
    --pi-secondary-background: var(--theme-accent-color);
    --pi-secondary-background--label: var(--theme-accent-label-color);
    --pi-border-color: rgba(var(--theme-accent-color--rgb), 0.5);
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    clear: right;
    float: right;
    margin: 0 0 18px 18px;
    width: 270px;
}
.portable-infobox.pi-theme-gridbg2 .pi-title, .portable-infobox.pi-theme-gridbg2 .pi-secondary-background, .portable-infobox.pi-theme-gridbg2 .pi-data-label {
    border: 1px dotted white;
    background-image: url(https://nightfall.nyc3.cdn.digitaloceanspaces.com/images/wiki/section-header.jpg);
    background-color: white;
}
.portable-infobox .pi-title, .portable-infobox .pi-secondary-background {
    color: white;
    text-align: center;
}
.portable-infobox .pi-item-spacing {
    padding: 1px 0 0;
    border: none;
}
.page-content .portable-infobox .pi-data-label {
    font-size: 12px;
    line-height: 1.5;
}
.page-content .portable-infobox h2, .page-content .portable-infobox h3 {
    border-bottom: 0;
    font-family: inherit;
    font-weight: 700;
    margin: 0;
}
.portable-infobox .pi-title, .portable-infobox .pi-data-label, .portable-infobox .pi-data-value {
    padding: 4px 10px;
}
.portable-infobox .pi-data-label {
    color: white;
    text-align: right;
    flex-basis: 120px;
    -ms-flex-preferred-size: 120px;
    -webkit-flex-basis: 120px;
    -moz-flex-basis: 120px;
}
.portable-infobox .pi-image-thumbnail {
    max-width: 100%;
    width: 100%;
    height: auto;
}
}

Latest revision as of 01:43, 2 April 2024

/* CSS placed here will be applied to all skins */
@media only screen and (min-width: 80rem) {
    .hidel {
        display:none
    }
}

@media only screen and (max-width: 64rem) {
    .hidem {
        display:none
    }
}

@media only screen and (max-width: 48rem) {
    .hides {
        display:none
    }
}

.grid-container {
    display: grid;
    grid-template-areas: "header header header header header header" "middle middle middle middle middle right" "middle2 middle2 middle2 middle2 middle2 right" "middle3 middle3 middle3 middle3 middle3 right" "bottom bottom bottom bottom bottom right"
}

@media only screen and (max-width: 80rem) {
    .grid-container {
        grid-template-areas:"header header header header header header" "middle middle middle middle right right" "middle2 middle2 middle2 middle2 right right " "middle3 middle3 middle3 middle3 middle3 middle3" "bottom bottom bottom bottom bottom bottom"
    }
}

@media only screen and (max-width: 64rem) {
    .grid-container {
        grid-template-areas:"header header header header header header" "middle middle middle middle middle middle" "middle2 middle2 middle2 middle2 middle2 middle2" "middle3 middle3 middle3 middle3 middle3 middle3" "right right right right right right" "bottom bottom bottom bottom bottom bottom"
    }
}

.header {
    grid-area: header
}

.bottom {
    grid-area: bottom
}

.left {
    grid-area: left
}

.right {
    grid-area: right
}

.middle {
    grid-area: middle
}

.middle2 {
    grid-area: middle2
}

.middle3 {
    grid-area: middle3
}

.gridBG2 {
    background: #951e1e url(https://nightfall.nyc3.cdn.digitaloceanspaces.com/images/wiki/section-header.jpg) repeat left center;
}

a {
    text-decoration: none;
    color: #0645ad;
    background: none;
}

.mw-body h1, .mw-body-content h1, .mw-body-content h2 {
    margin-bottom: 0.25em;
    padding: 0;
    font-family: 'Linux Libertine', 'Georgia', 'Times', serif;
    line-height: 1.3;
}

.mw-body-content .plainlist ol, .mw-body-content .plainlist ul {
    line-height: inherit;
    list-style: none none;
    margin: 0;
}

.portable-infobox {
    box-sizing: border-box;
    margin: 0 0 1em 1em;
    padding: 2px;
    color: black;
    background-color: white;
    margin: 0 0 10px;
    margin-left: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}vertical-align: top;
}

.portable-infobox {
    --pi-background: var(--theme-page-background-color);
    --pi-secondary-background: var(--theme-accent-color);
    --pi-secondary-background--label: var(--theme-accent-label-color);
    --pi-border-color: rgba(var(--theme-accent-color--rgb), 0.5);
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    clear: right;
    float: right;
    margin: 0 0 18px 18px;
    width: 270px;
}


.portable-infobox.pi-theme-gridbg2 .pi-title, .portable-infobox.pi-theme-gridbg2 .pi-secondary-background, .portable-infobox.pi-theme-gridbg2 .pi-data-label {
    border: 1px dotted white;
    background-image: url(https://nightfall.nyc3.cdn.digitaloceanspaces.com/images/wiki/section-header.jpg);
    background-color: white;
}

.portable-infobox .pi-title, .portable-infobox .pi-secondary-background {
    color: white;
    text-align: center;
}

.portable-infobox .pi-item-spacing {
    padding: 1px 0 0;
    border: none;
}
.page-content .portable-infobox .pi-data-label {
    font-size: 12px;
    line-height: 1.5;
}
.page-content .portable-infobox h2, .page-content .portable-infobox h3 {
    border-bottom: 0;
    font-family: inherit;
    font-weight: 700;
    margin: 0;
}
.portable-infobox .pi-title, .portable-infobox .pi-data-label, .portable-infobox .pi-data-value {
    padding: 4px 10px;
}
.portable-infobox .pi-data-label {
    color: white;
    text-align: right;
    flex-basis: 120px;
    -ms-flex-preferred-size: 120px;
    -webkit-flex-basis: 120px;
    -moz-flex-basis: 120px;
}

.portable-infobox .pi-image-thumbnail {
    max-width: 100%;
    width: 100%;
    height: auto;
}