MediaWiki:Common.css: Difference between revisions
No edit summary |
No edit summary |
||
(59 intermediate revisions by the same user not shown) | |||
Line 93: | Line 93: | ||
.table-bg-always, | .table-bg-always, | ||
.table-bg-blue { | .table-bg-blue { | ||
background:#3288bd; | background: color-mix(in srgb, #3288bd, transparent 50%); | ||
} | } | ||
.table-bg-common, | .table-bg-common, | ||
.table-bg-green { | .table-bg-green { | ||
background:#abdda4; | background: color-mix(in srgb, #abdda4, transparent 50%); | ||
} | } | ||
.table-bg-uncommon, | .table-bg-uncommon, | ||
.table-bg-yellow { | .table-bg-yellow { | ||
background:#fee08b; | background: color-mix(in srgb, #fee08b, transparent 50%); | ||
} | } | ||
.table-bg-rare, | .table-bg-rare, | ||
.table-bg-orange { | .table-bg-orange { | ||
background:#f46d43; | background: color-mix(in srgb, #f46d43, transparent 50%); | ||
} | } | ||
.table-bg-veryrare, | .table-bg-veryrare, | ||
.table-bg-red { | .table-bg-red { | ||
background:# | background: color-mix(in srgb, #d53e4f, transparent 50%); | ||
} | |||
.table-bg-ultrarare, | |||
.table-bg-purple { | |||
background: color-mix(in srgb, #9b91af, transparent 50%); | |||
} | } | ||
.table-bg-random, | .table-bg-random, | ||
.table-bg-pink { | .table-bg-pink { | ||
background:#5e4fa2; | background: color-mix(in srgb, #5e4fa2, transparent 50%); | ||
color: #f8f9fa; | |||
} | } | ||
.table-bg-gray, | .table-bg-gray, | ||
Line 198: | Line 203: | ||
.skill-potionmaking .skill-icon { background-color: #98b7f9; } | .skill-potionmaking .skill-icon { background-color: #98b7f9; } | ||
.skill-smithing .skill-icon { background-color: #ff7cf1; } | .skill-smithing .skill-icon { background-color: #ff7cf1; } | ||
.skill-grid a.skill { | |||
text-decoration: none; | |||
color: inherit; | |||
} | |||
.tile-halves { | .tile-halves { | ||
Line 276: | Line 286: | ||
letter-spacing: 0.03em; | letter-spacing: 0.03em; | ||
margin: 0; | margin: 0; | ||
} | |||
/* Sidebar Discord */ | |||
#n-Discord a { | |||
color:#fff !important; | |||
font-weight:bold; | |||
border-radius:4px; | |||
border:1px solid #4c57d0; | |||
background-color:#5865f2; | |||
display:block; | |||
position:relative; | |||
padding:4px 4px 5px calc(17px + 6.5px * 2); | |||
box-shadow:0 2px 3px rgba(0,0,0,0.1); | |||
transition:0.2s; | |||
} | |||
#n-Discord a::before { | |||
content:'Join the '; | |||
font-weight:normal; | |||
opacity:0.85; | |||
} | |||
#n-Discord a::after { | |||
content:''; | |||
background:url(https://brightershoreswiki.org/images/Discord_logo_icon.svg) no-repeat; | |||
background-size:17px 13px; | |||
filter:drop-shadow(0 1px 1px rgba(0,0,0,0.1)); | |||
position:absolute; | |||
top:5px; | |||
left:7px; | |||
width:17px; | |||
height:13px; | |||
} | |||
#n-Discord a:hover { | |||
text-decoration:none; | |||
background-color:#525ee0; | |||
} | |||
/* Sidebar HighLite */ | |||
#n-HighLite a { | |||
color:#fff !important; | |||
font-weight:bold; | |||
border-radius:4px; | |||
border:1px solid #0d0d0d; | |||
background-color:#1a1a1a; | |||
display:block; | |||
position:relative; | |||
padding:4px 4px 5px calc(17px + 6.5px * 2); | |||
box-shadow:0 2px 3px rgba(0,0,0,0.1); | |||
transition:0.2s; | |||
} | |||
#n-HighLite a::before { | |||
content:'Try Out '; | |||
font-weight:normal; | |||
opacity:0.85; | |||
} | |||
#n-HighLite a::after { | |||
content:''; | |||
background:url(https://highspell.wiki/w/images/e/e8/HighLite-Logo-Transparent.png) no-repeat; | |||
background-size: 26px; | |||
filter: drop-shadow(0 1px 1px rgba(0,0,0,0.1)); | |||
position: absolute; | |||
top: -1px; | |||
left: 3px; | |||
width: 25px; | |||
height: 25px; | |||
} | |||
#n-HighLite a:hover { | |||
text-decoration:none; | |||
background-color:#000000; | |||
} | |||
.image-overlay { | |||
position: relative; | |||
display: inline-block; | |||
} | |||
.image-overlay .base { | |||
display: block; | |||
} | |||
.image-overlay .overlay { | |||
position: absolute; | |||
top: 50%; | |||
left: 50%; | |||
transform: translate(-50%, -50%) scale(0.6) rotate(-25deg); | |||
z-index: 2; | |||
} | |||
.text-muted { | |||
opacity: 0.6; | |||
color: inherit; /* Keeps parent color, just dims it */ | |||
} | |||
.fslightbox-wrapper iframe[data-fslightbox-target] { | |||
position: absolute; | |||
top: -9999px; | |||
left: -9999px; | |||
width: 1px; | |||
height: 1px; | |||
opacity: 0; | |||
pointer-events: none; | |||
z-index: -1; | |||
} | } |