MediaWiki:Common.css: Difference between revisions

From DIY•wiki: the consumer resistance
 
No edit summary
 
(35 intermediate revisions by the same user not shown)
Line 1: Line 1:
/*
#ca-talk { display:none!important; }  /* Delete talk tab */
* This is the CSS for all desktop skins on en.Wikipedia.
#ca-nstab-main { display:none!important; } /* Delete pages tab */
* Styling inside .mw-parser-output should generally use TemplateStyles.
#ca-view { display: none !important; }  /* Delete read tab */
  */
#ca-history { display: none !important;} /* Delete view history tab */
/* Reset italic styling set by user agent */
#ca-viewsource { display: none !important; } /* Delete view source tab */
cite,
dfn {
font-style: inherit;
}
 
/* Straight quote marks for <q> */
q {
quotes: '"' '"' "'" "'";
}


/* Avoid collision of blockquote with floating elements by swapping margin and padding */
#p-tb { display: none; }  /* Remove Tools menu */
blockquote {
overflow: hidden;
margin: 1em 0;
padding: 0 40px;
}


/* Consistent size for <small>, <sub> and <sup> */
/* #footer-info { display: none; } */
small {
#footer-places-privacy { display: none; }
font-size: 85%;
#footer-places-about { display: none; }
}
#footer-places-disclaimer { display: none; }


.mw-body-content sub,
/* Sidebar */
.mw-body-content sup,
#mw-panel .portal a, #mw-panel .portal a:visited {font-size: 1.2em !important; }
span.reference /* for Parsoid */ {
font-size: 80%;
}


/* Same spacing for indented and unindented paragraphs on talk pages */
/* MediaWiki:Tagline */
.ns-talk .mw-body-content dd {
#siteSub {
margin-top: 0.4em;
display: inline;
margin-bottom: 0.4em;
font-size: 1.1em;
}
 
/* Reduce page jumps by hiding collapsed/dismissed content */
.client-js .mw-special-Watchlist #watchlist-message,
.client-js .collapsible:not( .mw-made-collapsible).collapsed > tbody > tr:not(:first-child),
 
/* Hide charinsert base for those not using the gadget */
#editpage-specialchars {
display: none;
}
 
/* Adds padding above Watchlist announcements where new recentchanges/watchlist filters are enabled */
.mw-rcfilters-enabled .mw-specialpage-summary {
margin-top: 1em;
}
 
/* Make the list of references smaller
* Keep in sync with Template:Refbegin/styles.css
* And Template:Reflist/styles.css
*/
ol.references {
font-size: 90%;
margin-bottom: 0.5em;
}
 
/* Styling for jQuery makeCollapsible, matching that of collapseButton */
.mw-parser-output .mw-collapsible-toggle:not(.mw-ui-button) {
font-weight: normal;
font-weight: normal;
/* @noflip */
font-style: italic; }
text-align: right;
padding-right: 0.2em;
padding-left: 0.2em;
}


.mw-collapsible-leftside-toggle .mw-collapsible-toggle {
/* Hide Tagline on Main Page */
/* @noflip */
body.page-Main_Page.action-view #siteSub,
float: left;
body.page-Main_Page.action-submit #siteSub {display: none;}
/* @noflip */
text-align: left;
}


/* Lists in wikitable data cells are always left-aligned */
/* Table of Contents */
.wikitable td ul,
#toc { width: 390px; font-size: 110%; }
.wikitable td ol,
.wikitable td dl {
/* @noflip */
text-align: left;
}


/* Fix for hieroglyphs specificity issue in infoboxes ([[phab:T43869]]) */
/* Page Title */
.mw-parser-output table.mw-hiero-table td {
.mw-body h1, .mw-body-content h1 { font-size: 200%; }
vertical-align: middle;
.mw-body h2, .mw-body-content h2 { font-size: 170%; }
}


/* Change the external link icon to a PDF icon for all PDF files */
/* Collapsible elements-Toggle-link move left, adjust margin
.mw-parser-output a[href$=".pdf"].external,
.mw-collapsible span.mw-collapsible-toggle {
.mw-parser-output a[href*=".pdf?"].external,
    float:left;
.mw-parser-output a[href*=".pdf#"].external,
    margin-left:0;
.mw-parser-output a[href$=".PDF"].external,
    margin-right:1em;
.mw-parser-output a[href*=".PDF?"].external,
}*/
.mw-parser-output a[href*=".PDF#"].external {
background: url("//upload.wikimedia.org/wikipedia/commons/4/4d/Icon_pdf_file.png") no-repeat right;
/* @noflip */
padding: 8px 18px 8px 0;
}


/* System messages styled similarly to fmbox */
* { box-sizing: border-box; }
div.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div#mw-protect-cascadeon,
div.titleblacklist-warning {
clear: both;
margin: 0.2em 0;
border: 1px solid #bb7070;
background-color: #ffdbdb;
padding: 0.25em 0.9em;
box-sizing: border-box;
}


/* default colors for partial block message */
#content p { font-size: 120%; line-height: 140%; }
.mw-contributions-blocked-notice-partial .mw-warning-with-logexcerpt {
border-color: #fc3;
background-color: #fef6e7;
}


/* Increase the height of the image upload box */
li .active { font-weight: bold; }  
#wpUploadDescription {
height: 13em;
}


/* Minimum thumb width */
h2 { font-size: 150%; }
.thumbinner {
min-width: 100px;
}


/* Prevent floating boxes from overlapping any category listings,
audio { width:200px; }
  file histories, edit previews, and edit [Show changes] views. */
#mw-subcategories,
#mw-pages,
#mw-category-media,
#filehistory,
#wikiPreview,
#wikiDiff {
clear: both;
}


