Gadget-popups.css

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

Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Press Ctrl-F5.

/* js can be found at gadget-toggles.js */

.popup-content-hidden {
	display:none!important;
}

.popup-button-pretty {
	position:relative;
	display: inline-block;
}

.popup-button-pretty::before {
	font-family:"FontAwesome";
	content:"\f05a";
	cursor:pointer;
}

/* popup-content-wrapper needs to exist because it's impossible to attach a max-width without a width to popup-content and have it act normally, instead the content will try to compress as narrow as possible because it's a child of popup-button. So we attach a width to popup-content-wrapper and then popup-content will be constrained by that but otherwise won't take up any extra space. All of the visual styles are attached to popup-content, so we don't know that there's a fixed-width div containing it. But to make sure we don't accidentally create an unnecessary horizontal scrollbar in some situations, we can still adjust the width of popup-content-wrapper in the same JS that shows it on click. */

.popup-wrapper-tth {
 width:600px;
}

.popup-content-wrapper-pretty {
	position:absolute;
	top:50%;
	left:50%;
}

.popup-content-pretty {
	z-index:10000;
	box-shadow: 0.25em 0.25em 2px var(--box-shadow-color);
	border-radius: 3px;
	border: 1px solid var(--interface-border);
	background: rgba(var(--interface-background-rgb), 0.95);
	position: absolute;
	top: 0;
}

.popup-content-pretty .wikitable {
	margin:0;
}

/* navboxes */
.navbox .popup-button-pretty {
	margin-left:.5em;
}

.navbox-event-list {
	white-space:nowrap;
	padding-right:.5em;
}

.navbox .hlist .popup-button-pretty::before {
 content:'\f0c9';
  font-size:80%;
}

/* standings */
.standings .popup-button-tth-pretty {
	float:right;
	padding-left:.4em;
}

.popup-content-tth td,
.popup-content-tth th,
.popup-content-tth .standings .teamname,
.popup-content-tth .standings,
.popup-content-tth-pretty th,
.popup-content-pretty .standings .teamname,
.popup-content-pretty .standings {
	white-space:nowrap;
}

.popup-content-pretty .standings {
	margin-bottom:0;
}

.standings .popup-button-pretty.popup-button-tth {
	float:right;
	padding-left:.4em;
}

.popup-button-pretty .popup-content-tth .wikitable,
.popup-button-pretty .popup-content-tth .wikitable2 {
    margin:-1px;
}

/* legends */
.legend-icon.popup-button-pretty .popup-content-pretty {
 z-index: 10001;
}

.legend-icon.popup-button-pretty::before {
  content:'';
}

.legend-icon.popup-button-pretty {
  background-image:url("https://images.wikia.com/lolesports_gamepedia_en/images/thumb/2/26/Standings_Help_Icon_2.png/20px-Standings_Help_Icon_2.png");
  height:20px;
  width:20px;
  cursor:pointer;
}

/* chromas */
.popup-button.chroma-button::after {
	content:;
}

/* achievements */
.achievements-lastresult-outer .popup-button-pretty {
	position:absolute;
	right:0;
	top: 50%;
	margin-top: -0.5em;
	line-height: 1;
}

/* references */
.popup-ref-wrapper {
	width:30em;
}

.popup-ref-button::before {
	font-family:unset;
	content:'[ref]';
	color:var(--link);
}

.ref-start .popup-ref-button::before {
	font-family:unset;
	content:'[s]';
	color:var(--link);
}

.ref-end .popup-ref-button::before {
	font-family:unset;
	content:'[e]';
	color:var(--link);
}

.popup-ref-wrapper-inner {
 padding:.3em;
}