Difference between revisions of "MediaWiki:Common.css"
From Future Of Mankind
Line 102: | Line 102: | ||
.experimental3 td {background-color:#F5F5F5; padding-left:20px; padding-right:20px; padding-bottom:16px; border-bottom:1px solid gray; border-left:1px solid gray; border-right:1px solid gray; font-family:cambria} /* class="experimental3" */ | .experimental3 td {background-color:#F5F5F5; padding-left:20px; padding-right:20px; padding-bottom:16px; border-bottom:1px solid gray; border-left:1px solid gray; border-right:1px solid gray; font-family:cambria} /* class="experimental3" */ | ||
.experimental4 div {display:flex; flex-wrap:wrap; justify-content:center; text-align:justify; margin-top:4px; padding-bottom:2em; font-family:cambria; font-style:italic; font-size:15px} /* class="experimental4" */ | .experimental4 div {display:flex; flex-wrap:wrap; justify-content:center; text-align:justify; margin-top:4px; padding-bottom:2em; font-family:cambria; font-style:italic; font-size:15px} /* class="experimental4" */ | ||
− | .experimental5 | + | .experimental5 tbody tr td {width:80%} |
Revision as of 06:18, 25 August 2022
@import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&display=swap'); .Unifraktur-Maguntia-font {font-family:'UnifrakturMaguntia', cursive; font-size:1em} /* Changes the default font used for MediaWiki to Arial (does not include headings or monospaced text): */ body {font-family:Arial; font-size:1em} /* Changes the default font used for MediaWiki headings to Noto Serif: */ #content h1 {font-family: "Noto Serif", serif} #mw-site-navigation .sidebar-chunk h3, #mw-related-navigation .sidebar-chunk h3 {font-size:1.3em} .toctitle {text-align:center; font-size:1.2em; line-height:2em} .mw-body .toctitle h2 {font-family:Arial; font-weight:bold} .toctogglespan {display:none} .toc ul {line-height:1.4em} .toc {border:1px solid #a2a9b1; padding:0 12px} /* One-sided navigation menu */ @media (min-width:1340px) { #mw-content-block {display:block} #mw-content, #content-bottom-stuff {margin-left:14em} #mw-content-wrapper {float:right; margin-left:-14em; width:100%} #mw-related-navigation {width:14em; padding:0 1em 0 0} div.color-middle {margin-right:0} .mw-wiki-logo {display:inline-block} } /* mouse over link */ a:hover {text-decoration:underline} /* selected link */ a:active {text-decoration:underline; color:orange} ul > li:nth-child(2) > div:last-child, li:nth-child(4) > div:last-child {display:none} ul > li:nth-child(4) > div:nth-child(2) {display:none} ul > li:nth-child(3) > div:last-child {display:none} .shadow:hover {box-shadow:0 0 8px rgba(37,37,37,0.5)} .scale-up:hover {transform:scale(1.02)} .responsive-image img {width:calc(100% - 1.5px); height:auto} .thumbinner img {border:1px solid #c8ccd1} .thumbinner {justify-content:center; padding:4px; border:1px solid #c8ccd1; transition:0.3s} .thumbcaption:last-child {padding:4px 4px 0; text-align:justify; font-style:italic; font-size:13px} .colourize img {transition:transform 0.5s, filter 1.5s ease-in-out; filter:grayscale(100%); -webkit-filter:grayscale(100%)} .colourize:hover img {filter:none; -webkit-filter:grayscale(0)} .green-bullet::after {content:" ■"; color:green; position:relative; bottom:1px; font-size:20px} .orange-bullet::after {content:" ■"; color:orange; position:relative; bottom:1px; font-size:20px} .maroon-bullet::after {content:" ■"; color:maroon; position:relative; bottom:1px; font-size:20px} .FOMclock { margin: 0 auto; } .FOMclock ul { margin: 0 auto; padding: 0; text-align: inline } .FOMclock ul li { display: inline; } .FOMdate { display: inline; } .DateRange, .DateDiv { display: none; } h4{ display: inline-block; } table {border-spacing:1.5em 0; margin:0 -1.5em} tr td, td div {vertical-align:top; line-height:1.4em} .v-align-middle td div {vertical-align:middle} /* class="v-align-middle" */ .wikitable td {vertical-align:middle} .wikitable.column1-bold-fonts tr td:first-child {font-weight:bold} .references {text-align:justify; font-size:14px} .thumbinner, .thumbcaption {line-height:1.4em} #blockquote td {padding:0 48px} /* id="blockquote" */ #col-padding-left td {padding-left:48px} /* id="col-padding-left" */ #heading1 td {text-align:center; font-weight:bold; font-size:20px} /* id="heading1" */ #heading2 td {text-align:center; font-weight:bold; font-size:18px} /* id="heading2" */ #heading3 td {padding-top:2em; text-align:center; font-weight:bold; font-size:20px} /* id="heading3" */ #heading4 td {padding-top:2em; text-align:center; font-weight:bold; font-size:18px} /* id="heading4" */ #heading5 td {text-align:center; font-size:15px} /* id="heading5" */ #heading6 td {text-align:center; font-size:13px} /* id="heading6" */ #paragraph1 td {padding-top:16px} /* id="paragraph1" */ #paragraph2 td {padding-top:2em} /* id="paragraph2" */ #paragraph3 td {padding-bottom:2em} /* id="paragraph3" */ #no-line-break td {padding-top:0} /* id="no-line-break" */ .experimental1 td {background-color:#F5F5F5; padding-left:20px; padding-right:20px; padding-top:16px; border-top:1px solid gray; border-left:1px solid gray; border-right:1px solid gray; font-family:cambria} /* class="experimental1" */ .experimental2 td {background-color:#F5F5F5; padding-left:20px; padding-right:20px; border-left:1px solid gray; border-right:1px solid gray; font-family:cambria} /* class="experimental2" */ .experimental3 td {background-color:#F5F5F5; padding-left:20px; padding-right:20px; padding-bottom:16px; border-bottom:1px solid gray; border-left:1px solid gray; border-right:1px solid gray; font-family:cambria} /* class="experimental3" */ .experimental4 div {display:flex; flex-wrap:wrap; justify-content:center; text-align:justify; margin-top:4px; padding-bottom:2em; font-family:cambria; font-style:italic; font-size:15px} /* class="experimental4" */ .experimental5 tbody tr td {width:80%} #heading1-table table td:last-child {width:100%; text-align:center; font-weight:bold; font-size:22px} /* id="heading1-table" */ #heading2-table table td:last-child {width:100%; padding-top:2em; text-align:center; font-weight:bold; font-size:22px} /* id="heading2-table" */ #heading3-table table td:last-child {width:100%; text-align:center; font-weight:bold; font-size:20px} /* id="heading3-table" */ #heading4-table table td:last-child {width:100%; padding-top:2em; text-align:center; font-weight:bold; font-size:20px} /* id="heading4-table" */ #heading5-table table td:last-child {width:100%; text-align:center; font-weight:bold; font-size:18px} /* id="heading5-table" */ #heading6-table table td:last-child {width:100%; padding-top:2em; text-align:center; font-weight:bold; font-size:18px} /* id="heading6-table" */ #heading7-table table td:last-child {width:100%; text-align:center; font-size:15px} /* id="heading7-table" */ #heading8-table table td:last-child {width:100%; text-align:center; font-size:13px} /* id="heading8-table" */ #paragraph1-table table td {padding-top:16px} /* id="paragraph1-table" */ #paragraph2-table table td {padding-top:2em} /* id="paragraph2-table" */ #no-line-break-table table {padding-top:0} /* id="no-line-break-table" */ #col2-move-left table td:nth-child(2) {display:block; position:relative; left:-1em; margin-right:-1em} /* id="col2-move-left" */ #square-bullet-points li {list-style-type:square; padding-left:1em; line-height:1em} /* id="square-bullet-points" */ /* Table for Contact Report 690 */ .CR690-tab-col2-move-left table td:nth-child(2) {display:block; margin-left:-1em; margin-right:-1em; text-align:right} /* class="CR690-tab-col2-move-left" */ .CR690-tab-col5-move-left table td:nth-child(5) {padding-left:3em} /* class="CR690-tab-col5-move-left" */ /* Class selectors – Table */ table.blockquote td {padding:0 48px; width:50%} /* class="blockquote" */ table.col-padding-left td {padding-left:48px; width:50%} /* class="col-padding-left" */ table.col-padding-right td {padding-right:48px; width:50%} /* class="col-padding-right" */ table.col2-padding-right table:last-child {padding-right:48px} table.col3-padding-right table:last-child {padding-right:64px} table.table-columns table:last-child {border-spacing:0.5em 0; margin:0 -0.5em} /* class="table-columns" */ table.col1 td:first-child {min-width:2em} table.col1-align-right td table tr td:first-child {text-align:right} table.col1a td table tr td:first-child {min-width:1.5em} table.col1b td table tr td:first-child {min-width:2em} table.col2a td:nth-child(2):not(td:last-child) {min-width:1em} table.col2b td:nth-child(2):not(td:last-child) {min-width:0.5em} table.col2-align-right td:nth-child(2):not(td:last-child) {min-width:2em; text-align:right} table.col3-align-right td:nth-child(3):not(td:last-child) {min-width:2em; text-align:right} .not-bold td {font-weight:normal !important} /* class="not-bold" */ .align-text-left td {text-align:left !important} /* class="align-text-left" */ .paragraph-table table {padding-top:16px} /* class="paragraph-table" */ .paragraph td {padding-top:16px} /* class="paragraph" */ /* ID selectors – Table */ #col1-align-right td table tr td:first-child {text-align:right} /* id="col1-align-right" */ #col2a td:nth-child(2):not(td:last-child) {min-width:1em} /* id="col2a" */ #col2b td:nth-child(2):not(td:last-child) {min-width:0.5em} /* id="col2b" */ #btnHideEnglish, #btnHideSwiss-German {cursor:pointer; margin-bottom:12px; font-size:120%} #center-align-buttons td {text-align:center; width:10%} /* id="center-align-buttons" */ #language-heading td {width:50%; text-align:center; font-weight:bold; font-size:20px} /* id="language-heading" */ /* The following class is used on the Test page. */ tr.contactperson td { background-color: cyan; line-height: 4em; font-weight: bold; } .divButton {padding:2px 10px; border:solid #707070 1px; font-size:14px; background:grey; display:inline-flex; max-width:60%; border-radius:2px; background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #F2F2F2), color-stop(1, #CFCFCF)); background-image:-o-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image:-moz-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image:-webkit-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image:-ms-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image: linear-gradient(to bottom, #F2F2F2 0%, #CFCFCF 100%); cursor:default; text-align:center} .divButton:hover {background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #EAF6FD), color-stop(1, #A7D8F5)); background-image:-o-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image: -moz-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image:-webkit-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image:-ms-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image: linear-gradient(to bottom, #EAF6FD 0%, #A7D8F5 100%); border:#3c7fb1 solid 1px} .divButton:active {border:solid #2c628b 1px; padding:2px 9px 2px 11px; background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #E5F4FC), color-stop(0.5, #C4E5F6), color-stop(0.51, #98D0EF), color-stop(1, #68B3DB)); background-image:-o-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image: -moz-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image:-webkit-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image:-ms-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image: linear-gradient(to bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%)} .tooltip {position:relative; display:inline-block; border-bottom:1px dotted black} .tooltip .tooltip-text {visibility:hidden; background-color:#d0dcf1; color:black; text-align:justify; font-size:14px; border-radius:4px; padding:5px 8px; transform:translateX(-48%); position:absolute; z-index:1; bottom:140%; left:50%; width:max-content; max-width:350px; opacity:0; transition:opacity 1s; transition:0.5s ease-in-out} .tooltip .tooltip-text::after {content:""; position:absolute; top:100%; left:48%; margin-left:-5px; border-width:10px; border-style:solid; border-color:#d0dcf1 transparent transparent transparent} .tooltip:hover .tooltip-text {visibility:visible; opacity:1}