|
Tags: Blanking Manual revert |
Line 1: |
Line 1: |
| /*
| |
| * This stylesheet is always loaded, regardless of which theme is selected.
| |
| *
| |
| * Theme styles should go in [[MediaWiki:Vector.css]].
| |
| */
| |
|
| |
|
| /*
| |
| * Colors exported from Metadata/UI/UISettings.xml wherein 3-digit colors are in RGB format. 4-digit colors
| |
| * are not in any known format and have therefore been approximated.
| |
| */
| |
| :root {
| |
| --poe-color-default: rgb(127 127 127);
| |
| --poe-color-valuedefault: rgb(255 255 255);
| |
| --poe-color-fire: rgb(150 0 0);
| |
| --poe-color-cold: rgb(54 100 146);
| |
| --poe-color-lightning: rgb(255 215 0);
| |
| --poe-color-chaos: rgb(208 32 144);
| |
| --poe-color-augmented: rgb(136 136 255);
| |
| --poe-color-crafted: rgb(184 218 242);
| |
| --poe-color-fractured: rgb(162 145 98);
| |
| --poe-color-enchanted: rgb(184 218 242);
| |
| --poe-color-hellscaped: rgb(255 110 37);
| |
| --poe-color-allocatedcruciblemod: rgb(255 115 57);
| |
| --poe-color-unmet: rgb(210 0 0);
| |
| --poe-color-uniqueitem: rgb(175 96 37);
| |
| --poe-color-unique: rgb(175 96 37);
| |
| --poe-color-rareitem: rgb(255 255 119);
| |
| --poe-color-rare: rgb(255 255 119);
| |
| --poe-color-magicitem: rgb(136 136 255);
| |
| --poe-color-magic: rgb(136 136 255);
| |
| --poe-color-whiteitem: rgb(200 200 200);
| |
| --poe-color-normal: rgb(200 200 200);
| |
| --poe-color-gemitem: rgb(27 162 155);
| |
| --poe-color-gem: rgb(27 162 155);
| |
| --poe-color-currencyitem: rgb(170 158 130);
| |
| --poe-color-currency: rgb(170 158 130);
| |
| --poe-color-questitem: rgb(74 230 58);
| |
| --poe-color-quest: rgb(74 230 58);
| |
| --poe-color-nemesismod: rgb(255 200 0);
| |
| --poe-color-nemesismodoutline: rgb(219 34 0); /* 220,255,40,0 */
| |
| --poe-color-talismanmod: rgb(141 241 79);
| |
| --poe-color-talismanmodoutline: rgb(0 0 0); /* 220,0,0,0 */
| |
| --poe-color-title: rgb(231 180 120);
| |
| --poe-color-corrupted: rgb(210 0 0);
| |
| --poe-color-favour: rgb(170 158 130);
| |
| --poe-color-supporterpacknewitem: rgb(180 96 0);
| |
| --poe-color-supporterpackitem: rgb(163 141 109);
| |
| --poe-color-supporterpackincludes: rgb(242 162 47);
| |
| --poe-color-bloodlinemod: rgb(210 0 220);
| |
| --poe-color-bloodlinemodoutline: rgb(58 0 125); /* 200,74,0,160 */
| |
| --poe-color-tormentmod: rgb(50 230 100);
| |
| --poe-color-tormentmodoutline: rgb(0 78 117); /* 200,0,100,150 */
| |
| --poe-color-canttradeormodify: rgb(210 0 0);
| |
| --poe-color-lockedtoaccount: rgb(136 136 255);
| |
| --poe-color-divination: rgb(14 186 255);
| |
| --poe-color-prophecy: rgb(181 75 255);
| |
| --poe-color-essencemod: rgb(164 210 255);
| |
| --poe-color-essencemodoutline: rgb(0 41 82); /* 210,0,50,100 */
| |
| --poe-color-premiumchat: rgb(253 242 126);
| |
| --poe-color-premiumchatoutline: rgb(209 46 46);
| |
| --poe-color-uniquefoil: rgb(130 173 106);
| |
| --poe-color-legacy: rgb(212 145 63);
| |
| --poe-color-bestiarymod: rgb(255 255 255);
| |
| --poe-color-bestiarymodoutline: rgb(219 34 0); /* 220,255,40,0 */
| |
| --poe-color-blightmod: rgb(255 255 255);
| |
| --poe-color-blightmodoutline: rgb(215 0 0); /* 255,215,0,0 */
| |
| --poe-color-afflictionmod: rgb(22 25 28);
| |
| --poe-color-afflictionmodoutline: rgb(151 164 181); /* 200,193,210,232 */
| |
| --poe-color-necropolisupside: rgb(255 204 27);
| |
| --poe-color-necropolisdownside: rgb(175 181 203);
| |
| --poe-color-necropolisoutline: rgb(0 0 0);
| |
| --poe-color-necropoliscraftbook: rgb(33 32 31);
| |
| --poe-color-stackitemlevel: rgb(255 255 255);
| |
| --poe-color-harvestprimary: rgb(100 111 73);
| |
| --poe-color-harvestsecondary: rgb(83 130 161);
| |
| --poe-color-craftingcaster: rgb(179 248 254);
| |
| --poe-color-craftingphysical: rgb(199 157 147);
| |
| --poe-color-craftingfire: rgb(255 154 119);
| |
| --poe-color-craftingcold: rgb(147 216 255);
| |
| --poe-color-craftinglightning: rgb(248 203 118);
| |
| --poe-color-craftingchaos: rgb(216 167 211);
| |
| --poe-color-craftingspeed: rgb(207 238 165);
| |
| --poe-color-craftingcrit: rgb(178 167 214);
| |
| --poe-color-craftingred: rgb(200 103 110);
| |
| --poe-color-craftingblue: rgb(162 207 251);
| |
| --poe-color-craftinggreen: rgb(134 189 163);
| |
| --poe-color-craftinglife: rgb(201 110 110);
| |
| --poe-color-craftingdefences: rgb(168 143 103);
| |
| --poe-color-craftingattack: rgb(218 129 77);
| |
| --poe-color-heist: rgb(25 30 25);
| |
| --poe-color-heiststolenitem: rgb(210 0 0);
| |
| --poe-color-atlasmaven: rgb(182 12 169);
| |
| --poe-color-ultimatumnumber: rgb(254 92 81);
| |
| --poe-color-incursionunreachable: rgb(90 90 90);
| |
| --poe-color-lockedinplaceitem: rgb(127 127 127);
| |
| --poe-color-craftaffectremove: rgb(254 153 0);
| |
| --poe-color-craftaffectwarning: rgb(235 200 80);
| |
| --poe-color-craftaffectreroll: rgb(254 153 0);
| |
| --poe-color-skillpopuptitle: rgb(249 230 202);
| |
| --poe-color-disabledstats: rgb(150 150 167);
| |
| --poe-color-skillextrainfo: rgb(255 192 119);
| |
| --poe-color-fakeitemcount: rgb(200 200 200);
| |
| }
| |
|
| |
| /* ===== Flex grid ===== */
| |
| .o-flex-grid {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| clear: both;
| |
| margin-left: -16px;
| |
| }
| |
|
| |
| .o-flex-grid__item {
| |
| display: flex;
| |
| box-sizing: border-box;
| |
| overflow: hidden;
| |
| flex: 0 0 auto;
| |
| margin-bottom: 16px;
| |
| padding-left: 16px;
| |
| width: 100%;
| |
| }
| |
|
| |
| .o-flex-grid__inner {
| |
| flex: 0 1 100%;
| |
| margin: 0 !important;
| |
| }
| |
|
| |
| @media screen and (width >= 45em) {
| |
| .o-flex-grid--c2\@sm > .o-flex-grid__item {
| |
| width: 50%;
| |
| }
| |
| }
| |
|
| |
| @media screen and (width >= 60em) {
| |
| .o-flex-grid--c2\@md > .o-flex-grid__item {
| |
| width: 50%;
| |
| }
| |
|
| |
| .o-flex-grid--c3\@md > .o-flex-grid__item {
| |
| width: 33.3%;
| |
| }
| |
|
| |
| .o-flex-grid--c4\@md > .o-flex-grid__item {
| |
| width: 25%;
| |
| }
| |
| }
| |
|
| |
| @media screen and (width >= 80em) {
| |
| .o-flex-grid--c3\@lg > .o-flex-grid__item {
| |
| width: 33.3%;
| |
| }
| |
| }
| |
|
| |
| @media screen and (width >= 100em) {
| |
| .o-flex-grid--c2\@lg > .o-flex-grid__item {
| |
| width: 50%;
| |
| }
| |
|
| |
| .o-flex-grid--c4\@lg > .o-flex-grid__item {
| |
| width: 25%;
| |
| }
| |
| }
| |
|
| |
| /* ===== Content blocks ===== */
| |
| .c-cblock {
| |
| overflow: hidden;
| |
| margin: 6px 0;
| |
| border: 1px solid #2c2b2b;
| |
| border-radius: 4px;
| |
| padding: 8px 16px;
| |
| background-color: #141414;
| |
| }
| |
|
| |
| .c-cblock--violet {
| |
| border-color: #585477;
| |
| background-color: #151517;
| |
| }
| |
|
| |
| .c-cblock--gold {
| |
| border-color: #75693c;
| |
| background-color: #1c1b19;
| |
| }
| |
|
| |
| .c-cblock > *:first-child {
| |
| margin-top: 0 !important;
| |
| }
| |
|
| |
| .c-cblock hr {
| |
| clear: both;
| |
| margin: 16px 0;
| |
| background-color: #2c2b2b !important;
| |
| }
| |
|
| |
| .c-cblock--violet hr {
| |
| background-color: #585477 !important;
| |
| }
| |
|
| |
| .c-cblock--gold hr {
| |
| background-color: #75693c !important;
| |
| }
| |
|
| |
| .c-cblock h2,
| |
| .c-cblock h3,
| |
| .c-cblock h4,
| |
| .c-cblock h5,
| |
| .c-cblock h6 {
| |
| border: none;
| |
| }
| |
|
| |
| /* ===== Succession box (used by [[Template:Version]]) ===== */
| |
| table.successionbox {
| |
| margin-left: auto;
| |
| margin-right: auto;
| |
| text-align: center;
| |
| }
| |
|
| |
| /* ===== Hatnote ([[Template:Hatnote]]) ===== */
| |
| .hatnote {
| |
| display: flex;
| |
| margin-bottom: 0.4em;
| |
| }
| |
|
| |
| .hatnote__icon {
| |
| flex-shrink: 0;
| |
| padding-right: 0.4em;
| |
| width: 1.6em;
| |
| }
| |
|
| |
| .hatnote__icon img {
| |
| width: 100%;
| |
| height: auto;
| |
| }
| |
|
| |
| .hatnote__text {
| |
| font-style: italic;
| |
| }
| |
|
| |
| .hatnote__text i {
| |
| font-style: normal;
| |
| }
| |
|
| |
| /* ===== Message box ([[Template:Message box]]) ===== */
| |
| .c-mbox {
| |
| --mbox-background-color: #1c1b19;
| |
| display: flex;
| |
| align-items: center;
| |
| column-gap: 1em;
| |
| margin: 6px 0;
| |
| padding: 0.4em 1em;
| |
| min-width: min-content;
| |
| border-radius: 0.25rem;
| |
| color: color-mix(in oklab, var(--mbox-background-color), white 75%);
| |
| border: 0;
| |
| background-color: var(--mbox-background-color);
| |
| }
| |
|
| |
| @media screen and (width >= 45em) {
| |
| .c-mbox {
| |
| margin-left: 20%;
| |
| margin-right: 20%;
| |
| }
| |
| }
| |
|
| |
| .c-mbox--warning {
| |
| --mbox-background-color: #241515;
| |
| }
| |
|
| |
| .c-mbox--action {
| |
| --mbox-background-color: #26211f;
| |
| }
| |
|
| |
| .c-mbox--content {
| |
| --mbox-background-color: #26231f;
| |
| }
| |
|
| |
| .c-mbox--style {
| |
| --mbox-background-color: #24231f;
| |
| }
| |
|
| |
| .c-mbox--info {
| |
| --mbox-background-color: oklab(0.27 -0.03 -0.03 / 1);
| |
| }
| |
|
| |
| .c-mbox--legal {
| |
| --mbox-background-color: #21201c;
| |
| }
| |
|
| |
| .c-mbox--proposal {
| |
| --mbox-background-color: #19191c;
| |
| }
| |
|
| |
| .c-mbox--lock {
| |
| --mbox-background-color: #211f1d;
| |
| }
| |
|
| |
| .c-mbox__main {
| |
| flex-grow: 1;
| |
| }
| |
|
| |
| .c-mbox__title {
| |
| font-weight: bold;
| |
| }
| |
|
| |
| .c-mbox__text {
| |
| font-size: 0.86em;
| |
| }
| |
|
| |
| .c-mbox--full {
| |
| clear: both;
| |
| margin: 10px 0;
| |
| border-top-width: 6px;
| |
| padding-left: 2em;
| |
| padding-right: 2em;
| |
| }
| |
|
| |
| .c-mbox--full .c-mbox__title {
| |
| font-size: 1.2em;
| |
| }
| |
|
| |
| .c-mbox--full .c-mbox__text {
| |
| font-size: 1em;
| |
| }
| |
|
| |
| /* ===== Simple sidebar ([[Template:Lua]], [[Template:Template shortcut]]) ==== */
| |
| .c-sidebar {
| |
| box-sizing: border-box;
| |
| clear: right;
| |
| float: right;
| |
| margin: 6px 0;
| |
| border: 1px solid #59534e;
| |
| padding: 0.4em 1em;
| |
| min-width: 100%;
| |
| max-width: auto;
| |
| overflow-wrap: anywhere;
| |
| font-size: 0.86em;
| |
| background-color: #211f1d;
| |
| }
| |
|
| |
| @media screen and (width >= 45em) {
| |
| .c-sidebar {
| |
| margin-left: 14px;
| |
| min-width: min-content;
| |
| max-width: 220px;
| |
| overflow-wrap: break-word;
| |
| }
| |
| }
| |
|
| |
| /* ===== Infocard ([[Template:Infocard]]) ==== */
| |
| .info-card {
| |
| float: right;
| |
| clear: right;
| |
| margin-left: 14px;
| |
| margin-bottom: 14px;
| |
| text-align: center;
| |
| }
| |
|
| |
| .info-card__card {
| |
| border-style: solid;
| |
| border-width: 2px 1px;
| |
| border-color: #474233 #403b2e #1a1812;
| |
| border-radius: 6px;
| |
| padding: 2px 3px;
| |
| width: 292px;
| |
| background-color: #332f24;
| |
| }
| |
|
| |
| .info-card__header {
| |
| display: flex;
| |
| align-items: center;
| |
| justify-content: space-between;
| |
| margin-bottom: 4px;
| |
| }
| |
|
| |
| .info-card__header .heading {
| |
| font-size: 20px;
| |
| line-height: 1.5;
| |
| color: #dfcf99;
| |
| }
| |
|
| |
| .info-card__header .subheading {
| |
| padding-bottom: 4px;
| |
| font-size: 14px;
| |
| line-height: 1;
| |
| font-weight: bold;
| |
| }
| |
|
| |
| .info-card__body {
| |
| margin: 0;
| |
| border-style: solid;
| |
| border-width: 2px 1px;
| |
| border-color: #1a1812 #1f1c15 #474233;
| |
| border-radius: 6px;
| |
| background-color: #26231b;
| |
| }
| |
|
| |
| .info-card__body .block {
| |
| margin: 0;
| |
| padding: 0.5em 1em;
| |
| list-style: none;
| |
| }
| |
|
| |
| .info-card__body .block:first-child {
| |
| padding-top: 1em;
| |
| }
| |
|
| |
| .info-card__body .block:last-child {
| |
| padding-bottom: 1em;
| |
| }
| |
|
| |
| /* ===== Status Infocard (Template:Status) ===== */
| |
| .status-icon {
| |
| height: 96px;
| |
| }
| |
|
| |
| .status-icon .image,
| |
| .status-icon .frame {
| |
| height: 100%;
| |
| }
| |
|
| |
| .status-icon .image img {
| |
| margin-top: 16px;
| |
| width: 64px;
| |
| height: 64px;
| |
| }
| |
|
| |
| .status-icon .frame {
| |
| margin-top: -96px;
| |
| }
| |
|
| |
| .status-icon .frame img {
| |
| width: 98px;
| |
| height: 96px;
| |
| }
| |
|
| |
| /* ===== Disambiguation ([[Template:Disambiguation]]) ===== */
| |
| .dmbox {
| |
| display: flex;
| |
| align-items: center;
| |
| clear: both;
| |
| margin: 1em;
| |
| border-width: 1px 0;
| |
| border-style: solid;
| |
| border-color: #474233;
| |
| padding: 0.4em;
| |
| }
| |
|
| |
| .dmbox-image {
| |
| margin-right: 0.4em;
| |
| }
| |
|
| |
| /* ===== Discussion closed ([[Template:Discussion top]], [[Template:Discussion bottom]]) ===== */
| |
| .c-dcbox {
| |
| margin: 6px 0;
| |
| border: 1px solid #2c2b2b;
| |
| border-radius: 4px;
| |
| padding: 6px 1em;
| |
| background-color: #141414;
| |
| }
| |
|
| |
| .c-dcbox--resolved {
| |
| border-color: #678236;
| |
| background-color: #1b1c19;
| |
| }
| |
|
| |
| .c-dcbox--moved {
| |
| border-color: #585477;
| |
| background-color: #151517;
| |
| }
| |
|
| |
| .c-dcbox__header {
| |
| margin-bottom: 12px;
| |
| border-bottom: 1px solid #383736;
| |
| padding-bottom: 4px;
| |
| }
| |
|
| |
| .c-dcbox__status {
| |
| font-size: 1.1em;
| |
| font-weight: bold;
| |
| text-transform: uppercase;
| |
| }
| |
|
| |
| .c-dcbox__reminder {
| |
| font-size: 0.9em;
| |
| font-style: italic;
| |
| color: #5e4f45;
| |
| }
| |
|
| |
| /* ===== Blockquote ([[Template:Blockquote top]]) ===== */
| |
| .bqbox {
| |
| margin: 6px 1em;
| |
| border: 1px solid #293137;
| |
| border-radius: 4px;
| |
| padding: 6px 1em;
| |
| background-color: #141517;
| |
| }
| |
|
| |
| /* ===== Documentation ([[Template:Documentation]]) ===== */
| |
| .template-documentation {
| |
| clear: both;
| |
| margin: 14px 0 0;
| |
| border: 1px solid var(--documentation-border-color, #383736);
| |
| padding: 1em;
| |
| background-color: var(--documentation-background-color, #1c1b19);
| |
| }
| |
|
| |
| .template-documentation__start {
| |
| margin-bottom: 0.9em;
| |
| border-bottom: 1px solid var(--documentation-border-color, #383736);
| |
| padding-bottom: 3px;
| |
| }
| |
|
| |
| .template-documentation__heading {
| |
| font-size: 1.5em;
| |
| font-weight: bold;
| |
| }
| |
|
| |
| .template-documentation__end {
| |
| margin: 7px 0;
| |
| border: 1px solid var(--documentation-border-color, #383736);
| |
| padding: 1em;
| |
| font-style: italic;
| |
| background-color: var(--documentation-background-color, #1c1b19);
| |
| }
| |
|
| |
| .template-documentation__toolbar {
| |
| font-size: 0.8em;
| |
| font-style: normal;
| |
| }
| |
|
| |
| /* ===== Semantic text formatting, aka "text colors" ([[Template:C]]) ===== */
| |
| .tc {
| |
| font-style: normal;
| |
| }
| |
|
| |
| em.tc {
| |
| font-style: normal;
| |
| }
| |
|
| |
| em.tc.-i {
| |
| font-style: italic;
| |
| }
| |
|
| |
| .tc a {
| |
| color: inherit !important;
| |
| }
| |
|
| |
| .tc abbr {
| |
| color: inherit;
| |
| }
| |
|
| |
| .tc.-mod {
| |
| font-family: FontinSmallCaps, Verdana, Arial, Helvetica, sans-serif;
| |
| font-variant-ligatures: none;
| |
| color: var(--poe-color-augmented);
| |
| }
| |
|
| |
| .tc.-default,
| |
| .tc.-stat {
| |
| color: var(--poe-color-default);
| |
| }
| |
|
| |
| .tc.-valuedefault,
| |
| .tc.-value {
| |
| color: var(--poe-color-valuedefault);
| |
| }
| |
|
| |
| .tc.-fire {
| |
| color: var(--poe-color-fire);
| |
| }
| |
|
| |
| .tc.-cold {
| |
| color: var(--poe-color-cold);
| |
| }
| |
|
| |
| .tc.-lightning {
| |
| color: var(--poe-color-lightning);
| |
| }
| |
|
| |
| .tc.-chaos {
| |
| color: var(--poe-color-chaos);
| |
| }
| |
|
| |
| .tc.-augmented {
| |
| color: var(--poe-color-augmented);
| |
| }
| |
|
| |
| .tc.-crafted,
| |
| .tc.-craft {
| |
| color: var(--poe-color-crafted);
| |
| }
| |
|
| |
| .tc.-fractured {
| |
| color: var(--poe-color-fractured);
| |
| }
| |
|
| |
| .tc.-enchanted {
| |
| color: var(--poe-color-enchanted);
| |
| }
| |
|
| |
| .tc.-unmet {
| |
| color: var(--poe-color-unmet);
| |
| }
| |
|
| |
| .tc.-uniqueitem {
| |
| color: var(--poe-color-uniqueitem);
| |
| }
| |
|
| |
| .tc.-unique {
| |
| color: var(--poe-color-unique);
| |
| }
| |
|
| |
| .tc.-rareitem {
| |
| color: var(--poe-color-rareitem);
| |
| }
| |
|
| |
| .tc.-rare {
| |
| color: var(--poe-color-rare);
| |
| }
| |
|
| |
| .tc.-magicitem {
| |
| color: var(--poe-color-magicitem);
| |
| }
| |
|
| |
| .tc.-magic {
| |
| color: var(--poe-color-magic);
| |
| }
| |
|
| |
| .tc.-whiteitem,
| |
| .tc.-white {
| |
| color: var(--poe-color-whiteitem);
| |
| }
| |
|
| |
| .tc.-normal {
| |
| color: var(--poe-color-normal);
| |
| }
| |
|
| |
| .tc.-gemitem {
| |
| color: var(--poe-color-gemitem);
| |
| }
| |
|
| |
| .tc.-gem,
| |
| .tc.-gemdesc {
| |
| color: var(--poe-color-gem);
| |
| }
| |
|
| |
| .tc.-currencyitem {
| |
| color: var(--poe-color-currencyitem);
| |
| }
| |
|
| |
| .tc.-currency,
| |
| .tc.-cosmetic {
| |
| color: var(--poe-color-currency);
| |
| }
| |
|
| |
| .tc.-questitem {
| |
| color: var(--poe-color-questitem);
| |
| }
| |
|
| |
| .tc.-quest {
| |
| color: var(--poe-color-quest);
| |
| }
| |
|
| |
| .tc.-nemesismod,
| |
| .tc.-nemesis {
| |
| font-weight: bold;
| |
| color: var(--poe-color-nemesismod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-nemesismodoutline),
| |
| 1px -1px 0 var(--poe-color-nemesismodoutline),
| |
| -1px 1px 0 var(--poe-color-nemesismodoutline),
| |
| 1px 1px 0 var(--poe-color-nemesismodoutline);
| |
| }
| |
|
| |
| .tc.-talismanmod {
| |
| font-weight: bold;
| |
| color: var(--poe-color-talismanmod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-talismanmodoutline),
| |
| 1px -1px 0 var(--poe-color-talismanmodoutline),
| |
| -1px 1px 0 var(--poe-color-talismanmodoutline),
| |
| 1px 1px 0 var(--poe-color-talismanmodoutline);
| |
| }
| |
|
| |
| .tc.-title {
| |
| color: var(--poe-color-title);
| |
| }
| |
|
| |
| .tc.-corrupted {
| |
| color: var(--poe-color-corrupted);
| |
| }
| |
|
| |
| .tc.-favour {
| |
| color: var(--poe-color-favour);
| |
| }
| |
|
| |
| .tc.-supporterpacknewitem {
| |
| color: var(--poe-color-supporterpacknewitem);
| |
| }
| |
|
| |
| .tc.-supporterpackitem {
| |
| color: var(--poe-color-supporterpackitem);
| |
| }
| |
|
| |
| .tc.-bloodlinemod,
| |
| .tc.-bloodline {
| |
| font-weight: bold;
| |
| color: var(--poe-color-bloodlinemod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-bloodlinemodoutline),
| |
| 1px -1px 0 var(--poe-color-bloodlinemodoutline),
| |
| -1px 1px 0 var(--poe-color-bloodlinemodoutline),
| |
| 1px 1px 0 var(--poe-color-bloodlinemodoutline);
| |
| }
| |
|
| |
| .tc.-tormentmod,
| |
| .tc.-torment {
| |
| font-weight: bold;
| |
| color: var(--poe-color-tormentmod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-tormentmodoutline),
| |
| 1px -1px 0 var(--poe-color-tormentmodoutline),
| |
| -1px 1px 0 var(--poe-color-tormentmodoutline),
| |
| 1px 1px 0 var(--poe-color-tormentmodoutline);
| |
| }
| |
|
| |
| .tc.-canttradeormodify {
| |
| color: var(--poe-color-canttradeormodify);
| |
| }
| |
|
| |
| .tc.-lockedtoaccount {
| |
| color: var(--poe-color-lockedtoaccount);
| |
| }
| |
|
| |
| .tc.-divination,
| |
| .tc.-card {
| |
| color: var(--poe-color-divination);
| |
| }
| |
|
| |
| .tc.-prophecy {
| |
| color: var(--poe-color-prophecy);
| |
| }
| |
|
| |
| .tc.-essencemod,
| |
| .tc.-essence {
| |
| font-weight: bold;
| |
| color: var(--poe-color-essencemod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-essencemodoutline),
| |
| 1px -1px 0 var(--poe-color-essencemodoutline),
| |
| -1px 1px 0 var(--poe-color-essencemodoutline),
| |
| 1px 1px 0 var(--poe-color-essencemodoutline);
| |
| }
| |
|
| |
| .tc.-uniquefoil,
| |
| .tc.-foil {
| |
| color: var(--poe-color-uniquefoil);
| |
| }
| |
|
| |
| .tc.-legacy {
| |
| color: var(--poe-color-legacy);
| |
| }
| |
|
| |
| .tc.-bestiarymod,
| |
| .tc.-bestiary {
| |
| font-weight: bold;
| |
| color: var(--poe-color-bestiarymod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-bestiarymodoutline),
| |
| 1px -1px 0 var(--poe-color-bestiarymodoutline),
| |
| -1px 1px 0 var(--poe-color-bestiarymodoutline),
| |
| 1px 1px 0 var(--poe-color-bestiarymodoutline);
| |
| }
| |
|
| |
| .tc.-blightmod,
| |
| .tc.-blight {
| |
| font-weight: bold;
| |
| color: var(--poe-color-blightmod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-blightmodoutline),
| |
| 1px -1px 0 var(--poe-color-blightmodoutline),
| |
| -1px 1px 0 var(--poe-color-blightmodoutline),
| |
| 1px 1px 0 var(--poe-color-blightmodoutline);
| |
| }
| |
|
| |
| .tc.-afflictionmod,
| |
| .tc.-deliriummod,
| |
| .tc.-delirium {
| |
| font-weight: bold;
| |
| color: var(--poe-color-afflictionmod);
| |
| text-shadow: -1px -1px 0 var(--poe-color-afflictionmodoutline),
| |
| 1px -1px 0 var(--poe-color-afflictionmodoutline),
| |
| -1px 1px 0 var(--poe-color-afflictionmodoutline),
| |
| 1px 1px 0 var(--poe-color-afflictionmodoutline);
| |
| }
| |
|
| |
| .tc.-stackitemlevel {
| |
| color: var(--poe-color-stackitemlevel);
| |
| }
| |
|
| |
| .tc.-harvestprimary {
| |
| color: var(--poe-color-harvestprimary);
| |
| }
| |
|
| |
| .tc.-harvestsecondary {
| |
| color: var(--poe-color-harvestsecondary);
| |
| }
| |
|
| |
| .tc.-craftingcaster {
| |
| color: var(--poe-color-craftingcaster);
| |
| }
| |
|
| |
| .tc.-craftingphysical {
| |
| color: var(--poe-color-craftingphysical);
| |
| }
| |
|
| |
| .tc.-craftingfire {
| |
| color: var(--poe-color-craftingfire);
| |
| }
| |
|
| |
| .tc.-craftingcold {
| |
| color: var(--poe-color-craftingcold);
| |
| }
| |
|
| |
| .tc.-craftinglightning {
| |
| color: var(--poe-color-craftinglightning);
| |
| }
| |
|
| |
| .tc.-craftingchaos {
| |
| color: var(--poe-color-craftingchaos);
| |
| }
| |
|
| |
| .tc.-craftingspeed {
| |
| color: var(--poe-color-craftingspeed);
| |
| }
| |
|
| |
| .tc.-craftingcrit {
| |
| color: var(--poe-color-craftingcrit);
| |
| }
| |
|
| |
| .tc.-craftingred {
| |
| color: var(--poe-color-craftingred);
| |
| }
| |
|
| |
| .tc.-craftingblue {
| |
| color: var(--poe-color-craftingblue);
| |
| }
| |
|
| |
| .tc.-craftinggreen {
| |
| color: var(--poe-color-craftinggreen);
| |
| }
| |
|
| |
| .tc.-craftinglife {
| |
| color: var(--poe-color-craftinglife);
| |
| }
| |
|
| |
| .tc.-craftingdefences {
| |
| color: var(--poe-color-craftingdefences);
| |
| }
| |
|
| |
| .tc.-craftingattack {
| |
| color: var(--poe-color-craftingattack);
| |
| }
| |
|
| |
| .tc.-help {
| |
| font-style: italic;
| |
| color: var(--poe-color-default);
| |
| }
| |
|
| |
| .tc.-flavour {
| |
| font-style: italic;
| |
| color: var(--poe-color-unique);
| |
| }
| |
|
| |
| .tc.-hellscaped .tc.-scourge {
| |
| color: var(--poe-color-hellscaped);
| |
| }
| |
|
| |
| .tc.-primal {
| |
| color: cyan;
| |
| }
| |
|
| |
| .tc.-vivid {
| |
| color: yellow;
| |
| }
| |
|
| |
| .tc.-wild {
| |
| color: magenta;
| |
| }
| |
|
| |
| /* Used in legacy variant tables. */
| |
| .tc.-not {
| |
| text-decoration: line-through;
| |
| color: var(--poe-color-default);
| |
| }
| |
|
| |
| /* ===== Item box ([[Template:Item]]) ===== */
| |
| .item-box {
| |
| display: inline-block;
| |
| box-sizing: border-box;
| |
| border-width: 1px;
| |
| border-style: solid;
| |
| padding: 2px;
| |
| min-width: 220px;
| |
| max-width: 440px;
| |
| text-align: center;
| |
| font-family: var(--stylized-smallcaps-font);
| |
| font-size: 15px;
| |
| line-height: 20px;
| |
| font-weight: normal;
| |
| font-style: normal;
| |
| font-variant-ligatures: none;
| |
| color: var(--poe-color-default);
| |
| background-color: #000;
| |
| }
| |
|
| |
| .item-box a,
| |
| .item-box a:visited,
| |
| .item-box a:active {
| |
| color: unset;
| |
| }
| |
|
| |
| .item-box.-normal {
| |
| border-color: var(--poe-color-normal);
| |
| }
| |
|
| |
| .item-box.-magic {
| |
| border-color: var(--poe-color-magic);
| |
| }
| |
|
| |
| .item-box.-rare {
| |
| border-color: var(--poe-color-rare);
| |
| }
| |
|
| |
| .item-box.-unique {
| |
| border-color: var(--poe-color-unique);
| |
| }
| |
|
| |
| .item-box.-currency {
| |
| border-color: var(--poe-color-currency);
| |
| }
| |
|
| |
| .item-box.-gem {
| |
| border-color: var(--poe-color-gem);
| |
| }
| |
|
| |
| .item-box.-quest {
| |
| border-color: var(--poe-color-quest);
| |
| }
| |
|
| |
| .item-box > .header {
| |
| display: block;
| |
| overflow: hidden;
| |
| position: relative;
| |
| text-overflow: ellipsis;
| |
| white-space: nowrap;
| |
| font-size: 21px;
| |
| background-position: top left, top right, top center;
| |
| background-repeat: no-repeat, no-repeat, repeat-x;
| |
| background-size: contain;
| |
| }
| |
|
| |
| .item-box > .header > .symbol {
| |
| content: "";
| |
| display: block;
| |
| position: absolute;
| |
| top: 0;
| |
| background-position: center;
| |
| background-repeat: no-repeat;
| |
| }
| |
|
| |
| .item-box > .header > .symbol:first-child {
| |
| left: 0;
| |
| }
| |
|
| |
| .item-box > .header > .symbol:last-child {
| |
| right: 0;
| |
| }
| |
|
| |
| .item-box.-normal > .header {
| |
| color: var(--poe-color-normal);
| |
| }
| |
|
| |
| .item-box.-magic > .header {
| |
| color: var(--poe-color-magic);
| |
| }
| |
|
| |
| .item-box.-rare > .header {
| |
| color: var(--poe-color-rare);
| |
| }
| |
|
| |
| .item-box.-unique > .header {
| |
| color: var(--poe-color-unique);
| |
| }
| |
|
| |
| .item-box.-currency > .header {
| |
| color: var(--poe-color-currency);
| |
| }
| |
|
| |
| .item-box.-gem > .header {
| |
| color: var(--poe-color-gem);
| |
| }
| |
|
| |
| .item-box.-quest > .header {
| |
| color: var(--poe-color-quest);
| |
| }
| |
|
| |
| .item-box > .header.-single {
| |
| padding: 5px 30px;
| |
| height: 28px;
| |
| line-height: 26px;
| |
| }
| |
|
| |
| .item-box > .header.-single > .symbol {
| |
| width: 30px;
| |
| height: 38px;
| |
| }
| |
|
| |
| .item-box.-normal > .header.-single {
| |
| /* [[File:Item UI header normal left.png]], [[File:Item UI header normal right.png]], [[File:Item UI header normal middle.png]] */
| |
| background-image: url("/w/images/3/3a/Item_UI_header_normal_left.png"),
| |
| url("/w/images/5/54/Item_UI_header_normal_right.png"),
| |
| url("/w/images/8/8e/Item_UI_header_normal_middle.png");
| |
| }
| |
|
| |
| .item-box.-magic > .header.-single {
| |
| /* [[File:Item UI header magic left.png]], [[File:Item UI header magic right.png]], [[File:Item UI header magic middle.png]] */
| |
| background-image: url("/w/images/4/4c/Item_UI_header_magic_left.png"),
| |
| url("/w/images/5/55/Item_UI_header_magic_right.png"),
| |
| url("/w/images/a/a3/Item_UI_header_magic_middle.png");
| |
| }
| |
|
| |
| .item-box > .header.-double {
| |
| padding: 6px 45px;
| |
| height: 51px;
| |
| line-height: 24px;
| |
| }
| |
|
| |
| .item-box > .header.-double > .symbol {
| |
| width: 30px;
| |
| height: 63px;
| |
| }
| |
|
| |
| .item-box.-rare > .header.-double {
| |
| /* [[File:Item UI header rare left.png]], [[File:Item UI header rare right.png]], [[File:Item UI header rare middle.png]] */
| |
| background-image: url("/w/images/0/07/Item_UI_header_double_rare_left.png"),
| |
| url("/w/images/f/f9/Item_UI_header_double_rare_right.png"),
| |
| url("/w/images/f/fd/Item_UI_header_double_rare_middle.png");
| |
| }
| |
|
| |
| .item-box.-unique > .header.-double {
| |
| /* [[File:Item UI header unique left.png]], [[File:Item UI header unique right.png]], [[File:Item UI header unique middle.png]] */
| |
| background-image: url("/w/images/b/b7/Item_UI_header_double_unique_left.png"),
| |
| url("/w/images/c/c2/Item_UI_header_double_unique_right.png"),
| |
| url("/w/images/e/e1/Item_UI_header_double_unique_middle.png");
| |
| }
| |
|
| |
| .item-stats {
| |
| display: block;
| |
| padding: 5px 12px 7px;
| |
| }
| |
|
| |
| .item-stats.-nopad {
| |
| padding: 0;
| |
| }
| |
|
| |
| .item-stats > .group {
| |
| display: block;
| |
| margin: 0 auto;
| |
| }
| |
|
| |
| .item-stats > .group:nth-last-child(n + 2)::after,
| |
| .item-stat-separator::before {
| |
| content: "";
| |
| display: block;
| |
| margin: 0 auto;
| |
| width: auto;
| |
| height: 11px;
| |
| background-position: center center;
| |
| background-repeat: no-repeat;
| |
| }
| |
|
| |
| .item-box.-normal > .item-stats > .group::after,
| |
| .item-stat-separator.-normal::before {
| |
| /* [[File:Item UI separator normal.png]] */
| |
| background-image: url("/w/images/b/bd/Item_UI_separator_normal.png");
| |
| }
| |
|
| |
| .item-box.-magic > .item-stats > .group::after,
| |
| .item-stat-separator.-magic::before {
| |
| /* [[File:Item UI separator magic.png]] */
| |
| background-image: url("/w/images/8/86/Item_UI_separator_magic.png");
| |
| }
| |
|
| |
| .item-box.-rare > .item-stats > .group::after,
| |
| .item-stat-separator.-rare::before {
| |
| /* [[File:Item UI separator rare.png]] */
| |
| background-image: url("/w/images/6/67/Item_UI_separator_rare.png");
| |
| }
| |
|
| |
| .item-box.-unique > .item-stats > .group::after,
| |
| .item-stat-separator.-unique::before {
| |
| /* [[File:Item UI separator unique.png]] */
| |
| background-image: url("/w/images/8/8a/Item_UI_separator_unique.png");
| |
| }
| |
|
| |
| /* for [[Module:Item]] */
| |
| .infobox-page-container {
| |
| display: flex;
| |
| flex-direction: column;
| |
| float: right;
| |
| clear: right;
| |
| margin-left: 14px;
| |
| }
| |
|
| |
| .infobox-page-container > .item-box {
| |
| margin-bottom: 1em;
| |
| }
| |
|
| |
| .infobox-page-container em.header {
| |
| font-size: 1.3em;
| |
| font-style: normal;
| |
| font-weight: bold;
| |
| display: inline-block;
| |
| margin-bottom: 0.5em;
| |
| }
| |
|
| |
| /* ===== Item hoverbox ([[Template:Item link]]) ===== */
| |
| .c-item-hoverbox {
| |
| display: inline-block;
| |
| }
| |
|
| |
| .c-item-hoverbox__display {
| |
| display: block;
| |
| visibility: hidden;
| |
| opacity: 0;
| |
| position: absolute;
| |
| padding: 8px;
| |
| transition: opacity 0.25s;
| |
| }
| |
|
| |
| .c-item-hoverbox__display.is-visible {
| |
| visibility: visible;
| |
| opacity: 1;
| |
| }
| |
|
| |
| .c-item-hoverbox__display > .item-box + img {
| |
| position: absolute;
| |
| top: 0;
| |
| left: 100%;
| |
| }
| |
|
| |
| .c-item-hoverbox__display.is-left-of-activator > .item-box + img,
| |
| .c-item-hoverbox__display.is-above-activator.is-right-side-of-viewport
| |
| > .item-box
| |
| + img,
| |
| .c-item-hoverbox__display.is-below-activator.is-right-side-of-viewport
| |
| > .item-box
| |
| + img {
| |
| left: auto;
| |
| right: 100%;
| |
| }
| |
|
| |
| .c-item-hoverbox__activator {
| |
| display: flex;
| |
| align-items: center;
| |
| gap: 0.25rem;
| |
| }
| |
|
| |
| .c-item-hoverbox--large .c-item-hoverbox__activator {
| |
| flex-direction: column;
| |
| align-items: stretch;
| |
| }
| |
|
| |
| .c-item-hoverbox--large {
| |
| text-align: center;
| |
| width: 100%;
| |
| }
| |
|
| |
| /* ===== Math block ([[Template:Math]]) ===== */
| |
| .c-math-block {
| |
| display: flex;
| |
| align-items: center;
| |
| white-space: nowrap;
| |
| }
| |
|
| |
| .c-math-block__formula {
| |
| flex: 1 0 auto;
| |
| }
| |
|
| |
| .c-math-block__formula .mwe-math-fallback-image-display {
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
| }
| |
|
| |
| .c-math-block__ref {
| |
| flex: 0 1 auto;
| |
| font-weight: bold;
| |
| }
| |
|
| |
| /* ===== Keyboard key ([[Template:Key press]]) ===== */
| |
| .keyboard-key {
| |
| display: inline-block;
| |
| position: relative;
| |
| top: -3px;
| |
| border-radius: 4px;
| |
| padding: 0 5px;
| |
| font-family: inherit;
| |
| font-size: 0.86em;
| |
| line-height: 1.25;
| |
| font-weight: normal;
| |
| color: #fff;
| |
| white-space: nowrap;
| |
| background-color: #4f4d4a;
| |
| box-shadow: 0 3px #2f2e2c;
| |
| transform: perspective(42px) rotateX(10deg);
| |
| }
| |
|
| |
| /* ===== Table cell templates ([[Template:Yes]], [[Template:No]], [[Template:N/a]]) ===== */
| |
| table.wikitable .table-yes,
| |
| table.wikitable .table-no,
| |
| table.wikitable .table-na {
| |
| vertical-align: middle;
| |
| text-align: center;
| |
| }
| |
|
| |
| @media screen {
| |
| table.wikitable .table-na {
| |
| color: var(--subdued-text-color);
| |
| }
| |
| }
| |
|
| |
| /* ===== Horizontal lists ([[Template:Flatlist]]) ===== */
| |
| .hlist dl,
| |
| .hlist ol,
| |
| .hlist ul {
| |
| margin: 0;
| |
| padding: 0;
| |
| }
| |
|
| |
| .hlist dd,
| |
| .hlist dt,
| |
| .hlist li {
| |
| margin: 0;
| |
| display: inline;
| |
| }
| |
|
| |
| .hlist dl dl,
| |
| .hlist dl ol,
| |
| .hlist dl ul,
| |
| .hlist ol dl,
| |
| .hlist ol ol,
| |
| .hlist ol ul,
| |
| .hlist ul dl,
| |
| .hlist ul ol,
| |
| .hlist ul ul {
| |
| display: inline;
| |
| }
| |
|
| |
| .hlist .mw-empty-li {
| |
| display: none;
| |
| }
| |
|
| |
| .hlist dt::after {
| |
| content: ": ";
| |
| }
| |
|
| |
| .hlist dd::after,
| |
| .hlist li::after {
| |
| content: " · ";
| |
| font-weight: bold;
| |
| }
| |
|
| |
| .hlist dd:last-child::after,
| |
| .hlist dt:last-child::after,
| |
| .hlist li:last-child::after {
| |
| content: none;
| |
| }
| |
|
| |
| .hlist dd dd:first-child::before,
| |
| .hlist dd dt:first-child::before,
| |
| .hlist dd li:first-child::before,
| |
| .hlist dt dd:first-child::before,
| |
| .hlist dt dt:first-child::before,
| |
| .hlist dt li:first-child::before,
| |
| .hlist li dd:first-child::before,
| |
| .hlist li dt:first-child::before,
| |
| .hlist li li:first-child::before {
| |
| content: " (";
| |
| font-weight: normal;
| |
| }
| |
|
| |
| .hlist dd dd:last-child::after,
| |
| .hlist dd dt:last-child::after,
| |
| .hlist dd li:last-child::after,
| |
| .hlist dt dd:last-child::after,
| |
| .hlist dt dt:last-child::after,
| |
| .hlist dt li:last-child::after,
| |
| .hlist li dd:last-child::after,
| |
| .hlist li dt:last-child::after,
| |
| .hlist li li:last-child::after {
| |
| content: ")";
| |
| font-weight: normal;
| |
| }
| |
|
| |
| .hlist ol {
| |
| counter-reset: listitem;
| |
| }
| |
|
| |
| .hlist ol > li {
| |
| counter-increment: listitem;
| |
| }
| |
|
| |
| .hlist ol > li::before {
| |
| content: " " counter(listitem) "\a0";
| |
| }
| |
|
| |
| .hlist dd ol > li:first-child::before,
| |
| .hlist dt ol > li:first-child::before,
| |
| .hlist li ol > li:first-child::before {
| |
| content: " (" counter(listitem) "\a0";
| |
| }
| |
|
| |
| /* ===== Plain list ([[Template:Plainlist]]) ===== */
| |
| .plainlist ol,
| |
| .plainlist ul {
| |
| margin: 0;
| |
| padding: 0;
| |
| line-height: inherit;
| |
| list-style: none;
| |
| }
| |
|
| |
| .plainlist ol li,
| |
| .plainlist ul li {
| |
| margin-bottom: 0;
| |
| }
| |
|
| |
| /* ===== Main page ===== */
| |
| .page-Path_of_Exile_2_Wiki.action-view .firstHeading,
| |
| .page-Path_of_Exile_2_Wiki.action-submit .firstHeading {
| |
| display: none;
| |
| }
| |
|
| |
| .mainpage-header {
| |
| margin-bottom: 32px;
| |
| text-align: center;
| |
| }
| |
|
| |
| .mainpage-header h1 {
| |
| margin-bottom: 20px;
| |
| border: none;
| |
| line-height: 1.1 !important;
| |
| color: #ffaf46 !important;
| |
| text-shadow: 0 0 10px rgb(209 28 0 / 100%);
| |
| }
| |
|
| |
| .mainpage-header .h1-1,
| |
| .mainpage-header .h1-2 {
| |
| background: radial-gradient(
| |
| ellipse at center,
| |
| rgb(154 2 0 / 90%) 0%,
| |
| rgb(154 2 0 / 0%) 65%,
| |
| rgb(154 2 0 / 0%) 100%
| |
| );
| |
| }
| |
|
| |
| .mainpage-header .h1-1 {
| |
| font-size: 26px;
| |
| letter-spacing: 0.07em;
| |
| }
| |
|
| |
| .mainpage-header .h1-2 {
| |
| padding: 0 0.2em;
| |
| font-size: 38px;
| |
| font-weight: bold;
| |
| letter-spacing: 0.01em;
| |
| }
| |
|
| |
| .mainpage-version {
| |
| display: table;
| |
| border-collapse: collapse;
| |
| width: 100%;
| |
| }
| |
|
| |
| .mainpage-version > div {
| |
| display: table-cell;
| |
| vertical-align: middle;
| |
| }
| |
|
| |
| .mainpage-version > div:first-child {
| |
| width: 100%;
| |
| }
| |
|
| |
| .mainpage-version > div:last-child {
| |
| text-align: center;
| |
| }
| |
|
| |
| .mainpage-news {
| |
| margin: -12px -0.7em;
| |
| }
| |
|
| |
| .mainpage-news > div {
| |
| display: table;
| |
| border-collapse: separate;
| |
| border-spacing: 12px 0.7em;
| |
| }
| |
|
| |
| .mainpage-news > div > div {
| |
| display: table-row;
| |
| }
| |
|
| |
| .mainpage-news .date,
| |
| .mainpage-news .title {
| |
| display: table-cell;
| |
| vertical-align: middle;
| |
| }
| |
|
| |
| .mainpage-news .date > div {
| |
| border-radius: 6px;
| |
| width: 40px;
| |
| height: 40px;
| |
| text-align: center;
| |
| font-size: 122%;
| |
| line-height: 1.1;
| |
| background-color: #332f24;
| |
| }
| |
|
| |
| .mainpage-skills {
| |
| width: 100%;
| |
| text-align: center;
| |
| }
| |
|
| |
| .mainpage-skills tr + tr td {
| |
| padding-top: 12px;
| |
| }
| |
|
| |
| .mainpage-equipment {
| |
| width: 100%;
| |
| text-align: center;
| |
| }
| |
|
| |
| .mainpage-equipment tr + tr td {
| |
| padding-top: 12px;
| |
| }
| |
|
| |
| .mainpage-acts {
| |
| width: 100%;
| |
| }
| |
|
| |
| .mainpage-acts td {
| |
| vertical-align: top;
| |
| }
| |
|
| |
| .mainpage-mechanics {
| |
| width: 100%;
| |
| }
| |
|
| |
| .mainpage-mechanics td {
| |
| vertical-align: top;
| |
| }
| |
|
| |
| /* ===== Helpers ===== */
| |
|
| |
| /* Clearfix */
| |
| .clearfix::after {
| |
| content: "";
| |
| display: table;
| |
| clear: both;
| |
| }
| |
|
| |
| /* ===== Monster category icons ([[Template:Monster category icon]]) ===== */
| |
| .mon-cat {
| |
| display: inline-block;
| |
| margin-right: 0.15em;
| |
| width: 1.265em;
| |
| height: 1.265em;
| |
| vertical-align: middle;
| |
|
| |
| /* [[File:Monster category icons.png]] */
| |
| background: url("/w/images/c/c3/Monster_category_icons.png") no-repeat;
| |
| background-size: auto 1.265em;
| |
| }
| |
|
| |
| .mon-cat.-demon {
| |
| background-position-x: calc(-1.265em * 0);
| |
| }
| |
|
| |
| .mon-cat.-humanoid {
| |
| background-position-x: calc(-1.265em * 1);
| |
| }
| |
|
| |
| .mon-cat.-eldritch {
| |
| background-position-x: calc(-1.265em * 2);
| |
| }
| |
|
| |
| .mon-cat.-beast {
| |
| background-position-x: calc(-1.265em * 3);
| |
| }
| |
|
| |
| .mon-cat.-construct {
| |
| background-position-x: calc(-1.265em * 4);
| |
| }
| |
|
| |
| .mon-cat.-undead {
| |
| background-position-x: calc(-1.265em * 5);
| |
| }
| |
|
| |
| /* ===== Hoverbox ([[Template:Tooltip]], [[Template:Item link]]) ===== */
| |
| .hoverbox {
| |
| display: inline-block;
| |
| }
| |
|
| |
| .hoverbox__display {
| |
| display: block;
| |
| visibility: hidden;
| |
| opacity: 0;
| |
| position: absolute;
| |
| padding: 8px;
| |
| transition: opacity 0.25s;
| |
| }
| |
|
| |
| .hoverbox__display.is-visible {
| |
| visibility: visible;
| |
| opacity: 1;
| |
| }
| |
|
| |
| .hoverbox__activator {
| |
| display: inline;
| |
| }
| |
|
| |
| .hoverbox__icon {
| |
| vertical-align: -0.125em;
| |
| }
| |
|
| |
| .hoverbox-display-container {
| |
| position: fixed;
| |
| z-index: 9999;
| |
| width: 100%;
| |
| }
| |
|
| |
| /* ===== Tooltip hoverbox ([[Template:Tooltip]]) ===== */
| |
| .c-tooltip__activator {
| |
| position: relative;
| |
| border-bottom-width: 1px;
| |
| border-bottom-style: dotted;
| |
| border-bottom-color: initial;
| |
| cursor: help;
| |
| }
| |
|
| |
| .c-tooltip__display {
| |
| box-sizing: border-box;
| |
| border: 1px solid #7f7f7f;
| |
| padding: 0.5em 1.5em;
| |
| text-align: unset;
| |
| max-width: 32em;
| |
| font-size: 12px;
| |
| line-height: 1.5;
| |
| font-weight: normal;
| |
| color: #7f7f7f;
| |
| background-color: #000;
| |
| }
| |
|
| |
| /* ===== Tip ([[Template:Tip]]) ===== */
| |
| .tip {
| |
| background-color: oklab(16% 0 0.01 / 100%);
| |
| padding: 0.75rem 1rem;
| |
| border-inline-start: solid 0.2rem oklab(70% -0.1 0.08);
| |
| margin-block: 1rem;
| |
| box-sizing: border-box;
| |
|
| |
| p {
| |
| color: #bbad98;
| |
| margin: 0;
| |
| }
| |
|
| |
| p:first-child {
| |
| color: oklab(80% -0.1 0.08);
| |
| font-weight: 600;
| |
| font-family: var(--stylized-smallcaps-font);
| |
| margin-block-end: -0.125rem;
| |
| }
| |
| }
| |
|
| |
| /* ===== Tip ([[Template:Quest]]) ===== */
| |
| .quest-table {
| |
| --table-bg-color: oklab(18% 0 0.01);
| |
| --border-color: var(--horizontal-rule-color);
| |
| --header-bg-color: color-mix(in oklab, var(--table-bg-color), white 10%);
| |
| --quest-title-color: color-mix(in oklab, var(--text-color), var(--poe-color-quest));
| |
|
| |
| float: right;
| |
| border-collapse: collapse;
| |
| margin-inline-start: 1rem;
| |
| background: var(--table-bg-color);
| |
| width: 400px;
| |
|
| |
| .quest-table-iconbox {
| |
| text-align: center;
| |
| font-size: 1.5rem;
| |
| font-family: var(--stylized-smallcaps-font);
| |
| color: var(--quest-title-color);
| |
| padding-block: 1rem;
| |
| }
| |
|
| |
| td, th {
| |
| border: 1px solid var(--border-color);
| |
| padding: 0.5rem 0.75rem;
| |
| }
| |
|
| |
| th {
| |
| text-align: start;
| |
| background: var(--header-bg-color);
| |
|
| |
| /* fits width to content size */
| |
| width: 0;
| |
| }
| |
| }
| |
|
| |
| /* ===== Module:Passive skill ===== */
| |
| .passive-line {
| |
| display: block;
| |
| }
| |
|
| |
| .passive-hover {
| |
| display: none;
| |
| position: relative;
| |
| }
| |
|
| |
| :is(.passive-line, .passive-hover):hover, .passive-hover {
| |
| display: inline;
| |
| }
| |
|
| |
| .passive-icon-container {
| |
| position: relative;
| |
| margin: 0 auto;
| |
|
| |
| a {
| |
| position: absolute;
| |
| z-index: 0;
| |
| }
| |
| }
| |
|
| |
| .passive-icon-frame {
| |
| position: absolute;
| |
| z-index: 10;
| |
| pointer-events: none;
| |
| }
| |
|
| |
| /* sizes of icons have been adjusted to look similar to ingame placement */
| |
| .passive-icon-type__basic {
| |
| width: 60px;
| |
| height: 60px;
| |
|
| |
| .passive-icon-frame {
| |
| width: 60px;
| |
| height: 60px;
| |
| background-image: url("/w/images/a/a1/Basic_passive_frame.png");
| |
| background-repeat: round;
| |
| }
| |
|
| |
| :is(a, img) {
| |
| left: 10px;
| |
| top: 10px;
| |
| width: 40px;
| |
| height: 40px;
| |
| }
| |
| }
| |
|
| |
| .passive-icon-type__notable {
| |
| width: 100px;
| |
| height: 100px;
| |
|
| |
| .passive-icon-frame {
| |
| width: 100px;
| |
| height: 100px;
| |
| background-image: url("/w/images/5/50/Notable_passive_frame.png");
| |
| background-repeat: round;
| |
| }
| |
|
| |
| :is(a, img) {
| |
| left: 14px;
| |
| top: 14px;
| |
| width: 72px;
| |
| height: 72px;
| |
| }
| |
| }
| |
|
| |
| .passive-icon-type__keystone {
| |
| width: 175px;
| |
| height: 175px;
| |
|
| |
| .passive-icon-frame {
| |
| width: 175px;
| |
| height: 175px;
| |
| background-image: url("/w/images/5/5a/Keystone_passive_frame.png");
| |
| background-repeat: round;
| |
| }
| |
|
| |
| :is(a, img) {
| |
| left: 36px;
| |
| top: 36px;
| |
| height: 100px;
| |
| width: 100px;
| |
| }
| |
| }
| |
|
| |
| .passive-icon-type__ascendancy_basic {
| |
| width: 60px;
| |
| height: 60px;
| |
|
| |
| .passive-icon-frame {
| |
| width: 60px;
| |
| height: 60px;
| |
| background-image: url("/w/images/f/fa/Ascendancy_basic_passive_frame.png");
| |
| background-repeat: round;
| |
| }
| |
|
| |
| :is(a, img) {
| |
| left: 10px;
| |
| top: 10px;
| |
| width: 39px;
| |
| height: 40px;
| |
| }
| |
| }
| |
|
| |
| .passive-icon-type__ascendancy_notable {
| |
| width: 100px;
| |
| height: 100px;
| |
|
| |
| .passive-icon-frame {
| |
| width: 100px;
| |
| height: 100px;
| |
| background-image: url("/w/images/2/26/Ascendancy_notable_passive_frame.png");
| |
| background-repeat: round;
| |
| }
| |
|
| |
| :is(a, img) {
| |
| left: 16px;
| |
| top: 16px;
| |
| width: 68px;
| |
| height: 68px;
| |
| }
| |
| }
| |
|
| |
| .passive-icon-type__mastery {
| |
| width: 100px;
| |
| height: 100px;
| |
|
| |
| .passive-icon-frame {
| |
| width: 100px;
| |
| height: 100px;
| |
| background-image: url("/w/images/1/16/PassiveMasteryConnectedButton.png");
| |
| background-repeat: round;
| |
| }
| |
|
| |
| :is(a, img) {
| |
| left: 0;
| |
| top: 0;
| |
| width: 100px;
| |
| height: 100px;
| |
| z-index: 11;
| |
| }
| |
| }
| |
|
| |
| .mastery_infocard {
| |
| width: auto;
| |
|
| |
| table {
| |
| text-align: left;
| |
| }
| |
| }
| |
|
| |
| /* ===== Navboxes ===== */
| |
| .navbox {
| |
| border: 1px solid var(--horizontal-rule-color);
| |
|
| |
| table {
| |
| border-collapse: collapse;
| |
| margin: auto;
| |
| }
| |
|
| |
| .navbox-list {
| |
| border-inline: 0 !important;
| |
| }
| |
|
| |
| .navbox-group {
| |
| padding-inline: 1rem;
| |
| border-inline: 0 !important;
| |
| text-align: right;
| |
| }
| |
|
| |
| .navbox-subgroup .navbox-group {
| |
| background: oklab(0.20 0 0.01 / 1)
| |
| }
| |
| }
| |