MediaWiki:Common.css: Difference between revisions
From Future Of Mankind
No edit summary |
No edit summary |
||
| Line 75: | Line 75: | ||
line-height: 4em; | line-height: 4em; | ||
font-weight: bold; | font-weight: bold; | ||
} | |||
/* Add this attribute to the element that needs a tooltip */ | |||
[data-tooltip] { | |||
position: relative; | |||
z-index: 2; | |||
cursor: pointer; | |||
} | |||
/* Hide the tooltip content by default */ | |||
[data-tooltip]:before, | |||
[data-tooltip]:after { | |||
visibility: hidden; | |||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; | |||
filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0); | |||
opacity: 0; | |||
pointer-events: none; | |||
} | |||
/* Position tooltip above the element */ | |||
[data-tooltip]:before { | |||
position: absolute; | |||
bottom: 150%; | |||
left: 50%; | |||
margin-bottom: 5px; | |||
margin-left: -80px; | |||
padding: 7px; | |||
width: 160px; | |||
-webkit-border-radius: 3px; | |||
-moz-border-radius: 3px; | |||
border-radius: 3px; | |||
background-color: #000; | |||
background-color: hsla(0, 0%, 20%, 0.9); | |||
color: #fff; | |||
content: attr(data-tooltip); | |||
text-align: center; | |||
font-size: 14px; | |||
line-height: 1.2; | |||
} | |||
/* Triangle hack to make tooltip look like a speech bubble */ | |||
[data-tooltip]:after { | |||
position: absolute; | |||
bottom: 150%; | |||
left: 50%; | |||
margin-left:-5px; | |||
width: 0; | |||
border-top:5px solid #000; | |||
border-top:5px solid hsla(0, 0%, 20%, 0.9); | |||
border-right:5px solid transparent; | |||
border-left:5px solid transparent; | |||
content: " "; | |||
font-size: 0; | |||
line-height: 0; | |||
} | |||
/* Show tooltip content on hover */ | |||
[data-tooltip]:hover:before, | |||
[data-tooltip]:hover:after { | |||
visibility: visible; | |||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; | |||
filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100); | |||
opacity: 1; | |||
} | } | ||
Revision as of 13:52, 13 March 2022
/* Changes the default font used for MediaWiki to Arial (does not include headings or monospaced text): */
body {
font-family: Arial
}
/* 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}
/* 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 11px rgba(37,37,37,0.3)}
.scale-up:hover {transform:scale(1.02)}
.responsive-image img {width:100%; height:auto}
.thumbinner img {border:1px solid #ddd}
.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)}
.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}
td, th, div {vertical-align:top; line-height:1.36em}
.blockquote div {margin:0 3em}
/*
#btnHideEnglish, #btnHideGerman {
cursor: pointer;
}
*/
/* The following class is used on the Test page. */
tr.contactperson td {
background-color: cyan;
line-height: 4em;
font-weight: bold;
}
/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
position: relative;
z-index: 2;
cursor: pointer;
}
/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
visibility: hidden;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
pointer-events: none;
}
/* Position tooltip above the element */
[data-tooltip]:before {
position: absolute;
bottom: 150%;
left: 50%;
margin-bottom: 5px;
margin-left: -80px;
padding: 7px;
width: 160px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #000;
background-color: hsla(0, 0%, 20%, 0.9);
color: #fff;
content: attr(data-tooltip);
text-align: center;
font-size: 14px;
line-height: 1.2;
}
/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
position: absolute;
bottom: 150%;
left: 50%;
margin-left:-5px;
width: 0;
border-top:5px solid #000;
border-top:5px solid hsla(0, 0%, 20%, 0.9);
border-right:5px solid transparent;
border-left:5px solid transparent;
content: " ";
font-size: 0;
line-height: 0;
}
/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
visibility: visible;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}