MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary Tag: Manual revert |
No edit summary |
||
| Line 132: | Line 132: | ||
.seven { width: 14.3%; } | .seven { width: 14.3%; } | ||
.eight { width: 12.5%; } | .eight { width: 12.5%; } | ||
.nine { width: 11.1%; } | |||
.ten { width: 10%; } | |||
.main { width: 45.75%; } | .main { width: 45.75%; } | ||
Latest revision as of 19:37, 20 April 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-image: url("https://dstall.com/MOD/images/1/1f/Background.jpg");
background-repeat: repeat-x repeat-y;
background-position: center;
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%;
}
}