/* Styling for Abuse Filter tags */
figure.fig { padding: 0; margin: 12px 0 0 0; line-height: normal; }
.mw-tag-markers {
font-style: italic;
font-size: 90%;
}


/* Hide stuff meant for accounts with special permissions. Made visible again in
.red { color: red; font-size: 18pt; }
  [[MediaWiki:Group-checkuser.css]], [[MediaWiki:Group-sysop.css]], [[MediaWiki:Group-abusefilter.css]],
  [[MediaWiki:Group-abusefilter-helper.css]], [[MediaWiki:Group-patroller.css]],
  [[MediaWiki:Group-templateeditor.css]], [[MediaWiki:Group-extendedmover.css]],
  [[MediaWiki:Group-extendedconfirmed.css]], and [[Mediawiki:Group-autoconfirmed.css]]. */
.checkuser-show,
.sysop-show,
.abusefilter-show,
.abusefilter-helper-show,
.patroller-show,
.templateeditor-show,
.extendedmover-show,
.extendedconfirmed-show,
.autoconfirmed-show,
.user-show {
display: none;
}


/* Hide the redlink generated by {{Editnotice}},
.welcome {  
   this overrides the ".sysop-show { display: none; }" above that applies
   display: flex;
   to the same link as well. See [[phab:T45013]]
  flex: 1;
  background-position: center;
  background-image: url("https://dstall.com/DIY/M/P/DIY.jpg");
  background-repeat: repeat-x;
   padding: 0.1em;
  margin: 0 0 5px 0;
  text-align: center;
  font-size: 162%;
  border: 1px solid #ddd; }


  Hide the images in editnotices to keep them readable in VE view.
.box { display: flex; flex-wrap: wrap; width: 100%; padding: 0; }
  Long term, editnotices should become a core feature so that they can be designed responsive. */
.ve-ui-mwNoticesPopupTool-item .editnotice-redlink,
.ve-ui-mwNoticesPopupTool-item .mbox-image,
.ve-ui-mwNoticesPopupTool-item .mbox-imageright {
display: none !important;
}


/* Remove bullets when there are multiple edit page warnings */
.col { margin-bottom: 5px !important; text-align: left; padding: 10px; }
ul.permissions-errors {
margin: 0;
}


