MediaWiki:Gadget-Tooltip.css: Difference between revisions
Jump to navigation
Jump to search
m Kuhlau moved page MediaWiki:Tooltip.css to MediaWiki:Gadget-Tooltip.css: improved page loading, tooltip is already a gadget so why we import it separately |
udpate skins |
||
| Line 1: | Line 1: | ||
/*** For [[Template:Tt]] ***/ | /*** For [[Template:Tt]] ***/ | ||
/* Force disable default hover tooltip on mobile and enable the toggle */ | /* Force disable default hover tooltip on mobile and enable the toggle */ | ||
.skin- | .skin-minerva .hover-tooltip { display: none; } | ||
.skin- | .skin-minerva .custom-tt-wrapper.giw-collapsible .mw-collapsible-toggle { display: inline !important; } | ||
/** Text styling **/ | /** Text styling **/ | ||
| Line 35: | Line 35: | ||
/** Desktop: enabled through gadget **/ | /** Desktop: enabled through gadget **/ | ||
/* Container */ | /* Container */ | ||
.skin- | .skin-vector-legacy .custom-tt-wrapper:not(.giw-extra-effect-wrapper) { | ||
.oo-ui-popupWidget-popup { | .oo-ui-popupWidget-popup { | ||
background: var(--theme-page-background-color); | background: var(--theme-page-background-color); | ||
| Line 49: | Line 49: | ||
} | } | ||
.skin- | .skin-vector-legacy .mw-collapsible-content.custom-tt-toright { border-radius: 0 5px 5px 5px; } | ||
.skin- | .skin-vector-legacy .mw-collapsible-content.custom-tt-toright:before { | ||
border-top:0 solid transparent; | border-top:0 solid transparent; | ||
border-bottom:10px solid var(--theme-link-color); | border-bottom:10px solid var(--theme-link-color); | ||
| Line 61: | Line 61: | ||
/** Mobile: enabled by default (attr:title does not work) **/ | /** Mobile: enabled by default (attr:title does not work) **/ | ||
/* Container */ | /* Container */ | ||
.skin- | .skin-minerva .custom-tt-wrapper .mw-collapsible-toggle-expanded + .mw-collapsible-content.custom-tt { | ||
position: fixed; | position: fixed; | ||
z-index: 10005; | z-index: 10005; | ||
| Line 80: | Line 80: | ||
} | } | ||
/* Container header */ | /* Container header */ | ||
.skin- | .skin-minerva .custom-tt-wrapper .mw-collapsible-toggle-expanded + .mw-collapsible-content.custom-tt:before { | ||
content: "ⓘ Tooltip content:"; | content: "ⓘ Tooltip content:"; | ||
display: block; | display: block; | ||
| Line 89: | Line 89: | ||
} | } | ||
/* Tooltip surrogate toggle on container header */ | /* Tooltip surrogate toggle on container header */ | ||
.skin- | .skin-minerva .custom-tt-wrapper .mw-collapsible-toggle-expanded:after { | ||
content: "x" !important; | content: "x" !important; | ||
position: fixed; | position: fixed; | ||
| Line 98: | Line 98: | ||
} | } | ||
/* Tooltip surrogate toggle on backdrop overlay */ | /* Tooltip surrogate toggle on backdrop overlay */ | ||
.skin- | .skin-minerva .custom-tt-wrapper .mw-collapsible-toggle-expanded:before { | ||
background: black; | background: black; | ||
position: fixed; | position: fixed; | ||
| Line 111: | Line 111: | ||
/** For [[Template:Extra Effect]] **/ | /** For [[Template:Extra Effect]] **/ | ||
:root . | :root .wgl-darkmode, :root .wgl-theme-dark { | ||
--extra-effect-bg: #0c0c0cd6; | --extra-effect-bg: #0c0c0cd6; | ||
} | } | ||
:root . | :root .wgl-lightmode, :root .wgl-theme-light { | ||
--extra-effect-bg: #ecececd6; | --extra-effect-bg: #ecececd6; | ||
} | } | ||
| Line 164: | Line 164: | ||
} | } | ||
.skin- | .skin-minerva .giw-extra-effect-wrapper .mw-collapsible-toggle-expanded + .mw-collapsible-content.giw-extra-effect { | ||
position: fixed; | position: fixed; | ||
z-index: 10005; | z-index: 10005; | ||
| Line 182: | Line 182: | ||
} | } | ||
.skin- | .skin-minerva .custom-tt-wrapper .mw-collapsible-toggle-expanded.giw-extra-effect:after { | ||
bottom: 265px; | bottom: 265px; | ||
} | } | ||
.skin- | .skin-minerva .custom-tt-wrapper .mw-collapsible-toggle-expanded.giw-extra-effect:before { | ||
height: calc(100% - 300px); | height: calc(100% - 300px); | ||
} | } | ||