MediaWiki:Pivot.css: Difference between revisions
From MEpedia, a crowd-sourced encyclopedia of ME and CFS science and history
(changed code per request) |
(added code per request) |
||
Line 280: | Line 280: | ||
white-space: pre-line; | white-space: pre-line; | ||
} | } | ||
/* Mobiles and tablets - smaller category banner */ | |||
@media (max-width: 768px) { | |||
h1 { | |||
font-size: 1.4rem; | |||
margin-top: 4px; | |||
margin-bottom: 4px; | |||
} | |||
h1 div, .firstHeading { | |||
font-size: 1.25rem; | |||
padding: 2px!important; | |||
margin-left:0; | |||
margin-right: 0; | |||
color: #333; | |||
text-shadow: none; | |||
} | |||
/* Mobiles and tablets (cont) - dismissable site notice - remove large gap on left to reduce the space it takes up, shrink top and bottom margins, reduce left margin on numbered lists */ | |||
.sitedir-ltr .mw-dismissable-notice-body { | |||
margin: 2px 4.5em 2px 0.5em; | |||
} | |||
.mw-dismissable-notice { | |||
font-size: 90%; | |||
} | |||
ul { | |||
padding-left: 0.25em; | |||
} | |||
ol { | |||
margin-left: 2em; | |||
} | |||
} | |||
/* end of mobile code */ |
Revision as of 17:31, September 3, 2020
/* normalize paragraphs, lists and tables to reduce margins */
p {
margin: 0 0 1em 0;
padding: 0;
}
table {
display: table;
overflow-x: visible;
margin: 0;
padding: 0;
}
td {
display: table-cell;
margin: 0;
padding: 0;
}
ul, ol {
padding: 0;
margin-top: 0.3em;
margin-bottom: 0;
}
/* Code by Notjusttired */
/* Custom colors - top bar MEActionRed */
.tab-bar {
background: #E7453A;
color: #FFF;
font-family: "Helvetica Neue", sans-serif;
font-weight:bold;
}
/* style the sidebar navigation labels */
ul.side-nav label {
background: #E7453A;
color: #fff;
padding: .25em .5em;
}
/* sidebar background color */
body {
background-color: #f2f2f2;
}
/* controls the main body area styling */
#p-cactions {
padding-top: 1.5em;
padding-bottom: .5em;
margin-left: 0;
margin-right:0;
background-color: #f6f6f6;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
}
/* pull out side bar icons MEAction grey */
ul.off-canvas-list li label {
background-color: #E7453A;
color: #FFF;
}
ul.off-canvas-list li a {
background-color: transparent;
color: #333333;
}
/* very light grey pull out side bar */
.right-off-canvas-menu, .left-off-canvas-menu {
background-color: #F6F6F6;
}
ul.off-canvas-list li a:hover {
background-color: #F6F6F6;
}
.side-nav li a:not(.button):hover, .side-nav li a:not(.button):focus {
background-color: #0BA7CD;
}
/* category button color dark grey */
h4.namespace.label {
background-color: #767c7e;
}
/* new code */
#p-cactions {
padding-left:5px;
padding-right:5px;
}
.center, text-center {
text-align: center;
}
/* paragraphs inside tables must not overwrite alignment */
th p, td p, th > p, td > p {
text-align: inherit;
}
/* gallery margins are zero on vector */
ul.gallery {
margin-left: 0;
margin-right: 0;
}
/* gallery image border */
div.thumb div {
margin: 0.5rem auto;
}
.gallerybox {
text-align: center;
}
/* Fit images to containers */
img, .thumb, .image {
max-width: 100%;
height: auto;
}
/* unless image is clicked on set max width */
.gallery > img, table > img, img {
max-width: 75%;
height: auto;
}
h1.mw-body-content {
font-size: 1.8rem; }
h2.mw-body-content, td.h2, th.h2 {
font-size: 1.375rem; }
h3.mw-body-content {
font-size: 1.25rem; }
h4.mw-body-content { font-size: 1.1rem;
font-weight: bold; }
h5.mw-body-content,
h6.mw-body-content,
h7.mw-body-content {
font-size: 1rem;
}
/* all visual editor classes not too wide */
div[class*=ve-ce] {
max-width: 100%;
draggable: true;
}
@media (min-width: 48em) {
div[class*=oo-ui-floatableElement] {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
zoom: 1;
left: 2em;
}
}
/* end of tested code */
/* Make Echo extension more mobile friendly on small widths including mobiles in landscape view */
@media only screen and (max-width: 750px) {
.oo-ui-popupWidget-popup {
width: auto !important;
position: relative !important;
margin-left: 10rem !important;
margin-right: 0!important;
left: auto;
right: 0.9rem;
font-size: 75% !important;
}
.oo-ui-clippableElement-clippable.oo-ui-popupWidget-body {
width: 100% !important;
right: 1.5rem;
}
}
/* make donate look like button */
#n-donate {
margin-left: 0.25em;
}
#n-donate a {
display:inline-block;
}
/* pre tag must wrap, also break crazily long words in lists and tables */
pre {
padding-left: 2em;
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap;
white-space: -o-pre-wrap;
word-wrap: normal;
}
/* break long citation urls */
.citation { word-wrap: break-word; }
/* mobiles: break crazily long words in lists and tables, using hyphens and keep broken items in same column, put columns closer together */
@media screen and (max-width: 500px) {
#mw-content, /* special pages */
td,
#mw-content-text li:not(.gallerybox) {
margin-left: 2px;
overflow-wrap: break-word;
word-wrap: break-word;
-webkit-column-gap: 2em;
-moz-column-gap: 2em;
column-gap: 2em;
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
}
/* Headings centered on other skins eg for home page contents */
table.wikitable > tr > th,
table.wikitable > * > tr > th {
text-align: left;
}
#footer-developers,
#footer-cookiestatement {
padding-right: 2rem;
display: inline;
text-align: center;
}
#footer-left,
#footer-places,
#footer-disclaimers,
#footer-privacypolicy,
#footer-about {
display: inline;
text-align: center;
}
/* removed powered by mediawiki - which has several different names oddly */
#footer-poweredbyico,
#footer-poweredby,
.poweredby {
display:none;
}
/* center block - won't overlap sidebar */
#footer-left {
display: inline-block;
width: 100%!important;
text-align: center;
padding-right:8px;
}
/* fix footer bleed by fixing negative margin */
footer { margin-left: 0!important; margin-right: 0!important; padding-right: 8px;}
/* Color code snippets incl for errors */
code {
background: #999;
background: rgba(204,204,204,0.9);
color: #000;
font-weight:bold;
}
.error code {
background-color: #fff;
color: #FF4444 !important;
}
/* allow scroll on tables */
table {
max-width: none;
overflow-x: auto;
display: block;
}
#p-cactions {
max-width: none;
}
/* end of tested code May 23 2019 */
#mw-normal-catlinks a.new {
color: #BA0000;
}
/* recent changes improvements for small screens */
.mw-enhancedchanges-arrow-space,
.mw-enhanced-rc-time,
.mw-changeslist-diff-cur {
white-space: normal;
}
.mw-changeslist-line-prefix,
.mw-enhanced-rc,
.mw-changeslist-line-inner,
.mw-enhanced-rc-nested {
white-space: pre-line;
}
/* Mobiles and tablets - smaller category banner */
@media (max-width: 768px) {
h1 {
font-size: 1.4rem;
margin-top: 4px;
margin-bottom: 4px;
}
h1 div, .firstHeading {
font-size: 1.25rem;
padding: 2px!important;
margin-left:0;
margin-right: 0;
color: #333;
text-shadow: none;
}
/* Mobiles and tablets (cont) - dismissable site notice - remove large gap on left to reduce the space it takes up, shrink top and bottom margins, reduce left margin on numbered lists */
.sitedir-ltr .mw-dismissable-notice-body {
margin: 2px 4.5em 2px 0.5em;
}
.mw-dismissable-notice {
font-size: 90%;
}
ul {
padding-left: 0.25em;
}
ol {
margin-left: 2em;
}
}
/* end of mobile code */