ul.permissions-errors > li {
.pix { flex: 1 1 0; padding: 5px; border: 1px solid #aaa; font-size: 90%; line-height: 110% !important; }
list-style: none none;
.pix2 { flex: 1 1 0; padding: 5px; border: 1px solid #aaa; font-size: 86%; line-height: 110% !important; }
}
.pix3 { flex: 1 1 0; padding: 5px; border: 1px solid #aaa !important; font-size: 50% !important; line-height: 90% !important; }
.image img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 1 / 1; margin-bottom: 5px; }
.image2 img { width: 61%; height: 61%; object-fit: scale-down !important; margin-bottom: 5px; }
.image3 img { width: 100%; height: auto; object-fit: fill; aspect-ratio: 1 / 1; margin-bottom: 5px; }
.image4 img { width: 100%; height: auto; object-fit: contain !important; margin-bottom: 5px; }
.image5 img { width: 100%; height: 100%; object-fit: contain !important; margin-bottom: 5px; }
.image6 img { width: 900px; height: 600px; object-fit: cover !important; margin-bottom: 5px; }
.top1 img { object-position: top !important; }
.top2 img { object-position: 0 20% !important; }
.top3 img { object-position: -100px 0 !important; }
.bottom img { object-position: bottom !important; }  


/* larger inline math */
.aud { height: auto; width: 215px; font-size: 85%; line-height: 100%; padding: 0px 5px 5px 5px; border: 1px solid #aaa; }
span.mwe-math-mathml-inline {
.aud2 { height: auto; width: 140px; font-size: 85%; line-height: 100%; padding: 5px; border: 1px solid #aaa; }
font-size: 118%;
.vid { font-size: 0.9em; line-height: 105% !important; padding: 5px; border: 1px solid #aaa; }
}
.vid2 { height: 100% !important; font-size: 0.9em; line-height: 105% !important; padding: 5px; border: 1px solid #aaa !important; }
.left { float: left; }
.right { float: right; }


/* Make <math display="block"> be left aligned with one space indent for  
.vid_wrap { position: relative; padding-bottom: 56.25%; /* 16:9, for 1:1 change to 100% */ }
* compatibility with style conventions
.vid_wrap2 { position: relative; padding-bottom: 100%; /* 16:9, for 1:1 change to 100% */ }
*/
iframe.video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.mwe-math-fallback-image-display,
.mwe-math-mathml-display {
margin-left: 1.6em !important;
margin-top: 0.6em;
margin-bottom: 0.6em;
}


.mwe-math-mathml-display math {
.box.margin-t { margin-top: 7px !important; }
display: inline;
.box.margin-b { margin-bottom: 7px !important; }
}
.box.margin-l { margin-left: 5px !important; }
.box.margin-r { margin-right: 10px !important; }


@media screen {
.pix.margin-t { margin-top: 5px; }  
/* Gallery styles background changes are restricted to screen view.
.pix.margin-b { margin-bottom: 5px; }
  In printing we should avoid applying backgrounds. */
.pix.margin-l { margin-left: 5px; }  
/* The backgrounds for galleries. */
.pix.margin-r { margin-right: 5px; }
#content .gallerybox div.thumb {
.image2.margin-l { margin-left: 5px; }
/* Light gray padding */
background-color: #f8f9fa;
}
/* Put a chequered background behind images, only visible if they have transparency.
  '.filehistory a img' and '#file img:hover' are handled by MediaWiki core (as of 1.19) */
.gallerybox .thumb img {
background: #fff url(//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png) repeat;
}
/* But not on articles, user pages, or portals. */
.ns-0 .gallerybox .thumb img,
.ns-2 .gallerybox .thumb img,
.ns-100 .gallerybox .thumb img {
background-image: none;
}


/* Display "From Wikipedia, the free encyclopedia" in skins that support it,
.aud.margin-t { margin-top: 7px; }
  do not apply to print mode */
.aud.margin-b { margin-bottom: 7px; }
#siteSub {
.aud.margin-l { margin-left: 10px; }
display: block;
.aud.margin-r { margin-right: 10px; }
}
}


/* Hide FlaggedRevs notice UI when there are no pending changes */
.vid.margin-t { margin-top: 7px; }
.flaggedrevs_draft_synced,
.vid.margin-b { margin-bottom: 7px; }
.flaggedrevs_stable_synced,
.vid.margin-l { margin-left: 10px; }
/* "Temporary" to remove links in sidebar T255381 */
.vid.margin-l2 { margin-left: 5px; }
#t-upload,
.vid.margin-r { margin-right: 10px; }
/* Hide broken download box on Special:Book pending T285400 */
.mw-special-Book #coll-downloadbox {
display: none;
}


/*
.margin-t { margin-top: 5px; }
* BELOW HERE THERE BE SOONTOBE TEMPLATESTYLES THINGS;
.margin-t2 { margin-top: 10px; }
* SEE [[MediaWiki talk:Common.css/to do]]
.margin-b { margin-bottom: 7px; }
*/
.margin-l { margin-right: 5px; }
.margin-r { margin-right: 5px; }


/* Style for horizontal lists (separator following item).
size1 { display: block; width: 57%; margin-left: auto; margin-right: auto; text-align: center; }
  @source mediawiki.org/wiki/Snippets/Horizontal_lists
.one { width: 100%; }
  @revision 8 (2016-05-21)
.two { width: 50% }
  @author [[User:Edokter]]
.three { width: 33%; }
*/
.four { width: 25%; }
.hlist dl,
.five { width: 20%; }
.hlist ol,
.six { width: 16.7%; }
.hlist ul {
.seven { width: 14.3%; }
margin: 0;
.eight { width: 12.5%; }
padding: 0;
.nine { width: 11.1%; }
}
.ten { width: 10%; }
.main { width: 45.75%; }


/* Display list items inline */
.full { float: left; display: block; box-sizing: border-box;
.hlist dd,
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; width:
.hlist dt,
100%; }
.hlist li {
margin: 0; /* don't trust the note that says margin doesn't work with inline
* removing margin: 0 makes dds have margins again */
display: inline;
}


/* Display nested lists inline */
.left1 { flex: 3 0 0; background: #f5fffa; margin-right: 5px; border: 1px solid #cef2e0; }
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl,
.hlist dl ol,
.hlist dl ul,
.hlist ol dl,
.hlist ol ol,
.hlist ol ul,
.hlist ul dl,
.hlist ul ol,
.hlist ul ul {
display: inline;
}


/* Hide empty list items */
.right2 { flex: 1 0 0; background: #f5faff; border: 1px solid #cedff2; font-size: 110%; line-height: 115%; }
.hlist .mw-empty-li {
display: none;
}


/* Generate interpuncts */
.left3 { flex: 1 0 0; width: 33%; background: #fff5fa; margin-right: 5px; border: 1px solid #f2cedd; font-size: 105%; line-height: 115%; }
.hlist dt:after {
content: ": ";
}


/**
.center4 { flex: 1 0 0; width: 33%; background: #faf5ff; margin-right: 5px; border: 1px solid #ddcef2; font-size: 105%; line-height: 115%; }
* Note hlist style usage differs in Minerva and is defined in core as well!
* Please check Minerva desktop (and Minerva.css) when changing
* See https://phabricator.wikimedia.org/T213239
*/
.hlist dd:after,
.hlist li:after {
content: " · ";
font-weight: bold;
}


.hlist dd:last-child:after,
.right5 { flex: 1 0 0; width: 33%; background: ; margin: 0; border: 1px solid #eee; font-size: 105%; line-height: 115%; }
.hlist dt:last-child:after,
.hlist li:last-child:after {
content: none;
}


/* Add parentheses around nested lists */
.left6 { width: 100%; background: ; border: 1px solid #eee; font-size: 105%; line-height: 115%; }  
.hlist dd dd:first-child:before,
.hlist dd dt:first-child:before,
.hlist dd li:first-child:before,
.hlist dt dd:first-child:before,
.hlist dt dt:first-child:before,
.hlist dt li:first-child:before,
.hlist li dd:first-child:before,
.hlist li dt:first-child:before,
.hlist li li:first-child:before {
content: " (";
font-weight: normal;
}


.hlist dd dd:last-child:after,
.title {
.hlist dd dt:last-child:after,
  display: block;
.hlist dd li:last-child:after,
  box-sizing: border-box;
.hlist dt dd:last-child:after,
  -webkit-box-sizing: border-box;
.hlist dt dt:last-child:after,
  -moz-box-sizing: border-box; }
.hlist dt li:last-child:after,
.hlist li dd:last-child:after,
.hlist li dt:last-child:after,
.hlist li li:last-child:after {
content: ")";
font-weight: normal;
}
 
/* Put ordinals in front of ordered list items */
.hlist ol {
counter-reset: listitem;
}
 
.hlist ol > li {
counter-increment: listitem;
}
 
.hlist ol > li:before {
content: " " counter(listitem) "\a0";
}


.hlist dd ol > li:first-child:before,
.title1 { line-height: 100%; font-size: 1.3em; background: #cef2e0; border: none; padding: 3px 0; }
.hlist dt ol > li:first-child:before,
.title2 { line-height: 100%; font-size: 1.2em; background: #cedff2; border: none; padding: 3px 0; margin-bottom: 10px; }
.hlist li ol > li:first-child:before {
.title3 { line-height: 100%; font-size: 1.3em; background: #f2cedd; border: none; padding: 3px 0; margin-bottom: 10px; }
content: " (" counter(listitem) "\a0";
.title4 { line-height: 100%; font-size: 1.3em; background: #ddcef2; border: none; padding: 3px 0; margin-bottom: 10px; }
}
.title5 { line-height: 100%; font-size: 1.3em; background: #eee; border: none; padding: 3px 0; margin-bottom: 10px; }
.title6 { line-height: 100%; font-size: 1.3em; background: #eee8aa; border: none; padding: 3px 0; margin-bottom: 10px; }


/* Unbulleted lists */
.plainlist ol,
.plainlist ul {
line-height: inherit;
list-style: none none;
margin: 0;
}
.plainlist ol li,
.plainlist ul li {
margin-bottom: 0;
}
/* Infobox template style */
.infobox {
.infobox {
border: 1px solid #a2a9b1;
    font-size: 100%;
border-spacing: 3px;
    border: solid 1px #aaa;
background-color: #f8f9fa;
    float: right;
color: black;
    margin: 0 0 1em 1em;
/* @noflip */
    padding: 10px;  
margin: 0.5em 0 0.5em 1em;
    width: 300px; }
padding: 0.2em;
/* @noflip */
float: right;
/* @noflip */
clear: right;
font-size: 88%;
line-height: 1.5em;
width: 22em;
}


.infobox-header,
.infobox p {
.infobox-label,
    font-size: 100%;
.infobox-above,
    font-family: serif;
.infobox-full-data,
    padding: 0; margin: 0;
.infobox-data,
    border-bottom: 1px solid #aaa;
.infobox-below,
    width: 100%;
.infobox-subheader,
    display: block; }
.infobox-image,
.infobox-navbar,
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox th,
.infobox td {
vertical-align: top;
}


.infobox-label,
.infobox li, .infobox ul {padding 0; margin: 0;}
.infobox-data,
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox th,
.infobox td {
/* @noflip */
text-align: left;
}


/* Remove .infobox when element selectors above are removed */
.hole { font-size: 1.1em; font-family: "Times New Roman", Times, serif; }
.infobox .infobox-above,
.infobox .infobox-title,
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox caption {
font-size: 125%;
font-weight: bold;
text-align: center;
}


.infobox-title,
#pageTree, #pageTree li, #pageTree ul {padding 0; margin: 0; }
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox caption {
padding: 0.2em;
}


/* Remove .infobox when element selectors above are removed */
/* NAV_pageTree */
.infobox .infobox-header,
.infobox .infobox-subheader,
.infobox .infobox-image,
.infobox .infobox-full-data,
.infobox .infobox-below {
text-align: center;
}


/* Remove .infobox when element selectors above are removed */
ul.custom, ul.custom > li {
.infobox .infobox-navbar {
    list-style-type: none;
/* @noflip */
    padding: 0px;
text-align: right;
    margin: 0; }
}
ul.customUL > li.tree { padding-left: 19px; }


/* Normal font styling for wikitable row headers with scope="row" tag */
.tree{ --spacing : 1.2rem; --radius  : 8px; }
.wikitable.plainrowheaders th[scope=row],
.wikitable.plainrowheaders th[scope=rowgroup] {
font-weight: normal;
/* @noflip */
text-align: left;
}


/* ambox/tmbox/imbox/cmbox/ombox/fmbox message boxes */
.tree li{
th.mbox-text,
   display      : block;
td.mbox-text {   /* The message body cell(s) */
  position    : relative;
border: none;
  padding-left : calc(2 * var(--spacing) - var(--radius) - 2px); }
/* @noflip */
padding: 0.25em 0.9em;    /* 0.9em left/right */
width: 100%;               /* Make all mboxes the same width regardless of text length */
}


td.mbox-image {                /* The left image cell */
.tree ul{ margin-left : calc(var(--radius) - var(--spacing)); padding-left : 0; }
border: none;
/* @noflip */
padding: 2px 0 2px 0.9em;  /* 0.9em left, 0px right */
text-align: center;
}


td.mbox-imageright {           /* The right image cell */
.tree ul li{ border-left : 2px solid #ddd; }
border: none;
/* @noflip */
padding: 2px 0.9em 2px 0;  /* 0px left, 0.9em right */
text-align: center;
}


td.mbox-empty-cell {           /* An empty narrow cell */
.tree ul li:last-child{ border-color : transparent; }
border: none;
padding: 0;
width: 1px;
}


/* Article message box styles */
.tree ul li::before{
table.ambox {
  content      : '';
margin: 0 10%;                 /* 10% = Will not overlap with other elements */
  display      : block;
border: 1px solid #a2a9b1;
  position    : absolute;
/* @noflip */
  top          : calc(var(--spacing) / -2);
border-left: 10px solid #36c; /* Default "notice" blue */
  left        : -2px;
background-color: #fbfbfb;
  width        : calc(var(--spacing) + 2px);
box-sizing: border-box;
  height      : calc(var(--spacing) + 1px);
}
  border      : solid #ddd;
  border-width : 0 0 2px 2px; }


/* Single border between stacked boxes. */
.tree summary{ display : block; cursor : pointer; }
table.ambox + table.ambox,
table.ambox + .mw-empty-elt + table.ambox {
margin-top: -1px;
}


.ambox th.mbox-text,
.tree summary::marker,
.ambox td.mbox-text {           /* The message body cell(s) */
.tree summary::-webkit-details-marker{ display : none; }
padding: 0.25em 0.5em;       /* 0.5em left/right */
}


.ambox td.mbox-image {           /* The left image cell */
.tree summary:focus{ outline : none; }
/* @noflip */
padding: 2px 0 2px 0.5em;   /* 0.5em left, 0px right */
}


.ambox td.mbox-imageright {     /* The right image cell */
.tree summary:focus-visible{ outline : 1px dotted #000; }
/* @noflip */
padding: 2px 0.5em 2px 0;   /* 0px left, 0.5em right */
}


table.ambox-notice {
.tree li::after,
/* @noflip */
.tree summary::before{
border-left: 10px solid #36c;       /* Blue */
  content      : '';
}
  display      : block;
  position      : absolute;
  top          : calc(var(--spacing) / 2 - var(--radius));
  left          : calc(var(--spacing) - var(--radius) - 1px);
  width        : calc(2 * var(--radius));
  height        : calc(2 * var(--radius));
  border-radius : 50%;
  background    : #ddd; }


table.ambox-speedy {
.tree summary::before{
/* @noflip */
  content    : '+';
border-left: 10px solid #b32424;   /* Red */
  z-index    : 1;
background-color: #fee7e6;         /* Pink */
  background  : #999;
}
  color       : #fff;
  line-height : calc(2 * var(--radius) - 2px);
  text-align  : center; }


table.ambox-delete {
.tree details[open] > summary::before{ content : '−'; }
/* @noflip */
border-left: 10px solid #b32424;   /* Red */
}


table.ambox-content {
/* Lists in wikitable data cells are always left-aligned */
.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
/* @noflip */
/* @noflip */
border-left: 10px solid #f28500;   /* Orange */
text-align: left; }
}


table.ambox-style {
/* Normal font styling for wikitable row headers with scope="row" tag */
/* @noflip */
.wikitable { line-height: 138%; }
border-left: 10px solid #fc3;       /* Yellow */
.wikitable.plainrowheaders th[scope=row],
}
.wikitable.plainrowheaders th[scope=rowgroup] {
 
font-weight: normal;
table.ambox-move {
/* @noflip */
/* @noflip */
border-left: 10px solid #9932cc;    /* Purple */
text-align: left; }
}
 
table.ambox-protection {
/* @noflip */
border-left: 10px solid #a2a9b1;    /* Gray-gold */
}
 
/* Image message box styles */
table.imbox {
margin: 4px 10%;
border-collapse: collapse;
border: 3px solid #36c;    /* Default "notice" blue */
background-color: #fbfbfb;
box-sizing: border-box;
}
 
.imbox .mbox-text .imbox {  /* For imboxes inside imbox-text cells. */
margin: 0 -0.5em;      /* 0.9 - 0.5 = 0.4em left/right.        */
display: block;        /* Fix for webkit to force 100% width.  */
}
 
.mbox-inside .imbox {      /* For imboxes inside other templates.  */
margin: 4px;
}
 
table.imbox-notice {
border: 3px solid #36c;      /* Blue */
}
 
table.imbox-speedy {
border: 3px solid #b32424;    /* Red */
background-color: #fee7e6;    /* Pink */
}
 
table.imbox-delete {
border: 3px solid #b32424;    /* Red */
}
 
table.imbox-content {
border: 3px solid #f28500;    /* Orange */
}
 
table.imbox-style {
border: 3px solid #fc3;      /* Yellow */
}
 
table.imbox-move {
border: 3px solid #9932cc;    /* Purple */
}
 
table.imbox-protection {
border: 3px solid #a2a9b1;    /* Gray-gold */
}
 
table.imbox-license {
border: 3px solid #88a;      /* Dark gray */
background-color: #f7f8ff;   /* Light gray */
}


table.imbox-featured {
/* audio{width: 100px !important;}
border: 3px solid #cba135;   /* Brown-gold */
audio::-webkit-media-controls-play-button{background-color:#ee7666 !important;}
}
audio::-webkit-media-controls-panel{background-color:#ee7666 !important;}
audio::-webkit-media-controls-current-time-display{display:none !important;}
audio::-webkit-media-controls-current-time-display{display:none !important;}
audio::-webkit-media-controls-time-remaining-display{display:none !important;}
audio::-webkit-media-controls-timeline{display:none !important;}
audio::-webkit-media-controls-mute-button{display:none !important;} */


/* Category message box styles */
table.cmbox {
margin: 3px 10%;
border-collapse: collapse;
border: 1px solid #a2a9b1;
background-color: #dfe8ff;    /* Default "notice" blue */
box-sizing: border-box;
}


table.cmbox-notice {
/* [[phab:T293232]] - Mobile doesn't have this style.
background-color: #d8e8ff;    /* Blue */
* Will be fixed with TStyles. */
}
div.hlist.inline ul,
div.hlist.inline li,
div.hlist.inline {display: inline;}


table.cmbox-speedy {
/* Responsive layout - screen less than 700px wide, make columns stack */
margin-top: 4px;
@media screen and (max-width: 700px) {
margin-bottom: 4px;
  .pix, .left1, .right2, .left3, .center4, .right5 { 
border: 4px solid #b32424;    /* Red */
    flex-direction: column;
background-color: #ffdbdb;   /* Pink */
  }
.pix, .col.left1, .col.right2, .col.left3, .col.center4, .col.right5 {
    flex: 1 1 100%;
}
}
table.cmbox-delete {
background-color: #ffdbdb;    /* Pink */
}
}
table.cmbox-content {
background-color: #ffe7ce;    /* Orange */
}
table.cmbox-style {
background-color: #fff9db;    /* Yellow */
}
table.cmbox-move {
background-color: #e4d8ff;    /* Purple */
}
table.cmbox-protection {
background-color: #efefe1;    /* Gray-gold */
}
/* Other pages message box styles */
table.ombox {
margin: 4px 10%;
border-collapse: collapse;
border: 1px solid #a2a9b1;    /* Default "notice" gray */
background-color: #f8f9fa;
box-sizing: border-box;
}
table.ombox-notice {
border: 1px solid #a2a9b1;    /* Gray */
}
table.ombox-speedy {
border: 2px solid #b32424;    /* Red */
background-color: #fee7e6;    /* Pink */
}
table.ombox-delete {
border: 2px solid #b32424;    /* Red */
}
table.ombox-content {
border: 1px solid #f28500;    /* Orange */
}
table.ombox-style {
border: 1px solid #fc3;      /* Yellow */
}
table.ombox-move {
border: 1px solid #9932cc;    /* Purple */
}
table.ombox-protection {
border: 2px solid #a2a9b1;    /* Gray-gold */
}
/* Talk page message box styles */
table.tmbox {
margin: 4px 10%;
border-collapse: collapse;
border: 1px solid #c0c090;    /* Default "notice" gray-brown */
background-color: #f8eaba;
min-width: 80%;
box-sizing: border-box;
}
.tmbox.mbox-small {
min-width: 0;                /* reset the min-width of tmbox above        */
}
.mediawiki .mbox-inside .tmbox { /* For tmboxes inside other templates. The "mediawiki" class ensures that */
margin: 2px 0;              /* this declaration overrides other styles (including mbox-small above)  */
width: 100%;                /* For Safari and Opera */
}
.mbox-inside .tmbox.mbox-small { /* "small" tmboxes should not be small when  */
line-height: 1.5em;          /* also "nested", so reset styles that are  */
font-size: 100%;            /* set in "mbox-small" above.                */
}
table.tmbox-speedy {
border: 2px solid #b32424;    /* Red */
background-color: #fee7e6;    /* Pink */
}
table.tmbox-delete {
border: 2px solid #b32424;    /* Red */
}
table.tmbox-content {
border: 2px solid #f28500;    /* Orange */
}
table.tmbox-style {
border: 2px solid #fc3;      /* Yellow */
}
table.tmbox-move {
border: 2px solid #9932cc;    /* Purple */
}
table.tmbox-protection,
table.tmbox-notice {
border: 1px solid #c0c090;    /* Gray-brown */
}
/* Footer and header message box styles */
table.fmbox {
clear: both;
margin: 0.2em 0;
width: 100%;
border: 1px solid #a2a9b1;
background-color: #f8f9fa;    /* Default "system" gray */
box-sizing: border-box;
}
table.fmbox-system {
background-color: #f8f9fa;
}
table.fmbox-warning {
border: 1px solid #bb7070;  /* Dark pink */
background-color: #ffdbdb;  /* Pink */
}
table.fmbox-editnotice {
background-color: transparent;
}
/* These mbox-small classes must be placed after all other
  ambox/tmbox/ombox etc classes. "html body.mediawiki" is so
  they override "table.ambox + table.ambox" above. */
html body.mediawiki .mbox-small {  /* For the "small=yes" option. */
/* @noflip */
clear: right;
/* @noflip */
float: right;
/* @noflip */
margin: 4px 0 4px 1em;
box-sizing: border-box;
width: 238px;
font-size: 88%;
line-height: 1.25em;
}
html body.mediawiki .mbox-small-left {  /* For the "small=left" option. */
/* @noflip */
margin: 4px 1em 4px 0;
box-sizing: border-box;
overflow: hidden;
width: 238px;
border-collapse: collapse;
font-size: 88%;
line-height: 1.25em;
}
/* Remove underlines from certain links */
.nounderlines a,
.IPA a:link,
.IPA a:visited {
text-decoration: none !important;
}
/* Prevent line breaks in silly places where desired (nowrap)
  and links when we don't want them to (nowraplinks a) */
.nowrap,
.nowraplinks a {
white-space: nowrap;
}
/* But allow wrapping where desired: */
.wrap,
.wraplinks a {
white-space: normal;
}
/* Selectively hide headers in WikiProject banners */
/* TemplateStyles */
.wpb .wpb-header {
display: none;
}
.wpbs-inner .wpb .wpb-header {
display: table-row;
}
.wpbs-inner .wpb-outside {
display: none;            /* hide things that should only display outside shells */
}
/* texhtml class for inline math (based on generic times-serif class) */
span.texhtml {
font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
font-size: 118%;
line-height: 1;
white-space: nowrap;
/* Force tabular and lining display for texhtml */
-webkit-font-feature-settings: "lnum", "tnum", "kern" 0;
font-feature-settings: "lnum", "tnum", "kern" 0;
font-variant-numeric: lining-nums tabular-nums;
font-kerning: none;
}
span.texhtml span.texhtml {
font-size: 100%;
}
@media screen {
.nochecker .gallerybox .thumb img {
background-image: none;
}
}
/* Put anything you mean to be a sitewide addition above the TemplateStyles
* comment above.
*/

Latest revision as of 16:37, 19 September 2024

#ca-talk { display:none!important; }  /* Delete talk tab */
#ca-nstab-main { display:none!important; }  /* Delete pages tab */
#ca-view { display: none !important; }  /* Delete read tab */
#ca-history { display: none !important;}  /* Delete view history tab */
#ca-viewsource { display: none !important; }  /* Delete view source tab */

#p-tb { display: none; }  /* Remove Tools menu */

/* #footer-info { display: none; } */
#footer-places-privacy { display: none; }
#footer-places-about { display: none; }
#footer-places-disclaimer { display: none; }

/* Sidebar */
#mw-panel .portal a, #mw-panel .portal a:visited {font-size: 1.2em !important; }

/* MediaWiki:Tagline */
#siteSub {
	display: inline;
	font-size: 1.1em;
	font-weight: normal;
	font-style: italic; }

/* Hide Tagline on Main Page */
body.page-Main_Page.action-view #siteSub,
body.page-Main_Page.action-submit #siteSub {display: none;}

/* Table of Contents */
#toc { width: 390px; font-size: 110%; }

/* Page Title */
.mw-body h1, .mw-body-content h1 { font-size: 200%; }
.mw-body h2, .mw-body-content h2 { font-size: 170%; }

/* Collapsible elements-Toggle-link move left, adjust margin 
.mw-collapsible span.mw-collapsible-toggle {
    float:left;
    margin-left:0;
    margin-right:1em;
}*/

* { box-sizing: border-box; }

#content p { font-size: 120%; line-height: 140%; }

li .active { font-weight: bold; } 

h2 { font-size: 150%; }

audio { width:200px; }

figure.fig { padding: 0; margin: 12px 0 0 0; line-height: normal; }

.red { color: red; font-size: 18pt; }

.welcome { 
   display: flex;
   flex: 1;
   background-position: center;
   background-image: url("https://dstall.com/DIY/M/P/DIY.jpg");
   background-repeat: repeat-x;
   padding: 0.1em;
   margin: 0 0 5px 0;
   text-align: center;
   font-size: 162%;
   border: 1px solid #ddd; }

.box { display: flex; flex-wrap: wrap; width: 100%; padding: 0; }

.col { margin-bottom: 5px !important; text-align: left; padding: 10px; }

.pix { flex: 1 1 0; padding: 5px; border: 1px solid #aaa; font-size: 90%; line-height: 110% !important; } 
.pix2 { flex: 1 1 0; padding: 5px; border: 1px solid #aaa; font-size: 86%; line-height: 110% !important; } 
.pix3 { flex: 1 1 0; padding: 5px; border: 1px solid #aaa !important; font-size: 50% !important; line-height: 90% !important; }
.image img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 1 / 1; margin-bottom: 5px; }
.image2 img { width: 61%; height: 61%; object-fit: scale-down !important; margin-bottom: 5px; }
.image3 img { width: 100%; height: auto; object-fit: fill; aspect-ratio: 1 / 1; margin-bottom: 5px; }
.image4 img { width: 100%; height: auto; object-fit: contain !important; margin-bottom: 5px; }
.image5 img { width: 100%; height: 100%; object-fit: contain !important; margin-bottom: 5px; }
.image6 img { width: 900px; height: 600px; object-fit: cover !important; margin-bottom: 5px; }
.top1 img { object-position: top !important; } 
.top2 img { object-position: 0 20% !important; }
.top3 img { object-position: -100px 0 !important; }
.bottom img { object-position: bottom !important; } 

.aud { height: auto; width: 215px; font-size: 85%; line-height: 100%; padding: 0px 5px 5px 5px; border: 1px solid #aaa; } 
.aud2 { height: auto; width: 140px; font-size: 85%; line-height: 100%; padding: 5px; border: 1px solid #aaa; } 
.vid { font-size: 0.9em; line-height: 105% !important; padding: 5px; border: 1px solid #aaa; } 
.vid2 { height: 100% !important; font-size: 0.9em; line-height: 105% !important; padding: 5px; border: 1px solid #aaa !important; } 
.left { float: left; } 
.right { float: right; }

.vid_wrap { position: relative; padding-bottom: 56.25%; /* 16:9, for 1:1 change to 100% */ } 
.vid_wrap2 { position: relative; padding-bottom: 100%; /* 16:9, for 1:1 change to 100% */ } 
iframe.video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.box.margin-t { margin-top: 7px !important; } 
.box.margin-b { margin-bottom: 7px !important; } 
.box.margin-l { margin-left: 5px !important; } 
.box.margin-r { margin-right: 10px !important; }

.pix.margin-t { margin-top: 5px; } 
.pix.margin-b { margin-bottom: 5px; } 
.pix.margin-l { margin-left: 5px; } 
.pix.margin-r { margin-right: 5px; } 
.image2.margin-l { margin-left: 5px; }

.aud.margin-t { margin-top: 7px; }
.aud.margin-b { margin-bottom: 7px; }
.aud.margin-l { margin-left: 10px; }
.aud.margin-r { margin-right: 10px; }

.vid.margin-t { margin-top: 7px; }
.vid.margin-b { margin-bottom: 7px; }
.vid.margin-l { margin-left: 10px; }
.vid.margin-l2 { margin-left: 5px; }
.vid.margin-r { margin-right: 10px; }

.margin-t { margin-top: 5px; } 
.margin-t2 { margin-top: 10px; }
.margin-b { margin-bottom: 7px; }
.margin-l { margin-right: 5px; }
.margin-r { margin-right: 5px; }

size1 { display: block; width: 57%; margin-left: auto; margin-right: auto; text-align: center; }
.one { width: 100%; } 
.two { width: 50% } 
.three { width: 33%; } 
.four { width: 25%; } 
.five { width: 20%; } 
.six { width: 16.7%; } 
.seven { width: 14.3%; } 
.eight { width: 12.5%; }
.nine { width: 11.1%; }
.ten { width: 10%; }
.main { width: 45.75%; }

.full { float: left; display: block; box-sizing: border-box;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; width:
100%; }

.left1 { flex: 3 0 0; background: #f5fffa; margin-right: 5px; border: 1px solid #cef2e0; }

.right2 { flex: 1 0 0; background: #f5faff; border: 1px solid #cedff2; font-size: 110%; line-height: 115%; }

.left3 { flex: 1 0 0; width: 33%; background: #fff5fa; margin-right: 5px; border: 1px solid #f2cedd; font-size: 105%; line-height: 115%; }

.center4 { flex: 1 0 0; width: 33%; background: #faf5ff; margin-right: 5px; border: 1px solid #ddcef2; font-size: 105%; line-height: 115%; }

.right5 { flex: 1 0 0; width: 33%; background: ; margin: 0; border: 1px solid #eee; font-size: 105%; line-height: 115%; }

.left6 { width: 100%; background: ; border: 1px solid #eee; font-size: 105%; line-height: 115%; } 

.title { 
   display: block; 
   box-sizing: border-box;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box; }

.title1 { line-height: 100%; font-size: 1.3em; background: #cef2e0; border: none; padding: 3px 0; }
.title2 { line-height: 100%; font-size: 1.2em; background: #cedff2; border: none; padding: 3px 0; margin-bottom: 10px; }
.title3 { line-height: 100%; font-size: 1.3em; background: #f2cedd; border: none; padding: 3px 0; margin-bottom: 10px; }
.title4 { line-height: 100%; font-size: 1.3em; background: #ddcef2; border: none; padding: 3px 0; margin-bottom: 10px; }
.title5 { line-height: 100%; font-size: 1.3em; background: #eee; border: none; padding: 3px 0; margin-bottom: 10px; }
.title6 { line-height: 100%; font-size: 1.3em; background: #eee8aa; border: none; padding: 3px 0; margin-bottom: 10px; }

.infobox {
    font-size: 100%;
    border: solid 1px #aaa;
    float: right;
    margin: 0 0 1em 1em;
    padding: 10px; 
    width: 300px; }

.infobox p {
    font-size: 100%; 
    font-family: serif; 
    padding: 0; margin: 0; 
    border-bottom: 1px solid #aaa; 
    width: 100%; 
    display: block; }

.infobox li, .infobox ul {padding 0; margin: 0;}

.hole { font-size: 1.1em; font-family: "Times New Roman", Times, serif; }

#pageTree, #pageTree li, #pageTree ul {padding 0; margin: 0; }

/* NAV_pageTree */

ul.custom, ul.custom > li {
    list-style-type: none;
    padding: 0px;
    margin: 0; }
ul.customUL > li.tree { padding-left: 19px; }

.tree{ --spacing : 1.2rem; --radius  : 8px; }

.tree li{
  display      : block;
  position     : relative;
  padding-left : calc(2 * var(--spacing) - var(--radius) - 2px); }

.tree ul{ margin-left  : calc(var(--radius) - var(--spacing)); padding-left : 0; }

.tree ul li{ border-left : 2px solid #ddd; }

.tree ul li:last-child{ border-color : transparent; }

.tree ul li::before{
  content      : '';
  display      : block;
  position     : absolute;
  top          : calc(var(--spacing) / -2);
  left         : -2px;
  width        : calc(var(--spacing) + 2px);
  height       : calc(var(--spacing) + 1px);
  border       : solid #ddd;
  border-width : 0 0 2px 2px; }

.tree summary{ display : block; cursor : pointer; }

.tree summary::marker,
.tree summary::-webkit-details-marker{ display : none; }

.tree summary:focus{ outline : none; }

.tree summary:focus-visible{ outline : 1px dotted #000; }

.tree li::after,
.tree summary::before{
  content       : '';
  display       : block;
  position      : absolute;
  top           : calc(var(--spacing) / 2 - var(--radius));
  left          : calc(var(--spacing) - var(--radius) - 1px);
  width         : calc(2 * var(--radius));
  height        : calc(2 * var(--radius));
  border-radius : 50%;
  background    : #ddd; }

.tree summary::before{
  content     : '+';
  z-index     : 1;
  background  : #999;
  color       : #fff;
  line-height : calc(2 * var(--radius) - 2px);
  text-align  : center; }

.tree details[open] > summary::before{ content : '−'; }

/* Lists in wikitable data cells are always left-aligned */
.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
	/* @noflip */
	text-align: left; }

/* Normal font styling for wikitable row headers with scope="row" tag */
.wikitable { line-height: 138%; }
.wikitable.plainrowheaders th[scope=row],
.wikitable.plainrowheaders th[scope=rowgroup] {
	font-weight: normal;
	/* @noflip */
	text-align: left; }

/* audio{width: 100px !important;}
audio::-webkit-media-controls-play-button{background-color:#ee7666 !important;}
audio::-webkit-media-controls-panel{background-color:#ee7666 !important;}
audio::-webkit-media-controls-current-time-display{display:none !important;}
audio::-webkit-media-controls-current-time-display{display:none !important;}
audio::-webkit-media-controls-time-remaining-display{display:none !important;}
audio::-webkit-media-controls-timeline{display:none !important;}
audio::-webkit-media-controls-mute-button{display:none !important;} */


/* [[phab:T293232]] - Mobile doesn't have this style.
 * Will be fixed with TStyles. */
div.hlist.inline ul,
div.hlist.inline li,
div.hlist.inline {display: inline;}

/* Responsive layout - screen less than 700px wide, make columns stack */
@media screen and (max-width: 700px) {
  .pix, .left1, .right2, .left3, .center4, .right5 {   
    flex-direction: column;
  }
.pix, .col.left1, .col.right2, .col.left3, .col.center4, .col.right5 {
    flex: 1 1 100%;
}
}
Retrieved from "https://dstall.com/DIY/index.php?title=MediaWiki:Common.css&oldid=331"