MediaWiki:Gadget-navpop.css

In other languages

Note: After saving, you have to bypass your browser's cache to see the changes.

Google Chrome, Firefox, Microsoft Edge, and Safari: Hold down the key and click the Reload toolbar button.
For details and instructions about other browsers, see Wikipedia:Bypass your cache.

/*
Imported from https://en.wikipedia.org/wiki/MediaWiki:Gadget-navpop.css
CSS for navigation popups gadget: Article previews and editing functions pop up when hovering over links
*/
.popupMoreLink{
display:block;
text-align:right;
cursor:pointer;
}
ins.popupDiff{
background:#afe;
}
del.popupDiff{
background:#ffe6e6;
}
/* Dark mode fixes */
html.skin-theme-clientpref-nightins.popupDiff{
background:#026c5f;
}
html.skin-theme-clientpref-nightdel.popupDiff{
background:#89474b;
}
@media(prefers-color-scheme:dark){
html.skin-theme-clientpref-osins.popupDiff{
background:#026c5f;
}
html.skin-theme-clientpref-osdel.popupDiff{
background:#89474b;
}
}
#selectionPreview{
border:2pxsolidvar(--border-color-subtle,#c8ccd1);
background-color:var(--background-color-progressive-subtle,#eaf3ff);
padding:6px;
}
.navpopup{
border:1pxsolidvar(--border-color-base,#a2a9b1);
background-color:var(--background-color-base,#fff);
color:var(--color-base,#202122);
padding:10px;
padding-bottom:5px;
font-size:11px;
box-shadow:03px8pxrgba(50,50,50,0.35);
word-wrap:break-word;
}
.navpopuphr{
color:#aaa!important;
background-color:#aaa!important;
}
/* Configure Drag bar color */
.popupDrag{
background-color:#ffbe20;
height:5px;
margin-top:-5px;
margin-bottom:5px;
}
.popupDragHandle{
cursor:move;
position:relative;
}
/* menu magic - many thanks to [[User:Zocky]]! */
/* popups */
.popup_menu{
display:none;
position:absolute;
left:0;
margin:0;
margin-top:1.4em;
line-height:1.25em;
top:0;
z-index:2;
width:10em;
background:var(--background-color-base,#fff);
border:1pxsolidgrey;
padding:0!important;
margin-left:-6px;
border-width:1px1px1px6px;
}
.popup_menuli{/* both: popup_menu_row and popup_menu_item */
list-style:none;
margin:0;
padding:0;
}
.popup_menua{
display:block;
padding:3px;
}
.popup_menu_rowa{
display:inline-block;
}
.popup_menu_row{
color:#aaa;
}
.popup_drop{
display:inline;
position:relative;
}
.popup_dropa,
.popup_dropa:visited{
padding:3px;
margin:0;
font-weight:bold;
}
.popup_drop:hover.popup_menu,
.popup_drop.popup_menu:hover{
display:inline;
padding:2px;
}
.popup_drop:hover{
background:#ccf;
color:#44f;
}
/* other colours, styles and so on */
.popup_menua:hover{
background:grey;
color:#fff;
text-decoration:none;
}
.popup_mainlink{
font-size:140%;
font-weight:bold;
}
.popup_mainlinka{
color:var(--color-emphasized,#000);
}
a.popup_change_title_link{
color:#152;
}
/* Dark mode fixes */
html.skin-theme-clientpref-nighta.popup_change_title_link{
color:#25b84a;
}
@media(prefers-color-scheme:dark){
html.skin-theme-clientpref-osa.popup_change_title_link{
color:#25b84a;
}
}
.popup_diff_dates{
font-style:italic;
background:none;
}
.popup_menu_itema{
display:block;
}
.popup_history_row_even{
background:var(--background-color-neutral,#eaecf0);
}
.popup_history_date{
font-weight:bold;
font-size:120%;
}
.popup_history_row_odd,
.popup_history_row_even{
display:flex;
}
.popup_history_row_eventd:nth-child(3),
.popup_history_row_oddtd:nth-child(3){
flex:3;
word-break:break-word;
}
.popup_history_row_eventd:nth-child(4),
.popup_history_row_oddtd:nth-child(4){
flex:7;
word-break:break-word;
}
.popup_history_row_even>td:not(:last-child),
.popup_history_row_odd>td:not(:last-child){
margin-right:2px;
}
/* disable interwiki styling */
.popupPreviewa.extiw,
.popupPreviewa.extiw:active{
color:#36b;
background:none;
padding:0;
}
.popupPreview.external{
color:#36b;
}
/* this can be used in the content area to switch off
special external link styling */
.popupPreview.plainlinksa{
background:none!important;
padding:0!important;
}
/*
	Mouse safe zones for popup menu.
*/
/* eye guide suggestion */
.popup_menu:hover{
box-shadow:005px5pxrgba(179,179,255,0.3);
}
/* Dark mode fixes */
html.skin-theme-clientpref-night.popup_menu:hover{
box-shadow:005px5pxrgba(0,0,90,0.3);
}
@media(prefers-color-scheme:dark){
html.skin-theme-clientpref-os.popup_menu:hover{
box-shadow:005px5pxrgba(0,0,90,0.3);
}
}
/* trapezoid guide for the cursor */
.popup_menu::before{
content:'';
display:block;
position:absolute;
height:1.5em;
top:-1.4em;
left:-1.2em;
width:calc(2*var(--navpop-m-len,6ch));
transform:perspective(1px)rotateX(1deg);
}
/* make the trapezoid go behing menu items */
.popup_menu::before{
z-index:1;
}
.popup_menuli{
position:relative;
z-index:2;
}
/* additional hover margin on the sides */
.popup_menuli::before{
content:'';
display:block;
position:absolute;
top:0;
height:calc(100%+.5em);
left:-1.7em;
width:1.7em;
}
.popup_menuli::after{
content:'';
display:block;
position:absolute;
top:0;
height:calc(100%+.5em);
left:calc(10em-1px);/* depends on the width of the menu */
width:1em;
}