|
|
| Line 1: |
Line 1: |
| /* | | /* Bottom collapse controls */ |
| * Wizards & Warlords shared content styling.
| | mw.loader.using('jquery.makeCollapsible').then(function () { |
| *
| | var exampleTableQuery = window.matchMedia('(max-width: 899px)'); |
| * This file is loaded by every skin. Keep reusable article typography,
| |
| * templates, cards, tables, navboxes, and other content components here.
| |
| * Skin shells and navigation belong in the relevant skin stylesheet.
| |
| */
| |
|
| |
|
| /* ==========================================================================
| | function updateExampleTableState($table) { |
| Responsive Layout Standard
| | $table |
| --------------------------------------------------------------------------
| | .children('caption') |
| Project-wide layout ranges:
| | .attr('aria-expanded', $table.hasClass('mw-collapsed') ? 'false' : 'true'); |
| - Phone: 0-599px
| |
| - Tablet / large phone: 600-899px
| |
| - Small desktop / landscape: 900-1199px
| |
| - Full desktop: 1200px+
| |
| Component-specific queries should use these boundaries unless a documented
| |
| intrinsic-size constraint requires an additional breakpoint.
| |
| ========================================================================== */
| |
| | |
| /* ==========================================================================
| |
| Shared Content Variables
| |
| --------------------------------------------------------------------------
| |
| Skin stylesheets may override these tokens, but shared components always
| |
| have a stable dark-fantasy fallback.
| |
| ========================================================================== */
| |
| :root {
| |
| --wiz-content-background: #222;
| |
| --wiz-panel-solid-background: #0f0f0f;
| |
| --wiz-content-border: #ff942d;
| |
| --wiz-text: #d2d2d2;
| |
| --wiz-link: #ff942d;
| |
| --wiz-heading: #e7e1d4; | |
| }
| |
| | |
| /* ==========================================================================
| |
| Shared Article Typography
| |
| --------------------------------------------------------------------------
| |
| These selectors are intentionally skin-neutral and lower-specificity than
| |
| the current Vector compatibility rules. Vector therefore remains visually
| |
| unchanged while Citizen receives the same article rhythm and colours.
| |
| ========================================================================== */
| |
| .mw-body-content {
| |
| color: var(--wiz-text);
| |
| font-size: 14px;
| |
| line-height: 1.6;
| |
| }
| |
| | |
| .mw-parser-output > ul,
| |
| .mw-parser-output > ol,
| |
| .mw-parser-output .toc-page > ul,
| |
| .mw-parser-output .toc-page > ol {
| |
| margin: 8px 0 12px 28px;
| |
| padding-left: 20px;
| |
| text-align: left;
| |
| }
| |
| | |
| .mw-parser-output > ul,
| |
| .mw-parser-output .toc-page > ul {
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .mw-parser-output ul ul,
| |
| .mw-parser-output .toc-page > ul ul {
| |
| margin: 4px 0 6px 22px;
| |
| padding-left: 18px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .mw-parser-output > ol,
| |
| .mw-parser-output .toc-page > ol {
| |
| list-style: decimal outside;
| |
| }
| |
| | |
| .mw-parser-output > ul > li,
| |
| .mw-parser-output > ol > li,
| |
| .mw-parser-output .toc-page > ul > li,
| |
| .mw-parser-output .toc-page > ol > li {
| |
| display: list-item;
| |
| margin-bottom: 4px;
| |
| }
| |
| | |
| .mw-parser-output ul ul > li,
| |
| .mw-parser-output .toc-page > ul ul > li {
| |
| display: list-item;
| |
| margin-bottom: 3px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .mw-parser-output li::marker {
| |
| color: var(--wiz-text);
| |
| }
| |
| | |
| /* MediaWiki wraps generated headings in .mw-heading on current versions. */
| |
| .mw-parser-output .mw-heading {
| |
| box-sizing: border-box;
| |
| margin: 20px 0 10px;
| |
| padding: 0;
| |
| border-bottom: 0;
| |
| color: var(--wiz-heading);
| |
| text-align: left;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading2 {
| |
| margin-top: 21px;
| |
| margin-bottom: 5px;
| |
| border-bottom: 1px solid var(--wiz-content-border);
| |
| }
| |
| | |
| .mw-parser-output .mw-heading3 {
| |
| margin-top: 5px;
| |
| margin-bottom: 10px;
| |
| padding-top: 8px;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading4 {
| |
| margin-top: 4px;
| |
| margin-bottom: 10px;
| |
| padding-top: 7px;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading h2,
| |
| .mw-parser-output .mw-heading h3,
| |
| .mw-parser-output .mw-heading h4,
| |
| .mw-parser-output .mw-heading h5,
| |
| .mw-parser-output .mw-heading h6 {
| |
| margin: 0;
| |
| padding: 0;
| |
| border-bottom: 0;
| |
| color: var(--wiz-heading);
| |
| text-align: left;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading h2 {
| |
| font-size: 24px;
| |
| font-weight: normal;
| |
| line-height: 30px;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading h3 {
| |
| font-size: 18px;
| |
| font-weight: bold;
| |
| line-height: 24px;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading h4 {
| |
| font-size: 14px;
| |
| font-weight: bold;
| |
| line-height: 1.6;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading h5,
| |
| .mw-parser-output .mw-heading h6 {
| |
| font-size: 15px;
| |
| font-weight: bold;
| |
| line-height: 21px;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading .mw-headline,
| |
| .mw-parser-output .mw-heading a {
| |
| border-bottom: 0;
| |
| color: var(--wiz-heading);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .mw-parser-output .mw-heading .mw-editsection,
| |
| .mw-parser-output .mw-heading .mw-editsection a {
| |
| color: var(--wiz-link);
| |
| font-size: 12px;
| |
| line-height: 1;
| |
| text-decoration: none;
| |
| }
| |
| | |
| /* Shared homepage navigation-list links. Descriptive text following each link
| |
| remains normal weight because only the anchor itself is emphasized. */
| |
| .wizlords-mainpage-link-list a,
| |
| .wizlords-mainpage-whatislarp-list a {
| |
| color: var(--wiz-link, #ff942d);
| |
| font-weight: normal;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-mainpage-link-list a:hover,
| |
| .wizlords-mainpage-whatislarp-list a:hover {
| |
| color: #ffd37a;
| |
| text-decoration: none;
| |
| }
| |
| | |
| /* Compatibility for an accidental nested-list wrapper on the Main Page:
| |
| *
| |
| * <ul>
| |
| * <ul class="wizlords-mainpage-whatislarp-list">...</ul>
| |
| * </ul>
| |
| *
| |
| * The outer list otherwise adds a second layer of indentation. The preferred
| |
| * markup is still a single classified <ul>.
| |
| */
| |
| .mw-parser-output ul:has(> ul.wizlords-mainpage-whatislarp-list) {
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| list-style: none !important;
| |
| }
| |
| | |
| .mw-parser-output
| |
| ul:has(> ul.wizlords-mainpage-whatislarp-list)
| |
| > ul.wizlords-mainpage-whatislarp-list {
| |
| margin-left: 0 !important;
| |
| }
| |
| | |
| /* Hide the content of the TOC when the checkbox is checked. */
| |
| /* stylelint-disable-next-line selector-class-pattern */
| |
| .toctogglecheckbox:checked ~ ul {
| |
| display: none;
| |
| }
| |
| | |
| .wiz-grid {
| |
| outline: 5px solid red !important;
| |
| }
| |
| | |
| .wiz-grid-item {
| |
| width: 100%;
| |
| }
| |
| | |
| .wiz-grid-item img {
| |
| display: block;
| |
| width: 100%;
| |
| height: auto;
| |
| border: 0;
| |
| background: transparent;
| |
| box-shadow: none;
| |
| }
| |
| | |
| .wiz-grid-text {
| |
| margin-top: 8px;
| |
| }
| |
| | |
| /* TOC PAGE DIV */
| |
| /* ------------ */
| |
| /* Wrap __TOC__ in <div class="toc-page">...</div> to float it right. */
| |
| .toc-page #toc,
| |
| .toc-page .toc {
| |
| float: right;
| |
| width: max-content;
| |
| min-width: 220px;
| |
| max-width: 320px;
| |
| margin: 0 0 16px 24px;
| |
| clear: right;
| |
| font-size: 0.95em;
| |
| box-sizing: border-box;
| |
| padding: 16px 24px;
| |
| border: 1px solid var(--wiz-content-border, #ff942d);
| |
| background: var(--wiz-panel-solid-background, #0f0f0f);
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .toc-page #toc:has(.toctogglecheckbox:checked),
| |
| .toc-page .toc:has(.toctogglecheckbox:checked) {
| |
| width: fit-content;
| |
| min-width: 0;
| |
| padding: 12px 16px;
| |
| }
| |
| | |
| .toc-page #toc .toctitle,
| |
| .toc-page .toc .toctitle {
| |
| margin: 0 0 10px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| text-align: center;
| |
| }
| |
| | |
| .toc-page #toc:has(.toctogglecheckbox:checked) .toctitle,
| |
| .toc-page .toc:has(.toctogglecheckbox:checked) .toctitle {
| |
| margin: 0;
| |
| line-height: 1.4;
| |
| }
| |
| | |
| .toc-page #toc .toctitle h2,
| |
| .toc-page .toc .toctitle h2 {
| |
| display: inline;
| |
| margin: 0;
| |
| padding: 0;
| |
| border: 0;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 14px;
| |
| font-weight: bold;
| |
| line-height: 1.4;
| |
| }
| |
| | |
| .toc-page #toc .toctoggle,
| |
| .toc-page .toc .toctoggle {
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 12px;
| |
| }
| |
| | |
| .toc-page #toc .toctoggle a,
| |
| .toc-page .toc .toctoggle a {
| |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .toc-page #toc ul,
| |
| .toc-page .toc ul {
| |
| margin: 0;
| |
| padding: 0;
| |
| list-style: none;
| |
| }
| |
| | |
| .toc-page #toc li,
| |
| .toc-page .toc li {
| |
| display: block;
| |
| margin: 0;
| |
| padding: 0;
| |
| list-style: none;
| |
| line-height: 1.35;
| |
| }
| |
| | |
| .toc-page #toc > ul > li,
| |
| .toc-page .toc > ul > li {
| |
| padding: 2px 0;
| |
| }
| |
| | |
| .toc-page #toc li ul,
| |
| .toc-page .toc li ul {
| |
| margin-left: 12px;
| |
| padding-left: 10px;
| |
| border-left: 1px dotted var(--wiz-content-border, #ff942d);
| |
| }
| |
| | |
| .toc-page #toc li li,
| |
| .toc-page .toc li li {
| |
| margin-left: 0;
| |
| padding: 2px 0;
| |
| border-left: 0;
| |
| }
| |
| | |
| .toc-page #toc .toclevel-3,
| |
| .toc-page #toc .toclevel-4,
| |
| .toc-page #toc .toclevel-5,
| |
| .toc-page #toc .toclevel-6,
| |
| .toc-page .toc .toclevel-3,
| |
| .toc-page .toc .toclevel-4,
| |
| .toc-page .toc .toclevel-5,
| |
| .toc-page .toc .toclevel-6 {
| |
| display: none !important;
| |
| }
| |
| | |
| .toc-page #toc .tocnumber,
| |
| .toc-page .toc .tocnumber {
| |
| display: none;
| |
| }
| |
| | |
| .toc-page #toc a,
| |
| .toc-page .toc a {
| |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .toc-page #toc a:hover,
| |
| .toc-page .toc a:hover {
| |
| color: #ffd37a;
| |
| text-decoration: none;
| |
| }
| |
| | |
| /* Intro text shown only while a MediaWiki collapsible section is closed. */
| |
| .wizlords-collapsed-hint {
| |
| display: none;
| |
| margin: 0;
| |
| padding: 6px 0 6px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-style: italic;
| |
| }
| |
| | |
| .wizlords-collapsed-hint-section.mw-collapsed > .wizlords-collapsed-hint {
| |
| display: block;
| |
| }
| |
| | |
| .wizlords-collapsed-hint-section:not(.mw-collapsed) > .wizlords-collapsed-hint {
| |
| display: none;
| |
| }
| |
| | |
| .wizlords-collapsed-hint-section ul {
| |
| margin: 6px 0 12px;
| |
| padding-left: 28px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-collapsed-hint-section li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-collapsed-hint-section li::marker {
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| /* Keeps a real wiki heading available for the TOC without showing it on the page. */
| |
| .wizlords-toc-only-heading {
| |
| position: absolute;
| |
| width: 1px;
| |
| height: 0;
| |
| margin: 0;
| |
| padding: 0;
| |
| overflow: hidden;
| |
| clip-path: inset(50%);
| |
| }
| |
| | |
| .wizlords-toc-only-heading .mw-heading,
| |
| .wizlords-toc-only-heading h2,
| |
| .wizlords-toc-only-heading h3,
| |
| .wizlords-toc-only-heading h4 {
| |
| height: 0 !important;
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| border: 0 !important;
| |
| }
| |
| | |
| .wizlords-toc-only-heading .mw-editsection {
| |
| display: none;
| |
| }
| |
| | |
| /* Reusable article sections that can be collapsed to keep long pages compact. */
| |
| .wizlords-collapsible-section {
| |
| margin: 18px 0;
| |
| padding: 8px 14px;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #1f1e1e;
| |
| }
| |
| | |
| .wizlords-toc-only-heading + .wizlords-collapsible-section {
| |
| margin-top: 10px;
| |
| }
| |
| | |
| .wizlords-collapsible-section:has(+ .wizlords-toc-only-heading) {
| |
| margin-bottom: 10px;
| |
| }
| |
| | |
| .wizlords-collapsible-section-title {
| |
| padding: 0;
| |
| border-bottom: 1px solid var(--wiz-content-border, #ff942d);
| |
| color: var(--wiz-heading, #e7e1d4);
| |
| font-family: Georgia, 'Times New Roman', serif;
| |
| font-size: 24px;
| |
| font-weight: normal;
| |
| line-height: 30px;
| |
| }
| |
| | |
| .wizlords-collapsible-section .mw-collapsible-content {
| |
| padding: 6px 0 0;
| |
| }
| |
| | |
| .wizlords-collapsible-section .mw-collapsible-content > p:first-child {
| |
| margin-top: 0;
| |
| }
| |
| | |
| .wizlords-collapsible-section .mw-collapsible-content > p:last-child {
| |
| margin-bottom: 0;
| |
| }
| |
| | |
| .wizlords-collapsible-section-subheading {
| |
| margin: 14px 0 8px;
| |
| color: var(--wiz-heading, #e7e1d4);
| |
| font-size: 18px;
| |
| font-weight: bold;
| |
| line-height: 1.3;
| |
| }
| |
| | |
| .wizlords-collapsible-section-subsubheading {
| |
| margin: 12px 0 6px;
| |
| color: var(--wiz-heading, #e7e1d4);
| |
| font-weight: bold;
| |
| line-height: 1.3;
| |
| }
| |
| | |
| .wizlords-collapsible-section-divider {
| |
| width: 80%;
| |
| height: 1px;
| |
| margin: 18px auto 14px;
| |
| background: var(--wiz-race-table-divider-colour, #9d7531);
| |
| }
| |
| | |
| .wizlords-collapsible-section > .mw-collapsible-toggle {
| |
| margin: 11px 0 0 0;
| |
| color: var(--wiz-text, #d2d2d2) !important;
| |
| }
| |
| | |
| .wizlords-collapsible-section > .mw-collapsible-toggle .mw-collapsible-text,
| |
| .wizlords-collapsible-section > .mw-collapsible-toggle a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| }
| |
| | |
| .wizlords-collapsible-section-bottom-toggle {
| |
| margin: 8px 0 0;
| |
| padding: 0;
| |
| text-align: right;
| |
| color: var(--wiz-text, #d2d2d2) !important;
| |
| cursor: pointer;
| |
| }
| |
| | |
| .wizlords-collapsible-section-bottom-toggle span,
| |
| .wizlords-collapsible-section-bottom-toggle a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| }
| |
| | |
| /* RACE TABLE */
| |
| /* ---------- */
| |
| .wikitable.wizlords-race-table,
| |
| .wizlords-race-table {
| |
| --wiz-race-table-border-width: 1px;
| |
| --wiz-race-table-border-colour: #4d4d4d;
| |
| --wiz-race-table-divider-colour: #9d7531;
| |
| width: 100%;
| |
| border-collapse: collapse;
| |
| table-layout: fixed;
| |
| border: var(--wiz-race-table-border-width) solid var(--wiz-race-table-border-colour) !important;
| |
| background: var(--wiz-content-background, #222);
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .wikitable.wizlords-race-table tr,
| |
| .wizlords-race-table tr {
| |
| border-color: var(--wiz-race-table-border-colour) !important;
| |
| }
| |
| | |
| .wikitable.wizlords-race-table th,
| |
| .wikitable.wizlords-race-table td,
| |
| .wizlords-race-table th,
| |
| .wizlords-race-table td {
| |
| padding: 5px 8px;
| |
| border: var(--wiz-race-table-border-width) solid var(--wiz-race-table-border-colour) !important;
| |
| background: #1f1e1e;
| |
| vertical-align: middle;
| |
| }
| |
| | |
| .wizlords-race-table th {
| |
| color: var(--wiz-heading, #e7e1d4) !important;
| |
| text-align: center;
| |
| font-weight: bold;
| |
| }
| |
| | |
| .wikitable.wizlords-race-table td.race-name,
| |
| .wizlords-race-table td.race-name {
| |
| background: #171717 !important;
| |
| text-align: center;
| |
| font-weight: bold;
| |
| white-space: nowrap;
| |
| }
| |
| | |
| .wizlords-race-table .race-icon {
| |
| display: block;
| |
| width: 100px;
| |
| height: 100px;
| |
| margin: 0 auto 6px;
| |
| object-fit: contain;
| |
| }
| |
| | |
| .wikitable.wizlords-race-table td.subculture,
| |
| .wizlords-race-table td.subculture {
| |
| background: #171717 !important;
| |
| text-align: center;
| |
| font-weight: bold;
| |
| vertical-align: middle;
| |
| }
| |
| | |
| .wizlords-race-table .subculture-icon {
| |
| display: block;
| |
| width: 45px;
| |
| height: 45px;
| |
| margin: 4px auto 4px;
| |
| object-fit: contain;
| |
| }
| |
| | |
| .wizlords-race-table .race-bonus,
| |
| .wizlords-race-table .subculture-bonus {
| |
| min-width: 280px;
| |
| }
| |
| | |
| .wizlords-race-table ul {
| |
| margin: 0;
| |
| padding-left: 20px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-race-table li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-race-table li::marker {
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .wizlords-race-table .race-divider td {
| |
| height: 8px;
| |
| padding: 0;
| |
| border: var(--wiz-race-table-border-width) solid var(--wiz-race-table-divider-colour) !important;
| |
| background: var(--wiz-race-table-divider-colour);
| |
| }
| |
| | |
| /* RACES LANDING PAGE */
| |
| /* ------------------ */
| |
| .wizlords-races-landing {
| |
| max-width: 100%;
| |
| }
| |
| | |
| .wizlords-races-landing .race-note {
| |
| margin: 14px 0 18px;
| |
| font-style: italic;
| |
| }
| |
| | |
| .wizlords-races-grid {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| justify-content: center;
| |
| gap: 28px 44px;
| |
| margin: 26px auto 24px;
| |
| max-width: 860px;
| |
| }
| |
| | |
| .wizlords-race-link {
| |
| display: block;
| |
| width: 120px;
| |
| text-align: center;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-race-link img {
| |
| display: block;
| |
| width: 100px;
| |
| height: 100px;
| |
| margin: 0 auto 8px;
| |
| object-fit: contain;
| |
| border: 0;
| |
| background: transparent;
| |
| transition: transform 120ms ease, filter 120ms ease;
| |
| }
| |
| | |
| .wizlords-race-label,
| |
| .wizlords-race-label a {
| |
| display: block;
| |
| color: var(--wiz-link, #ff942d);
| |
| font-weight: bold;
| |
| line-height: 1.3;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-race-link:hover img {
| |
| filter: brightness(1.15);
| |
| transform: translateY(-2px);
| |
| }
| |
| | |
| .wizlords-race-link:hover .wizlords-race-label,
| |
| .wizlords-race-link:hover .wizlords-race-label a {
| |
| color: #ffd37a;
| |
| text-decoration: none;
| |
| }
| |
| | |
| /* RACE DETAIL PAGES */
| |
| /* ----------------- */
| |
| .wizlords-race-page {
| |
| max-width: 100%;
| |
| }
| |
| | |
| .wizlords-race-page .hatnote {
| |
| margin: 4px 0 18px;
| |
| padding-left: 18px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-style: italic;
| |
| }
| |
| | |
| .toc-page .hatnote {
| |
| margin: 14px 0 10px;
| |
| padding-left: 18px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-style: italic;
| |
| }
| |
| | |
| .toc-page .hatnote + h2,
| |
| .toc-page .hatnote + .mw-heading2 {
| |
| margin-top: 12px !important;
| |
| }
| |
| | |
| .wizlords-race-page .hatnote a {
| |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .toc-page .hatnote a {
| |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-race-intro {
| |
| display: flex;
| |
| align-items: center;
| |
| gap: 28px;
| |
| margin: 18px 0 24px;
| |
| }
| |
| | |
| .wizlords-race-intro-icon {
| |
| flex: 0 0 auto;
| |
| }
| |
| | |
| .wizlords-race-intro-icon img {
| |
| display: block;
| |
| width: 100px;
| |
| height: 100px;
| |
| object-fit: contain;
| |
| border: 0;
| |
| background: transparent;
| |
| }
| |
| | |
| .wizlords-race-quote {
| |
| position: relative;
| |
| margin: 0;
| |
| padding: 0 34px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 16px;
| |
| font-style: italic;
| |
| line-height: 1.6;
| |
| }
| |
| | |
| .wizlords-race-quote::before,
| |
| .wizlords-race-quote::after {
| |
| position: absolute;
| |
| color: #555;
| |
| font-size: 42px;
| |
| line-height: 1;
| |
| }
| |
| | |
| .wizlords-race-quote::before {
| |
| content: "\201C";
| |
| left: 0;
| |
| top: -6px;
| |
| }
| |
| | |
| .wizlords-race-quote::after {
| |
| content: "\201D";
| |
| right: 0;
| |
| bottom: -18px;
| |
| }
| |
| | |
| .wizlords-race-quote-source {
| |
| margin-top: 8px;
| |
| text-align: right;
| |
| font-size: 12px;
| |
| font-style: normal;
| |
| font-weight: bold;
| |
| }
| |
| | |
| .wizlords-culture-grid {
| |
| display: grid;
| |
| grid-template-columns: repeat(6, minmax(0, 1fr));
| |
| gap: 14px;
| |
| margin: 18px auto 24px;
| |
| }
| |
| | |
| .wizlords-culture-card {
| |
| display: flex;
| |
| flex-direction: column;
| |
| grid-column: span 2;
| |
| min-height: 100%;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #171717;
| |
| }
| |
| | |
| .wizlords-culture-grid.cultures-2 .wizlords-culture-card:nth-child(1),
| |
| .wizlords-culture-grid.cultures-4 .wizlords-culture-card:nth-child(1),
| |
| .wizlords-culture-grid.cultures-4 .wizlords-culture-card:nth-child(3) {
| |
| grid-column: 2 / span 2;
| |
| }
| |
| | |
| .wizlords-culture-grid.cultures-2 .wizlords-culture-card:nth-child(2),
| |
| .wizlords-culture-grid.cultures-4 .wizlords-culture-card:nth-child(2),
| |
| .wizlords-culture-grid.cultures-4 .wizlords-culture-card:nth-child(4) {
| |
| grid-column: 4 / span 2;
| |
| }
| |
| | |
| .wizlords-culture-grid.cultures-5 .wizlords-culture-card:nth-child(4) {
| |
| grid-column: 2 / span 2;
| |
| }
| |
| | |
| .wizlords-culture-grid.cultures-5 .wizlords-culture-card:nth-child(5) {
| |
| grid-column: 4 / span 2;
| |
| }
| |
| | |
| .wizlords-culture-grid.cultures-7 .wizlords-culture-card:nth-child(7) {
| |
| grid-column: 3 / span 2;
| |
| }
| |
| | |
| .wizlords-culture-card-header {
| |
| padding: 16px 12px 12px;
| |
| text-align: center;
| |
| border-bottom: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| }
| |
| | |
| .wizlords-culture-card-header img {
| |
| display: block;
| |
| width: 250px;
| |
| height: 250px;
| |
| max-width: 100%;
| |
| margin: 0 auto 10px;
| |
| object-fit: contain;
| |
| border: 0;
| |
| background: transparent;
| |
| }
| |
| | |
| .wizlords-culture-card-title,
| |
| .wizlords-culture-card-title a {
| |
| color: var(--wiz-link, #ff942d);
| |
| font-size: 16px;
| |
| font-weight: bold;
| |
| line-height: 1.25;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-culture-card-body {
| |
| flex: 1 1 auto;
| |
| padding: 12px;
| |
| background: #1f1e1e;
| |
| }
| |
| | |
| .wizlords-culture-card-body p {
| |
| margin: 0 0 12px;
| |
| font-style: italic;
| |
| line-height: 1.55;
| |
| }
| |
| | |
| .wizlords-culture-separator {
| |
| width: 110px;
| |
| height: 1px;
| |
| margin: 14px auto 12px;
| |
| background: var(--wiz-race-table-divider-colour, #9d7531);
| |
| }
| |
| | |
| .wizlords-shared-classes {
| |
| display: table;
| |
| width: auto;
| |
| min-width: 330px;
| |
| margin: 16px auto 22px;
| |
| padding: 10px 28px;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #171717;
| |
| }
| |
| | |
| .wizlords-shared-classes-title {
| |
| margin-bottom: 5px;
| |
| color: var(--wiz-heading-colour, #f2ead7);
| |
| font-weight: bold;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-shared-classes ul {
| |
| display: grid;
| |
| grid-auto-flow: column;
| |
| grid-template-rows: repeat(5, auto);
| |
| grid-auto-columns: max-content;
| |
| column-gap: 42px;
| |
| width: max-content;
| |
| margin: 2px auto 0;
| |
| padding-left: 0;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-shared-classes li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| margin-left: 18px;
| |
| break-inside: avoid;
| |
| }
| |
| | |
| .wizlords-shared-classes.classes-8 ul {
| |
| grid-template-rows: repeat(4, auto);
| |
| }
| |
| | |
| .wizlords-shared-classes.classes-9 ul {
| |
| grid-template-rows: repeat(5, auto);
| |
| }
| |
| | |
| .wizlords-shared-classes.classes-4 ul {
| |
| grid-template-rows: repeat(4, auto);
| |
| }
| |
| | |
| .wizlords-shared-classes.classes-9-three ul {
| |
| grid-template-rows: repeat(3, auto);
| |
| }
| |
| | |
| .wizlords-class-compare {
| |
| display: flex;
| |
| justify-content: center;
| |
| align-items: stretch;
| |
| gap: 12px;
| |
| margin: 16px auto 22px;
| |
| }
| |
| | |
| .wizlords-class-compare .wizlords-shared-classes {
| |
| margin: 0;
| |
| min-width: 0;
| |
| }
| |
| | |
| .wizlords-shared-classes a {
| |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-shared-classes a:hover {
| |
| color: #ffd37a;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-culture-classes {
| |
| margin-top: 12px;
| |
| font-weight: bold;
| |
| }
| |
| | |
| .wizlords-culture-known-for,
| |
| .wizlords-culture-suggested-class {
| |
| margin-top: 10px;
| |
| line-height: 1.45;
| |
| }
| |
| | |
| .wizlords-culture-suggested-class a {
| |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-culture-class-note {
| |
| margin-top: 6px;
| |
| line-height: 1.45;
| |
| }
| |
| | |
| .wizlords-culture-card-body ul {
| |
| margin: 4px 0 0;
| |
| padding-left: 28px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-culture-card-body li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| }
| |
| | |
| .wizlords-culture-card-body a,
| |
| .wizlords-culture-row-classes a {
| |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-culture-card-body a:hover,
| |
| .wizlords-culture-row-classes a:hover {
| |
| color: #ffd37a;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-culture-list {
| |
| margin: 18px 0 24px;
| |
| }
| |
| | |
| .wizlords-culture-row {
| |
| padding: 20px 0 24px;
| |
| border-bottom: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| }
| |
| | |
| .wizlords-culture-row-feature {
| |
| display: grid;
| |
| grid-template-columns: 150px 1px minmax(0, 1fr) 300px;
| |
| align-items: center;
| |
| gap: 22px;
| |
| margin: 10px 0 18px;
| |
| }
| |
| | |
| .wizlords-culture-row-icon img {
| |
| display: block;
| |
| width: 150px;
| |
| height: 150px;
| |
| object-fit: contain;
| |
| border: 0;
| |
| background: transparent;
| |
| }
| |
| | |
| .wizlords-culture-row-divider {
| |
| width: 1px;
| |
| height: 150px;
| |
| background: var(--wiz-race-table-border-colour, #4d4d4d);
| |
| }
| |
| | |
| .wizlords-culture-row-title,
| |
| .wizlords-culture-row-title a {
| |
| color: var(--wiz-heading, #e7e1d4);
| |
| font-size: 18px;
| |
| font-weight: bold;
| |
| line-height: 1.3;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-culture-row-description {
| |
| position: relative;
| |
| margin: 0;
| |
| padding: 0 34px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 16px;
| |
| font-style: italic;
| |
| line-height: 1.6;
| |
| }
| |
| | |
| .wizlords-culture-row-description::before,
| |
| .wizlords-culture-row-description::after {
| |
| position: absolute;
| |
| color: #555;
| |
| font-size: 42px;
| |
| line-height: 1;
| |
| }
| |
| | |
| .wizlords-culture-row-description::before {
| |
| content: "\201C";
| |
| left: 0;
| |
| top: -6px;
| |
| }
| |
| | |
| .wizlords-culture-row-description::after {
| |
| content: "\201D";
| |
| right: 0;
| |
| bottom: -18px;
| |
| }
| |
| | |
| .wizlords-culture-appearance {
| |
| box-sizing: border-box;
| |
| width: 300px;
| |
| padding: 4px;
| |
| border: 1px solid var(--wiz-race-table-divider-colour, #9d7531);
| |
| background: #171717;
| |
| }
| |
| | |
| .wizlords-culture-appearance img {
| |
| display: block;
| |
| width: 300px;
| |
| height: 138px;
| |
| object-fit: cover;
| |
| border: 0;
| |
| background: transparent;
| |
| }
| |
| | |
| .wizlords-culture-appearance-caption {
| |
| margin-top: 4px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 12px;
| |
| line-height: 1.3;
| |
| }
| |
| | |
| .wizlords-page-image {
| |
| box-sizing: border-box;
| |
| width: min(450px, 100%);
| |
| padding: 6px;
| |
| border: 1px solid var(--wiz-content-border, #ff942d);
| |
| background: #171717;
| |
| }
| |
| | |
| .wizlords-page-image p {
| |
| margin: 0;
| |
| padding: 0;
| |
| }
| |
| | |
| .wizlords-page-image span,
| |
| .wizlords-page-image a {
| |
| display: block;
| |
| }
| |
| | |
| .wizlords-page-image.right {
| |
| float: right;
| |
| margin: 0 0 16px 24px;
| |
| }
| |
| | |
| .wizlords-page-image.left {
| |
| float: left;
| |
| margin: 0 24px 16px 0;
| |
| }
| |
| | |
| .wizlords-page-image img {
| |
| display: block;
| |
| box-sizing: border-box;
| |
| width: 100%;
| |
| aspect-ratio: 2 / 1;
| |
| height: auto;
| |
| object-fit: cover;
| |
| border: 1px solid var(--wiz-content-border, #ff942d);
| |
| background: transparent;
| |
| }
| |
| | |
| .wizlords-page-image-caption {
| |
| margin-top: 7px;
| |
| padding: 0 4px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 12px;
| |
| line-height: 1.3;
| |
| }
| |
| | |
| .wizlords-culture-row-classes {
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 14px;
| |
| }
| |
| | |
| .wizlords-culture-class-list {
| |
| display: grid;
| |
| grid-auto-flow: column;
| |
| grid-auto-columns: minmax(130px, max-content);
| |
| grid-template-rows: repeat(4, auto);
| |
| gap: 4px 18px;
| |
| margin: 6px 0 0;
| |
| padding-left: 28px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-culture-class-list li {
| |
| display: list-item;
| |
| margin: 0;
| |
| padding: 0;
| |
| }
| |
| | |
| .wizlords-culture-class-list li::marker {
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| /* Tablet and small-desktop layouts use a three-column grid. */
| |
| @media (min-width: 600px) and (max-width: 1199px) {
| |
| .wiz-grid {
| |
| grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
| |
| } | | } |
| }
| |
|
| |
|
| /* Phone layout uses two columns. */
| | function initialiseExampleTables() { |
| @media (max-width: 599px) {
| | $('.wizlords-example-table.mw-collapsible').each(function () { |
| .wiz-grid {
| | var $table = $(this); |
| grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
| | var $caption = $table.children('caption'); |
| }
| |
| }
| |
|
| |
|
| /* CLASS OVERVIEW PAGE */
| | if (exampleTableQuery.matches) { |
| /* ------------------- */
| | $caption |
| .wizlords-classes-page { | | .attr('role', 'button') |
| max-width: 100%;
| | .attr('tabindex', '0'); |
| }
| |
|
| |
|
| .wizlords-classes-page ul {
| | updateExampleTableState($table); |
| list-style: disc outside;
| | } else { |
| padding-left: 28px;
| | $caption |
| }
| | .removeAttr('role') |
| | | .removeAttr('tabindex') |
| .wizlords-classes-page li {
| | .removeAttr('aria-expanded'); |
| display: list-item;
| | } |
| }
| | }); |
| | |
| .wizlords-class-category-table {
| |
| width: 100%;
| |
| min-width: 0;
| |
| max-width: 640px;
| |
| margin: 18px auto 24px;
| |
| border: 0 !important;
| |
| background: #171717;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| border-collapse: collapse;
| |
| table-layout: fixed;
| |
| } | |
| | |
| .wizlords-class-category-table th,
| |
| .wizlords-class-category-table td {
| |
| box-sizing: border-box;
| |
| width: 33.333%;
| |
| min-width: 0;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d) !important;
| |
| vertical-align: top;
| |
| }
| |
| | |
| .wizlords-class-category-table th { | |
| padding: 8px 18px !important;
| |
| background: #1f1e1e !important;
| |
| color: var(--wiz-heading, #e7e1d4) !important;
| |
| font-size: 18px;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-class-category-icon {
| |
| margin: 0 0 6px;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-class-category-icon img {
| |
| display: inline-block;
| |
| width: 110px;
| |
| height: 110px;
| |
| object-fit: contain;
| |
| }
| |
| | |
| .wizlords-class-category-table td {
| |
| padding: 8px 18px 10px 12px !important;
| |
| background: #171717 !important;
| |
| }
| |
| | |
| .wizlords-class-category-table tr:first-child {
| |
| border-bottom: 0;
| |
| }
| |
| | |
| .wizlords-class-category-table ul {
| |
| margin: 0;
| |
| padding-left: 22px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-class-category-table li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| }
| |
| | |
| .wizlords-class-category-name {
| |
| color: var(--wiz-link, #ff942d);
| |
| font-weight: bold;
| |
| }
| |
| | |
| .wizlords-class-category-table a,
| |
| .wizlords-class-card a { | |
| color: var(--wiz-link, #ff942d);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-class-category-mobile {
| |
| display: none;
| |
| }
| |
| | |
| /* Very narrow phones: use explicit paired category rows instead of trying to
| |
| re-map MediaWiki's desktop table, whose headers and lists are rendered in
| |
| separate table rows. This avoids horizontal scroll and keeps each category
| |
| as icon/name on the left and class list on the right. */
| |
| @media (max-width: 490px) {
| |
| .wizlords-class-category-table {
| |
| display: none !important;
| |
| }
| |
| | |
| .wizlords-class-category-mobile {
| |
| display: block;
| |
| width: 100%;
| |
| max-width: 420px;
| |
| margin: 18px auto 24px;
| |
| border: 0 !important; | |
| overflow: visible;
| |
| background: #171717;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .wizlords-class-category-mobile-row {
| |
| display: grid;
| |
| grid-template-columns: 44% 56%;
| |
| align-items: stretch;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| border-bottom: 0;
| |
| } | | } |
|
| |
|
| .wizlords-class-category-mobile-row:last-child { | | $(initialiseExampleTables); |
| border-bottom: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| }
| |
|
| |
|
| .wizlords-class-category-mobile-heading { | | if (exampleTableQuery.addEventListener) { |
| box-sizing: border-box; | | exampleTableQuery.addEventListener('change', initialiseExampleTables); |
| padding: 8px 8px !important;
| | } else if (exampleTableQuery.addListener) { |
| border-right: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| | exampleTableQuery.addListener(initialiseExampleTables); |
| background: #1f1e1e;
| |
| color: var(--wiz-heading, #e7e1d4); | |
| font-size: 16px;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| } | | } |
|
| |
|
| .wizlords-class-category-mobile-list { | | $(document).on('click', '.wizlords-example-table.mw-collapsible > caption', function (event) { |
| box-sizing: border-box;
| | if (!exampleTableQuery.matches) { |
| display: flex;
| | return; |
| align-items: center;
| | } |
| padding: 8px 10px !important;
| |
| background: #171717;
| |
| }
| |
| | |
| .wizlords-class-category-mobile .wizlords-class-category-icon {
| |
| margin-bottom: 4px;
| |
| }
| |
| | |
| .wizlords-class-category-mobile .wizlords-class-category-icon img {
| |
| width: 64px;
| |
| height: auto;
| |
| max-width: 100%;
| |
| }
| |
| | |
| .wizlords-class-category-mobile ul {
| |
| margin: 0;
| |
| padding-left: 18px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-class-category-mobile li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| }
| |
| }
| |
| | |
| .wizlords-class-card-grid {
| |
| display: grid;
| |
| grid-template-columns: repeat(6, minmax(0, 1fr));
| |
| gap: 14px;
| |
| margin: 16px auto 24px;
| |
| }
| |
| | |
| .wizlords-class-card { | |
| grid-column: span 2;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #171717;
| |
| display: flex;
| |
| flex-direction: column;
| |
| scroll-margin-top: 90px;
| |
| }
| |
| | |
| .wizlords-class-card-grid.cards-5 .wizlords-class-card:nth-child(4),
| |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(1),
| |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(3) {
| |
| grid-column: 2 / span 2;
| |
| }
| |
| | |
| .wizlords-class-card-grid.cards-5 .wizlords-class-card:nth-child(5),
| |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(2),
| |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(4) {
| |
| grid-column: 4 / span 2;
| |
| }
| |
| | |
| .wizlords-class-card-title {
| |
| padding: 0 12px 10px;
| |
| color: var(--wiz-link, #ff942d);
| |
| font-weight: bold;
| |
| font-size: 18px;
| |
| line-height: 1.25;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-class-card-icon {
| |
| padding: 18px 12px 8px;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-class-card-icon img {
| |
| display: inline-block;
| |
| width: 250px;
| |
| height: 250px;
| |
| object-fit: contain;
| |
| }
| |
| | |
| .wizlords-class-card-body {
| |
| padding: 12px;
| |
| background: #1f1e1e;
| |
| line-height: 1.5;
| |
| flex: 1 1 auto;
| |
| }
| |
| | |
| .wizlords-class-card-summary {
| |
| font-style: italic;
| |
| }
| |
| | |
| .wizlords-class-card-divider { | |
| width: 55%;
| |
| height: 1px;
| |
| margin: 14px auto 12px;
| |
| background: var(--wiz-race-table-divider-colour, #9d7531);
| |
| }
| |
| | |
| .wizlords-class-card-rules { | |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .wizlords-class-card-rules div {
| |
| margin: 0 0 4px;
| |
| }
| |
| | |
| /* MAGIC PAGE */
| |
| /* ---------- */
| |
| .wizlords-magic-used-by {
| |
| margin: 4px 0 14px;
| |
| padding-left: 18px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-style: italic;
| |
| }
| |
| | |
| .wizlords-magic-intro {
| |
| display: flex;
| |
| align-items: center;
| |
| gap: 22px;
| |
| margin: 12px 0 18px;
| |
| }
| |
| | |
| .wizlords-magic-intro-icon {
| |
| flex: 0 0 auto;
| |
| }
| |
| | |
| .wizlords-magic-intro-icon img {
| |
| display: block;
| |
| width: 100px;
| |
| height: 100px;
| |
| object-fit: contain;
| |
| }
| |
| | |
| .wizlords-magic-quote {
| |
| padding-left: 20px;
| |
| border-left: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-style: italic;
| |
| line-height: 1.55;
| |
| }
| |
| | |
| .wizlords-section-divider { | |
| width: 55%;
| |
| height: 1px;
| |
| margin: 22px auto 18px;
| |
| background: var(--wiz-race-table-divider-colour, #9d7531);
| |
| }
| |
| | |
| .wikitable.wizlords-magic-table,
| |
| .wizlords-magic-table {
| |
| width: auto;
| |
| min-width: 520px;
| |
| max-width: 680px;
| |
| margin: 16px 0 18px;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d) !important;
| |
| border-collapse: collapse;
| |
| background: #171717;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| } | |
|
| |
|
| .wikitable.wizlords-example-table, | | if ($(event.target).closest('.mw-collapsible-toggle').length) { |
| .wizlords-example-table { | | return; |
| width: 100%;
| | } |
| max-width: 600px;
| |
| margin-left: 0;
| |
| margin-right: auto;
| |
| } | |
|
| |
|
| .wikitable.wizlords-example-table-full-heal, | | var $table = $(this).closest('.wizlords-example-table'); |
| .wizlords-example-table-full-heal { | | var $toggle = $table.find('> caption .mw-collapsible-toggle').first(); |
| max-width: 500px;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-example-table-full-heal th:first-child, | | if ($toggle.length) { |
| .wikitable.wizlords-example-table-full-heal td:first-child, | | $toggle.trigger('click'); |
| .wizlords-example-table-full-heal th:first-child,
| | window.setTimeout(function () { |
| .wizlords-example-table-full-heal td:first-child {
| | updateExampleTableState($table); |
| width: 34%; | | }, 0); |
| }
| | } |
| | }); |
|
| |
|
| .wikitable.wizlords-example-table-full-heal th:nth-child(2),
| | $(document).on('keydown', '.wizlords-example-table.mw-collapsible > caption', function (event) { |
| .wikitable.wizlords-example-table-full-heal td:nth-child(2), | | if (!exampleTableQuery.matches) { |
| .wizlords-example-table-full-heal th:nth-child(2), | | return; |
| .wizlords-example-table-full-heal td:nth-child(2) { | | } |
| width: 66%;
| |
| } | |
|
| |
|
| .wikitable.wizlords-magic-table th, | | if (event.key === 'Enter' || event.key === ' ') { |
| .wikitable.wizlords-magic-table td, | | event.preventDefault(); |
| .wizlords-magic-table th,
| | $(this).trigger('click'); |
| .wizlords-magic-table td { | | } |
| padding: 8px 18px !important;
| | }); |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d) !important;
| |
| background: #171717 !important; | |
| }
| |
|
| |
|
| .wikitable.wizlords-magic-table th,
| | function collapseFromBottom(toggleClass, collapsibleId) { |
| .wizlords-magic-table th { | | $(document).on('click', toggleClass, function (event) { |
| background: #1f1e1e !important;
| | event.preventDefault(); |
| color: var(--wiz-heading, #e7e1d4) !important;
| |
| text-align: center;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-reward-table, | | var $collapsible = $('#' + collapsibleId); |
| .wizlords-reward-table { | | var $topToggle = $collapsible.children('.mw-collapsible-toggle').first(); |
| min-width: 0;
| |
| max-width: none;
| |
| width: auto;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-reward-table th,
| | if ($topToggle.length) { |
| .wikitable.wizlords-reward-table td,
| | $topToggle.trigger('click'); |
| .wizlords-reward-table th,
| | } |
| .wizlords-reward-table td {
| | }); |
| white-space: nowrap;
| |
| }
| |
| | |
| .wikitable.wizlords-reward-table th:nth-child(2),
| |
| .wikitable.wizlords-reward-table td:nth-child(2),
| |
| .wizlords-reward-table th:nth-child(2),
| |
| .wizlords-reward-table td:nth-child(2) { | |
| text-align: center;
| |
| }
| |
| | |
| .wikitable.wizlords-example-table caption, | |
| .wizlords-example-table caption {
| |
| color: var(--wiz-heading, #e7e1d4);
| |
| font-weight: bold;
| |
| text-align: center;
| |
| } | |
| | |
| .wikitable.wizlords-example-table caption .mw-collapsible-toggle,
| |
| .wizlords-example-table caption .mw-collapsible-toggle {
| |
| color: var(--wiz-text, #d2d2d2) !important;
| |
| } | |
| | |
| .wikitable.wizlords-example-table caption .mw-collapsible-toggle .mw-collapsible-text,
| |
| .wizlords-example-table caption .mw-collapsible-toggle .mw-collapsible-text,
| |
| .wikitable.wizlords-example-table caption .mw-collapsible-toggle a,
| |
| .wizlords-example-table caption .mw-collapsible-toggle a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| }
| |
| | |
| .wikitable.wizlords-example-table th,
| |
| .wikitable.wizlords-example-table td,
| |
| .wizlords-example-table th,
| |
| .wizlords-example-table td {
| |
| text-align: center;
| |
| }
| |
| | |
| @media (max-width: 899px) {
| |
| .wikitable.wizlords-example-table,
| |
| .wizlords-example-table {
| |
| min-width: 0;
| |
| width: 100%;
| |
| box-sizing: border-box;
| |
| table-layout: fixed;
| |
| max-width: 600px;
| |
| margin: 14px auto 18px;
| |
| border: 0 !important;
| |
| border-radius: 0;
| |
| } | | } |
|
| |
|
| .wikitable.wizlords-example-table-full-heal, | | collapseFromBottom('.wizlords-spellbook-collapse-arcane', 'wizlords-arcane-spellbook'); |
| .wizlords-example-table-full-heal { | | collapseFromBottom('.wizlords-spellbook-collapse-divine', 'wizlords-divine-spellbook'); |
| max-width: 500px;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-example-table.mw-collapsed, | | $(document).on('click', '.wizlords-collapsible-section-bottom-toggle', function (event) { |
| .wizlords-example-table.mw-collapsed {
| | event.preventDefault(); |
| background: transparent !important; | |
| }
| |
|
| |
|
| .wikitable.wizlords-example-table caption,
| | var $collapsible = $(this).closest('.wizlords-collapsible-section'); |
| .wizlords-example-table caption {
| | var $topToggle = $collapsible.children('.mw-collapsible-toggle').first(); |
| display: table-caption !important;
| |
| caption-side: top; | |
| width: auto;
| |
| max-width: none;
| |
| box-sizing: border-box;
| |
| padding: 0;
| |
| margin: 0 0 6px;
| |
| border: 0 !important;
| |
| background: transparent !important;
| |
| white-space: nowrap;
| |
| text-align: center !important;
| |
| cursor: pointer;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-example-table.mw-collapsed caption::before,
| | if ($topToggle.length) { |
| .wizlords-example-table.mw-collapsed caption::before {
| | $topToggle.trigger('click'); |
| content: "";
| | } |
| display: inline-block;
| | }); |
| width: 8px;
| | }); |
| height: 8px;
| |
| margin-right: 0.35em;
| |
| border-right: 2px solid currentColor; | |
| border-bottom: 2px solid currentColor;
| |
| transform: translateY(-25%) rotate(45deg);
| |
| transform-origin: 50% 50%;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-example-table:not(.mw-collapsed) caption::before,
| | /* Mobile class-card collapse controls */ |
| .wizlords-example-table:not(.mw-collapsed) caption::before { | | ( function () { |
| content: "";
| | var mobileQuery = window.matchMedia('(max-width: 599px)'); |
| display: inline-block;
| |
| width: 8px;
| |
| height: 8px;
| |
| margin-right: 0.35em;
| |
| border-right: 2px solid currentColor;
| |
| border-bottom: 2px solid currentColor;
| |
| transform: translateY(10%) rotate(225deg);
| |
| transform-origin: 50% 50%;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-example-table caption .mw-collapsible-toggle, | | function initialiseClassCards() { |
| .wizlords-example-table caption .mw-collapsible-toggle {
| | $('.wizlords-class-card').each(function () { |
| display: none !important;
| | var $card = $(this); |
| }
| |
|
| |
|
| .wikitable.wizlords-example-table th,
| | if (mobileQuery.matches) { |
| .wikitable.wizlords-example-table td,
| | if (!$card.attr('data-wizlords-mobile-class-card')) { |
| .wizlords-example-table th,
| | $card |
| .wizlords-example-table td {
| | .attr('data-wizlords-mobile-class-card', '1') |
| box-sizing: border-box;
| | .attr('role', 'button') |
| padding: 8px 6px !important;
| | .attr('tabindex', '0'); |
| white-space: normal;
| | } |
| overflow-wrap: anywhere;
| |
| word-break: normal;
| |
| }
| |
| } | |
|
| |
|
| @media (max-width: 599px) {
| | if (!$card.hasClass('is-open')) { |
| .wikitable.wizlords-example-table th,
| | $card.attr('aria-expanded', 'false'); |
| .wikitable.wizlords-example-table td,
| | } |
| .wizlords-example-table th,
| | } else { |
| .wizlords-example-table td {
| | $card |
| font-size: 13px;
| | .removeAttr('data-wizlords-mobile-class-card') |
| line-height: 1.35; | | .removeAttr('role') |
| | .removeAttr('tabindex') |
| | .removeAttr('aria-expanded') |
| | .removeClass('is-open'); |
| | } |
| | }); |
| } | | } |
| }
| |
|
| |
|
| .wikitable.wizlords-reputation-table,
| | function toggleClassCard(card) { |
| .wizlords-reputation-table { | | if (!mobileQuery.matches) { |
| width: 100%;
| | return; |
| max-width: none;
| | } |
| } | |
|
| |
|
| .wikitable.wizlords-reputation-table.mw-collapsed,
| | var $card = $(card); |
| .wizlords-reputation-table.mw-collapsed { | | var isOpen = $card.hasClass('is-open'); |
| width: 520px;
| |
| min-width: 520px;
| |
| max-width: 100%;
| |
| }
| |
|
| |
|
| .wikitable.wizlords-reputation-table caption,
| | $card |
| .wizlords-reputation-table caption {
| | .toggleClass('is-open', !isOpen) |
| white-space: nowrap;
| | .attr('aria-expanded', isOpen ? 'false' : 'true'); |
| }
| |
| | |
| .wikitable.wizlords-reputation-table th:nth-child(1),
| |
| .wikitable.wizlords-reputation-table td:nth-child(1),
| |
| .wikitable.wizlords-reputation-table th:nth-child(2),
| |
| .wikitable.wizlords-reputation-table td:nth-child(2),
| |
| .wizlords-reputation-table th:nth-child(1),
| |
| .wizlords-reputation-table td:nth-child(1),
| |
| .wizlords-reputation-table th:nth-child(2),
| |
| .wizlords-reputation-table td:nth-child(2) {
| |
| width: 120px;
| |
| white-space: nowrap;
| |
| }
| |
| | |
| .wikitable.wizlords-reputation-table th:nth-child(3),
| |
| .wikitable.wizlords-reputation-table td:nth-child(3),
| |
| .wizlords-reputation-table th:nth-child(3),
| |
| .wizlords-reputation-table td:nth-child(3) {
| |
| text-align: left;
| |
| }
| |
| | |
| .wizlords-indented-note {
| |
| margin: 8px 0 14px 28px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .wizlords-spellbook {
| |
| margin: 18px 0 28px;
| |
| border: 1px solid var(--wiz-spellbook-colour, var(--wiz-link, #ff942d));
| |
| background: #1f1e1e;
| |
| }
| |
| | |
| .wizlords-spellbook-arcane {
| |
| --wiz-spellbook-colour: #c141d3;
| |
| --wiz-spell-card-divider-colour: #d66be3;
| |
| }
| |
| | |
| .wizlords-spellbook-divine {
| |
| --wiz-spellbook-colour: #089cc0;
| |
| --wiz-spell-card-divider-colour: #19c4eb;
| |
| }
| |
| | |
| .wizlords-spellbook-title {
| |
| display: flex;
| |
| align-items: center;
| |
| justify-content: center;
| |
| gap: 10px;
| |
| padding: 14px 18px;
| |
| color: var(--wiz-heading, #e7e1d4);
| |
| font-size: 24px;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-spellbook-title-icon {
| |
| display: inline-flex;
| |
| align-items: center;
| |
| justify-content: center;
| |
| width: 40px;
| |
| height: 40px;
| |
| }
| |
| | |
| .wizlords-spellbook-title-icon img {
| |
| display: block;
| |
| width: 40px;
| |
| height: 40px;
| |
| object-fit: contain;
| |
| }
| |
| | |
| .wizlords-spellbook > .mw-collapsible-toggle {
| |
| margin: 14px 18px 0 0;
| |
| color: var(--wiz-text, #d2d2d2) !important;
| |
| }
| |
| | |
| .wizlords-spellbook > .mw-collapsible-toggle .mw-collapsible-text,
| |
| .wizlords-spellbook > .mw-collapsible-toggle a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| }
| |
| | |
| .wizlords-spellbook-bottom-toggle {
| |
| margin: 16px 0 0;
| |
| padding: 0;
| |
| text-align: right;
| |
| color: var(--wiz-text, #d2d2d2) !important;
| |
| cursor: pointer;
| |
| }
| |
| | |
| .wizlords-spellbook-bottom-toggle span,
| |
| .wizlords-spellbook-bottom-toggle a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| }
| |
| | |
| .wizlords-spellbook .mw-collapsible-content {
| |
| padding: 0 18px 20px;
| |
| }
| |
| | |
| .wizlords-spell-category-heading {
| |
| position: relative;
| |
| margin: 0 0 3px;
| |
| padding: 0;
| |
| color: var(--wiz-heading, #e7e1d4);
| |
| font-size: 18px;
| |
| font-weight: bold;
| |
| line-height: 1.3;
| |
| }
| |
| | |
| .wizlords-spell-category-description {
| |
| margin: 0 0 12px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-style: italic;
| |
| font-weight: bold;
| |
| }
| |
| | |
| .wizlords-spell-card-grid + .wizlords-spell-category-heading {
| |
| margin-top: 0;
| |
| padding-top: 26px;
| |
| }
| |
| | |
| .wizlords-spell-card-grid + .wizlords-spell-category-heading::before {
| |
| content: "";
| |
| position: absolute;
| |
| top: 0;
| |
| left: 10%;
| |
| width: 80%;
| |
| height: 1px;
| |
| background: var(--wiz-spellbook-colour);
| |
| }
| |
| | |
| .wizlords-spell-card-grid {
| |
| display: grid;
| |
| grid-template-columns: repeat(6, minmax(0, 1fr));
| |
| gap: 14px;
| |
| margin: 16px auto 26px;
| |
| }
| |
| | |
| .wizlords-servant-rules {
| |
| margin: 16px 0 18px;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #171717;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .wizlords-servant-rules-title {
| |
| padding: 12px 16px 4px;
| |
| color: var(--wiz-spellbook-colour);
| |
| font-size: 18px;
| |
| font-weight: bold;
| |
| line-height: 1.25;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-servant-rules-hint {
| |
| display: none;
| |
| padding: 0 16px 12px;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-style: italic;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-servant-rules.mw-collapsed .wizlords-servant-rules-hint {
| |
| display: block;
| |
| }
| |
| | |
| .wizlords-servant-rules:not(.mw-collapsed) .wizlords-servant-rules-hint {
| |
| display: none;
| |
| }
| |
| | |
| .wizlords-servant-rules > .mw-collapsible-toggle {
| |
| margin: 12px 16px 0 0;
| |
| color: var(--wiz-text, #d2d2d2) !important;
| |
| }
| |
| | |
| .wizlords-servant-rules > .mw-collapsible-toggle .mw-collapsible-text,
| |
| .wizlords-servant-rules > .mw-collapsible-toggle a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| }
| |
| | |
| .wizlords-servant-rules-grid { | |
| display: grid;
| |
| grid-template-columns: repeat(4, minmax(0, 1fr));
| |
| gap: 18px;
| |
| padding: 0 16px 16px;
| |
| }
| |
| | |
| .wizlords-servant-rules-section {
| |
| line-height: 1.45;
| |
| }
| |
| | |
| .wizlords-servant-rules-section ul {
| |
| margin: 6px 0 0;
| |
| padding-left: 22px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-servant-rules-section li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| }
| |
| | |
| .wizlords-spell-card {
| |
| grid-column: span 2;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #171717;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| }
| |
| | |
| .wizlords-spell-card-grid.cards-1 .wizlords-spell-card:nth-child(1) {
| |
| grid-column: 3 / span 2;
| |
| }
| |
| | |
| .wizlords-spell-card-grid.cards-2 .wizlords-spell-card:nth-child(1),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(1),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(3) {
| |
| grid-column: 2 / span 2;
| |
| }
| |
| | |
| .wizlords-spell-card-grid.cards-2 .wizlords-spell-card:nth-child(2),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(2),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(4) {
| |
| grid-column: 4 / span 2;
| |
| }
| |
| | |
| .wizlords-spell-card-grid.cards-5 .wizlords-spell-card:nth-child(4) {
| |
| grid-column: 2 / span 2;
| |
| }
| |
| | |
| .wizlords-spell-card-grid.cards-5 .wizlords-spell-card:nth-child(5) {
| |
| grid-column: 4 / span 2;
| |
| }
| |
| | |
| .wizlords-spell-card-title {
| |
| padding: 12px;
| |
| color: var(--wiz-spellbook-colour, var(--wiz-link, #ff942d));
| |
| font-size: 18px;
| |
| font-weight: bold;
| |
| line-height: 1.25;
| |
| text-align: center;
| |
| }
| |
| | |
| .wizlords-spell-card-meta {
| |
| padding: 0 12px;
| |
| line-height: 1.45;
| |
| }
| |
| | |
| .wizlords-spell-card-meta ul {
| |
| margin: 4px 0 0;
| |
| padding-left: 22px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-spell-card-meta li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| }
| |
| | |
| .wizlords-spell-card-divider {
| |
| width: 55%;
| |
| height: 1px;
| |
| margin: 14px auto 12px;
| |
| background: var(--wiz-spell-card-divider-colour, var(--wiz-race-table-divider-colour, #9d7531));
| |
| }
| |
| | |
| .wizlords-spell-card-section {
| |
| padding: 0 12px 12px;
| |
| line-height: 1.45;
| |
| }
| |
| | |
| .wizlords-spell-card-section ul {
| |
| margin: 6px 0 0;
| |
| padding-left: 22px;
| |
| list-style: disc outside;
| |
| }
| |
| | |
| .wizlords-spell-card-section li {
| |
| display: list-item;
| |
| margin: 0 0 3px;
| |
| }
| |
| | |
| .wizlords-spell-card-body {
| |
| padding: 0 12px 14px;
| |
| line-height: 1.45;
| |
| }
| |
| | |
| /* WIZLORDS NAVBOX */
| |
| /* --------------- */
| |
| .ww-navbox {
| |
| clear: both;
| |
| width: 100%;
| |
| margin: 24px auto 12px;
| |
| padding: 3px;
| |
| border: 1px solid var(--wiz-content-border, #ff942d);
| |
| background: #1f1e1e;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-size: 88%;
| |
| line-height: 1.5;
| |
| text-align: center;
| |
| box-sizing: border-box;
| |
| }
| |
| | |
| .ww-navbox-title {
| |
| padding: 4px 10px 5px;
| |
| background: #1a1a1a;
| |
| color: var(--wiz-link, #ff942d);
| |
| font-size: 16px;
| |
| font-weight: bold;
| |
| line-height: 1.35;
| |
| text-align: center;
| |
| }
| |
| | |
| .ww-navbox > .mw-collapsible-toggle {
| |
| position: relative;
| |
| z-index: 2;
| |
| float: right;
| |
| margin: 4px 8px 0 0;
| |
| color: var(--wiz-text, #d2d2d2) !important;
| |
| font-weight: bold;
| |
| }
| |
| | |
| .ww-navbox > .mw-collapsible-toggle .mw-collapsible-text,
| |
| .ww-navbox > .mw-collapsible-toggle a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .ww-navbox > .mw-collapsible-content {
| |
| display: flex;
| |
| flex-direction: column;
| |
| clear: both;
| |
| margin: 0;
| |
| padding: 0;
| |
| }
| |
| | |
| .ww-navbox-row {
| |
| display: flex;
| |
| margin: 0;
| |
| border-top: 2px solid var(--wiz-content-background, #222);
| |
| border-left: 2px solid var(--wiz-content-background, #222);
| |
| border-right: 2px solid var(--wiz-content-background, #222);
| |
| line-height: 1.5;
| |
| }
| |
| | |
| .ww-navbox-row:first-of-type {
| |
| border-top: 2px solid var(--wiz-content-background, #222);
| |
| }
| |
| | |
| .ww-navbox-row:last-of-type {
| |
| border-bottom: 2px solid var(--wiz-content-background, #222);
| |
| }
| |
| | |
| .ww-navbox-row:nth-child(odd) {
| |
| background: #222;
| |
| }
| |
| | |
| .ww-navbox-row:nth-child(even) {
| |
| background: #252525;
| |
| }
| |
| | |
| .ww-navbox-group {
| |
| flex: 0 0 143px;
| |
| width: 143px;
| |
| padding: 4px 10px;
| |
| border-right: 2px solid var(--wiz-content-background, #222);
| |
| background: #1a1a1a;
| |
| color: var(--wiz-link, #ff942d);
| |
| font-weight: bold;
| |
| text-align: right;
| |
| box-sizing: border-box;
| |
| white-space: normal;
| |
| overflow-wrap: anywhere;
| |
| }
| |
| | |
| .ww-navbox-list {
| |
| flex: 1;
| |
| padding: 4px 10px;
| |
| text-align: left;
| |
| box-sizing: border-box;
| |
| background: inherit;
| |
| }
| |
| | |
| .ww-navbox p {
| |
| margin: 0;
| |
| }
| |
| | |
| .ww-navbox > .mw-collapsible-content > p:empty,
| |
| .ww-navbox > .mw-collapsible-content > p:has(> br:only-child) {
| |
| display: none;
| |
| }
| |
| | |
| .ww-navbox a {
| |
| color: var(--wiz-link, #ff942d) !important;
| |
| font-weight: bold;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .ww-navbox a:hover {
| |
| color: #ffd37a !important;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .wizlords-navbox-divider {
| |
| width: 90%;
| |
| height: 1px;
| |
| margin: 16px auto 14px;
| |
| background: #9d7531;
| |
| }
| |
| | |
| .ww-navbox-stack > .ww-navbox-title {
| |
| border-bottom: 1px solid #9d7531;
| |
| }
| |
| | |
| .ww-navbox-stack > .mw-collapsible-content > .ww-navbox {
| |
| margin: 0;
| |
| padding-top: 0;
| |
| padding-bottom: 0;
| |
| border-top: 0;
| |
| border-left: 0;
| |
| border-right: 0;
| |
| border-bottom: 0;
| |
| font-size: 100%;
| |
| }
| |
| | |
| .ww-navbox-stack > .mw-collapsible-content > .ww-navbox:first-child {
| |
| border-top: 0;
| |
| }
| |
| | |
| .ww-navbox-stack > .mw-collapsible-content > .ww-navbox:last-child {
| |
| border-bottom: 0;
| |
| }
| |
| | |
| /* Phone and tablet card placement reset; the phone query below then reduces
| |
| these grids from two columns to one. */
| |
| @media (max-width: 899px) {
| |
| .wizlords-spellbooks-desktop {
| |
| display: none;
| |
| } | | } |
|
| |
|
| .wizlords-spellbooks-mobile { | | $(initialiseClassCards); |
| display: block;
| |
| }
| |
| | |
| .wizlords-class-card-grid,
| |
| .wizlords-spell-card-grid {
| |
| grid-template-columns: repeat(2, minmax(0, 1fr));
| |
| }
| |
|
| |
|
| .wizlords-servant-rules-grid { | | if (mobileQuery.addEventListener) { |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | | mobileQuery.addEventListener('change', initialiseClassCards); |
| | } else if (mobileQuery.addListener) { |
| | mobileQuery.addListener(initialiseClassCards); |
| } | | } |
|
| |
|
| .wizlords-class-card, | | $(document).on('click', '.wizlords-class-card', function (event) { |
| .wizlords-class-card-grid.cards-5 .wizlords-class-card:nth-child(4),
| | if ($(event.target).closest('a').length) { |
| .wizlords-class-card-grid.cards-5 .wizlords-class-card:nth-child(5),
| | return; |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(1),
| | } |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(2),
| |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(3),
| |
| .wizlords-class-card-grid.cards-4 .wizlords-class-card:nth-child(4),
| |
| .wizlords-spell-card,
| |
| .wizlords-spell-card-grid.cards-1 .wizlords-spell-card:nth-child(1),
| |
| .wizlords-spell-card-grid.cards-2 .wizlords-spell-card:nth-child(1),
| |
| .wizlords-spell-card-grid.cards-2 .wizlords-spell-card:nth-child(2),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(1),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(2),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(3),
| |
| .wizlords-spell-card-grid.cards-4 .wizlords-spell-card:nth-child(4),
| |
| .wizlords-spell-card-grid.cards-5 .wizlords-spell-card:nth-child(4),
| |
| .wizlords-spell-card-grid.cards-5 .wizlords-spell-card:nth-child(5) {
| |
| grid-column: auto;
| |
| }
| |
|
| |
|
| .wizlords-mobile-spellbook {
| | toggleClassCard(this); |
| margin: 18px 0 30px; | | }); |
| } | |
|
| |
|
| .wizlords-mobile-spellbook-title { | | $(document).on('keydown', '.wizlords-class-card', function (event) { |
| margin: 22px 0 10px; | | if (event.key === 'Enter' || event.key === ' ') { |
| padding-bottom: 6px;
| | event.preventDefault(); |
| border-bottom: 1px solid var(--wiz-content-border, #ff942d);
| | toggleClassCard(this); |
| color: var(--wiz-heading, #e7e1d4);
| | } |
| font-family: Roboto, Roboto-fallback, system-ui, -apple-system, sans-serif; | | }); |
| font-size: 24px;
| | }() ); |
| font-weight: 700;
| |
| line-height: 1.25;
| |
| text-align: center;
| |
| }
| |
|
| |
|
| .wizlords-mobile-spell-category { | | /* Mobile/tablet spellbook builder and collapse controls */ |
| margin: 18px 0 22px;
| | ( function () { |
| } | | var spellbookQuery = window.matchMedia('(max-width: 899px)'); |
| | var hasBuiltMobileSpellbooks = false; |
|
| |
|
| .wizlords-mobile-spell-category-heading { | | var spellSummaries = { |
| margin: 0 0 4px; | | 'Arcane Weapon': 'Imbues a one-handed weapon with arcane energy, allowing it to strike with magical force.', |
| color: var(--wiz-heading, #e7e1d4); | | 'Greater Arcane Weapon': 'Empowers a two-handed weapon with potent arcane magic, greatly enhancing its destructive power.', |
| font-size: 18px; | | 'Arcane Armour': 'Wraps an ally in protective arcane energy, increasing their resilience against harm.', |
| font-weight: 700; | | 'Arcane Ward': 'Enchants a shield with magical protection, allowing it to deflect hostile spells.', |
| line-height: 1.3; | | 'Arcane Bolt': 'Channels raw arcane energy into a magical projectile that blasts through enemy defences.', |
| text-align: left; | | 'Arcane Force': 'Unleashes a burst of telekinetic power that hurls enemies away from the caster.', |
| } | | 'Nullify': 'Dispels magical effects within the surrounding area, disrupting spells and summoned creatures alike.', |
| | 'Mage Walk': 'Allows the caster to briefly walk across water as though it were solid ground.', |
| | 'Arcane Bridge': 'Creates a temporary bridge of magical energy, allowing allies to safely cross dangerous terrain.', |
| | 'Arcane Bridge Lv1': 'Creates a temporary bridge of magical energy, allowing allies to safely cross dangerous terrain.', |
| | 'Arcane Bridge Lv2': 'Creates a temporary bridge of magical energy, allowing allies to safely cross dangerous terrain.', |
| | 'Arcane Bind': 'Pins an enemy in place with invisible magical force, preventing them from escaping.', |
| | 'Summon Minor Arcane Servant - Defend': 'Summons a lesser arcane spirit that remains close to its master, defending them from nearby threats.', |
| | 'Summon Minor Arcane Servant - Attack': 'Summons a lesser arcane spirit that relentlessly pursues and attacks a chosen enemy.', |
| | 'Summon Arcane Servant - Defend': 'Calls forth a powerful guardian spirit dedicated to protecting its summoner.', |
| | 'Summon Arcane Servant - Attack': 'Summons a powerful arcane warrior that hunts down enemies with unwavering determination.', |
| | 'Summon Greater Arcane Servant': 'Calls forth a sentient arcane servant capable of acting independently on the battlefield.', |
| | 'Blessing': 'Fills an ally with divine favour, strengthening their body and shielding them from hostile magic.', |
| | 'Blessed Weapon': 'Consecrates a one-handed weapon so it strikes with holy power.', |
| | 'Greater Blessed Weapon': 'Infuses a two-handed weapon with divine might, allowing it to smite evil with every blow.', |
| | 'Holy Ward': 'Blesses a shield with sacred protection, turning aside magical attacks.', |
| | 'Sanctuary': 'Creates a holy sanctuary that wards away magical beings and protects the faithful.', |
| | 'Heal': 'Channels divine energy to mend wounds and restore an ally\'s vitality.', |
| | 'Full Heal': 'Completely restores a living ally, closing wounds and renewing their strength.', |
| | 'Mass Heal': 'Calls upon divine power to restore multiple wounded allies at once.', |
| | 'Resurrection': 'Returns a fallen ally to life through the power of divine intervention.', |
| | 'Bind Person': 'Calls upon divine authority to hold a mortal in place, preventing their escape.', |
| | 'Bind Person Lv1': 'Calls upon divine authority to hold a mortal in place, preventing their escape.', |
| | 'Bind Person Lv2': 'Calls upon divine authority to hold a mortal in place, preventing their escape.', |
| | 'Immobilise': 'Overwhelms a target with sacred power, leaving them completely unable to move or fight.', |
| | 'Taunt': 'Compels magical creatures to focus their attention upon the caster through divine command.', |
| | 'Taunt Lv1': 'Compels magical creatures to focus their attention upon the caster through divine command.', |
| | 'Taunt Lv2': 'Compels magical creatures to focus their attention upon the caster through divine command.', |
| | 'Banish': 'Drives magical creatures and summoned beings away with overwhelming divine authority.' |
| | }; |
|
| |
|
| .wizlords-mobile-spell-category-description { | | var mobileSpellTitles = { |
| margin: 0 0 10px; | | 'Summon Arcane Servant - Attack': 'Servant - Attack', |
| color: var(--wiz-text, #d2d2d2); | | 'Summon Arcane Servant - Defend': 'Servant - Defend', |
| font-size: 14px; | | 'Summon Minor Arcane Servant - Attack': 'Minor Servant - Attack', |
| font-style: italic; | | 'Summon Minor Arcane Servant - Defend': 'Minor Servant - Defend', |
| line-height: 1.45; | | 'Summon Greater Arcane Servant': 'Greater Servant' |
| } | | }; |
|
| |
|
| .wizlords-mobile-spell-card { | | function getSpellIcon(iconType) { |
| --wiz-mobile-spell-accent: #9a3dae;
| | var fileName = iconType === 'divine' ? 'DivineIcon.png' : 'ArcaneIcon.png'; |
| position: relative;
| | var scriptPath = mw.config.get('wgScriptPath') || ''; |
| display: grid;
| |
| grid-template-columns: 92px minmax(0, 1fr);
| |
| grid-template-rows: auto auto auto; | |
| align-content: center;
| |
| gap: 0 10px;
| |
| box-sizing: border-box;
| |
| width: 100%; | |
| max-width: 560px;
| |
| min-height: 150px;
| |
| margin: 0 auto 10px;
| |
| padding: 8px 9px;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #1f1e1e;
| |
| cursor: pointer;
| |
| }
| |
|
| |
|
| .wizlords-mobile-spellbook-arcane .wizlords-mobile-spell-card {
| | return $('<img>') |
| --wiz-mobile-spell-accent: #d66be3;
| | .attr('src', scriptPath + '/index.php/Special:FilePath/' + encodeURIComponent(fileName)) |
| | .attr('alt', '') |
| | .attr('loading', 'lazy') |
| | .attr('decoding', 'async'); |
| } | | } |
|
| |
|
| .wizlords-mobile-spellbook-divine .wizlords-mobile-spell-card { | | function getSpellbookIcon(iconType) { |
| --wiz-mobile-spell-accent: #19c4eb; | | var fileName = iconType === 'divine' ? 'DivineSpellbookIcon.png' : 'ArcaneSpellbookIcon.png'; |
| }
| | var scriptPath = mw.config.get('wgScriptPath') || ''; |
|
| |
|
| .wizlords-mobile-spell-card.is-open {
| | return $('<img>') |
| align-content: start;
| | .attr('src', scriptPath + '/index.php/Special:FilePath/' + encodeURIComponent(fileName)) |
| padding-top: 24px;
| | .attr('alt', '') |
| | .attr('loading', 'lazy') |
| | .attr('decoding', 'async'); |
| } | | } |
|
| |
|
| .wizlords-mobile-spell-card:focus { | | function buildMobileSpellCard($sourceCard, iconType) { |
| outline: 2px solid var(--wiz-content-border, #ff942d); | | var title = $.trim($sourceCard.children('.wizlords-spell-card-title').first().text()); |
| outline-offset: 2px; | | var mobileTitle = mobileSpellTitles[title] || title; |
| }
| | var $card = $('<div>').addClass('wizlords-mobile-spell-card'); |
| | var $icon = $('<div>').addClass('wizlords-mobile-spell-card-icon').append(getSpellIcon(iconType)); |
| | var $title = $('<div>').addClass('wizlords-mobile-spell-card-title').text(mobileTitle); |
| | var $summary = $('<div>').addClass('wizlords-mobile-spell-card-summary').text(spellSummaries[title] || ''); |
| | var $rules = $('<div>').addClass('wizlords-mobile-spell-card-rules'); |
|
| |
|
| .wizlords-mobile-spell-card-icon {
| | $sourceCard.children().not('.wizlords-spell-card-title').each(function () { |
| grid-row: 1 / span 2;
| | $rules.append($(this).clone()); |
| grid-column: 1; | | }); |
| align-self: center;
| |
| box-sizing: border-box;
| |
| width: 88px;
| |
| height: 88px;
| |
| overflow: hidden;
| |
| padding: 0;
| |
| text-align: center;
| |
| }
| |
|
| |
|
| .wizlords-mobile-spell-card-icon img {
| | return $card |
| display: block;
| | .append($icon) |
| width: 88px !important;
| | .append($title) |
| height: 88px !important;
| | .append($summary) |
| max-width: 88px !important;
| | .append($rules); |
| max-height: 88px !important;
| |
| object-fit: contain;
| |
| } | | } |
|
| |
|
| .wizlords-mobile-spell-card-title { | | function buildMobileSpellbook(sourceSelector, title, variantClass, iconType) { |
| position: relative; | | var $source = $(sourceSelector); |
| grid-row: 1; | | var $content = $source.children('.mw-collapsible-content').first(); |
| grid-column: 2;
| | var $book = $('<div>').addClass('wizlords-mobile-spellbook is-open ' + variantClass); |
| align-self: start;
| | var $header = $('<div>') |
| margin: 0 0 3px;
| | .addClass('wizlords-mobile-spellbook-header') |
| padding: 0 22px 3px 18px;
| | .attr('role', 'button') |
| border-bottom: 1px solid var(--wiz-mobile-spell-accent, var(--wiz-content-border, #ff942d)); | | .attr('tabindex', '0') |
| color: var(--wiz-heading, #e7e1d4); | | .attr('aria-expanded', 'true'); |
| font-family: Roboto, Roboto-fallback, system-ui, -apple-system, sans-serif;
| | var $body = $('<div>').addClass('wizlords-mobile-spellbook-body'); |
| font-size: 20px; | | var $currentCategory = null; |
| font-weight: 700;
| |
| line-height: 1.25;
| |
| text-align: left; | |
| }
| |
|
| |
|
| .wizlords-mobile-spell-card-title::before {
| | $header |
| content: "";
| | .append($('<span>').addClass('wizlords-mobile-spellbook-title').text(title)) |
| position: absolute;
| | .append($('<span>').addClass('wizlords-mobile-spellbook-icon').append(getSpellbookIcon(iconType))); |
| top: 50%;
| |
| left: 1px;
| |
| width: 7px;
| |
| height: 7px;
| |
| border-right: 2px solid var(--wiz-heading, #e7e1d4);
| |
| border-bottom: 2px solid var(--wiz-heading, #e7e1d4);
| |
| transform: translateY(-65%) rotate(45deg);
| |
| transform-origin: 50% 50%;
| |
| }
| |
|
| |
|
| .wizlords-mobile-spell-card.is-open .wizlords-mobile-spell-card-title::before {
| | $book.append($header).append($body); |
| transform: translateY(-35%) rotate(225deg);
| |
| }
| |
|
| |
|
| .wizlords-mobile-spell-card-summary {
| | $content.children().each(function () { |
| grid-row: 2;
| | var $node = $(this); |
| grid-column: 2;
| |
| margin: 0;
| |
| color: var(--wiz-text, #d2d2d2);
| |
| font-family: Roboto, Roboto-fallback, system-ui, -apple-system, sans-serif;
| |
| font-size: 13px;
| |
| font-style: italic;
| |
| font-weight: 400;
| |
| line-height: 1.35;
| |
| }
| |
|
| |
|
| .wizlords-mobile-spell-card-rules {
| | if ($node.hasClass('wizlords-spell-category-heading')) { |
| display: none;
| | $currentCategory = $('<div>').addClass('wizlords-mobile-spell-category'); |
| grid-column: 1 / -1;
| | $currentCategory.append($('<div>').addClass('wizlords-mobile-spell-category-heading').text($.trim($node.text()))); |
| margin-top: 10px;
| | $body.append($currentCategory); |
| padding: 10px 10px 2px;
| | return; |
| border-top: 1px solid var(--wiz-mobile-spell-accent, var(--wiz-content-border, #ff942d));
| | } |
| color: var(--wiz-text, #d2d2d2);
| |
| background: #171717;
| |
| line-height: 1.45;
| |
| }
| |
|
| |
|
| .wizlords-mobile-spell-card.is-open .wizlords-mobile-spell-card-rules {
| | if ($node.hasClass('wizlords-spell-category-description') && $currentCategory) { |
| display: block;
| | $currentCategory.append($node.clone().removeClass('wizlords-spell-category-description').addClass('wizlords-mobile-spell-category-description')); |
| }
| | return; |
| | } |
|
| |
|
| .wizlords-mobile-spell-card-rules .wizlords-spell-card-meta,
| | if ($node.hasClass('wizlords-spell-card-grid')) { |
| .wizlords-mobile-spell-card-rules .wizlords-spell-card-section {
| | if (!$currentCategory) { |
| padding: 0 0 10px;
| | $currentCategory = $('<div>').addClass('wizlords-mobile-spell-category'); |
| }
| | $body.append($currentCategory); |
| | } |
|
| |
|
| .wizlords-mobile-spell-card-rules .wizlords-spell-card-divider {
| | $node.children('.wizlords-spell-card').each(function () { |
| width: 55%;
| | $currentCategory.append(buildMobileSpellCard($(this), iconType)); |
| height: 1px;
| | }); |
| margin: 10px auto;
| | } |
| background: var(--wiz-mobile-spell-accent, var(--wiz-content-border, #ff942d));
| | }); |
| }
| |
| } | |
|
| |
|
| @media (min-width: 900px) {
| | return $book; |
| .wizlords-spellbooks-mobile {
| |
| display: none; | |
| } | | } |
|
| |
|
| .wizlords-spellbooks-desktop { | | function buildMobileSpellbooks() { |
| display: block;
| | var $target = $('.wizlords-spellbooks-mobile'); |
| }
| |
| }
| |
|
| |
|
| /* Phone card layout. */
| | if (hasBuiltMobileSpellbooks || !$target.length) { |
| @media (max-width: 599px) {
| | return; |
| .wizlords-class-card-grid,
| | } |
| .wizlords-spell-card-grid {
| |
| grid-template-columns: 1fr; | |
| }
| |
|
| |
|
| .wizlords-servant-rules-grid {
| | $target |
| grid-template-columns: 1fr;
| | .empty() |
| }
| | .append(buildMobileSpellbook('#wizlords-arcane-spellbook', 'Arcane Spellbook', 'wizlords-mobile-spellbook-arcane', 'arcane')) |
| | .append(buildMobileSpellbook('#wizlords-divine-spellbook', 'Divine Spellbook', 'wizlords-mobile-spellbook-divine', 'divine')); |
|
| |
|
| .wizlords-class-card-grid {
| | hasBuiltMobileSpellbooks = true; |
| display: block; | |
| margin: 12px 0 20px;
| |
| } | | } |
|
| |
|
| .wizlords-class-card { | | function initialiseMobileSpellCards() { |
| position: relative;
| | buildMobileSpellbooks(); |
| display: grid;
| |
| grid-template-columns: 92px minmax(0, 1fr);
| |
| grid-template-rows: auto auto auto;
| |
| align-content: center;
| |
| gap: 0 10px; | |
| box-sizing: border-box;
| |
| width: 100%;
| |
| margin: 0 0 10px;
| |
| padding: 8px 9px;
| |
| border: 1px solid var(--wiz-race-table-border-colour, #4d4d4d);
| |
| background: #1f1e1e;
| |
| cursor: pointer;
| |
| }
| |
|
| |
|
| .wizlords-class-card:not(.is-open) {
| | $('.wizlords-spellbooks-mobile').attr('aria-hidden', spellbookQuery.matches ? 'false' : 'true'); |
| height: 150px;
| |
| overflow: hidden;
| |
| }
| |
|
| |
|
| .wizlords-class-card.is-open {
| | $('.wizlords-mobile-spellbook-header').each(function () { |
| height: auto;
| | var $header = $(this); |
| align-content: start;
| | var isOpen = $header.closest('.wizlords-mobile-spellbook').hasClass('is-open'); |
| padding-top: 24px;
| |
| }
| |
|
| |
|
| .wizlords-class-card:focus {
| | if (spellbookQuery.matches) { |
| outline: 2px solid var(--wiz-content-border, #ff942d);
| | $header.attr('aria-expanded', isOpen ? 'true' : 'false'); |
| outline-offset: 2px;
| | } else { |
| }
| | $header.removeAttr('aria-expanded'); |
| | } |
| | }); |
|
| |
|
| .wizlords-class-card-icon {
| | $('.wizlords-mobile-spell-card').each(function () { |
| grid-row: 1 / span 2;
| | var $card = $(this); |
| grid-column: 1;
| |
| align-self: center;
| |
| box-sizing: border-box;
| |
| width: 88px;
| |
| height: 88px;
| |
| overflow: hidden;
| |
| padding: 0;
| |
| text-align: center;
| |
| }
| |
|
| |
|
| .wizlords-class-card-icon span,
| | if (spellbookQuery.matches) { |
| .wizlords-class-card-icon img {
| | if (!$card.attr('data-wizlords-mobile-spell-card')) { |
| display: block;
| | $card |
| width: 88px !important;
| | .attr('data-wizlords-mobile-spell-card', '1') |
| height: 88px !important;
| | .attr('role', 'button') |
| max-width: 88px !important;
| | .attr('tabindex', '0'); |
| max-height: 88px !important;
| | } |
| object-fit: contain;
| |
| }
| |
|
| |
|
| .wizlords-class-card-title {
| | if (!$card.hasClass('is-open')) { |
| position: relative;
| | $card.attr('aria-expanded', 'false'); |
| grid-row: 1;
| | } |
| grid-column: 2;
| | } else { |
| align-self: start;
| | $card |
| margin: 0 0 3px;
| | .removeAttr('data-wizlords-mobile-spell-card') |
| padding: 0 22px 3px 18px;
| | .removeAttr('role') |
| border-bottom: 1px solid var(--wiz-class-accent, var(--wiz-content-border, #ff942d));
| | .removeAttr('tabindex') |
| color: var(--wiz-heading, #e7e1d4);
| | .removeAttr('aria-expanded') |
| font-family: Roboto, Roboto-fallback, system-ui, -apple-system, sans-serif;
| | .removeClass('is-open'); |
| font-size: 20px;
| | } |
| font-weight: 700; | | }); |
| line-height: 1.25;
| |
| text-align: left;
| |
| } | | } |
|
| |
|
| .wizlords-class-card-title::before { | | function toggleMobileSpellCard(card) { |
| content: ""; | | if (!spellbookQuery.matches) { |
| position: absolute;
| | return; |
| top: 50%;
| | } |
| left: 1px;
| |
| width: 7px;
| |
| height: 7px;
| |
| border-right: 2px solid var(--wiz-heading, #e7e1d4);
| |
| border-bottom: 2px solid var(--wiz-heading, #e7e1d4);
| |
| transform: translateY(-65%) rotate(45deg);
| |
| transform-origin: 50% 50%; | |
| }
| |
|
| |
|
| .wizlords-class-card.is-open .wizlords-class-card-title::before {
| | var $card = $(card); |
| transform: translateY(-35%) rotate(225deg); | | var isOpen = $card.hasClass('is-open'); |
| }
| |
|
| |
|
| .wizlords-class-card-body {
| | $card |
| display: contents;
| | .toggleClass('is-open', !isOpen) |
| padding: 0;
| | .attr('aria-expanded', isOpen ? 'false' : 'true'); |
| background: transparent;
| |
| } | | } |
|
| |
|
| .wizlords-class-card-summary { | | function toggleMobileSpellbook(header) { |
| grid-row: 2; | | if (!spellbookQuery.matches) { |
| grid-column: 2;
| | return; |
| margin: 0;
| | } |
| color: var(--wiz-text, #d2d2d2);
| |
| font-family: Roboto, Roboto-fallback, system-ui, -apple-system, sans-serif;
| |
| font-size: 13px;
| |
| font-style: italic; | |
| font-weight: 400;
| |
| line-height: 1.35;
| |
| display: block;
| |
| overflow: visible;
| |
| }
| |
|
| |
|
| .wizlords-class-card.is-open .wizlords-class-card-summary {
| | var $header = $(header); |
| display: block;
| | var $book = $header.closest('.wizlords-mobile-spellbook'); |
| overflow: visible;
| | var isOpen = $book.hasClass('is-open'); |
| }
| |
|
| |
|
| .wizlords-class-card-divider {
| | $book.toggleClass('is-open', !isOpen); |
| display: none; | | $header.attr('aria-expanded', isOpen ? 'false' : 'true'); |
| } | | } |
|
| |
|
| .wizlords-class-card-rules { | | $(initialiseMobileSpellCards); |
| display: none;
| |
| grid-column: 1 / -1;
| |
| margin-top: 10px;
| |
| padding: 10px 10px 2px;
| |
| border-top: 1px solid var(--wiz-class-accent, var(--wiz-content-border, #ff942d));
| |
| color: var(--wiz-text, #d2d2d2);
| |
| background: #171717;
| |
| }
| |
|
| |
|
| .wizlords-class-card.is-open .wizlords-class-card-rules { | | if (spellbookQuery.addEventListener) { |
| display: block; | | spellbookQuery.addEventListener('change', initialiseMobileSpellCards); |
| | } else if (spellbookQuery.addListener) { |
| | spellbookQuery.addListener(initialiseMobileSpellCards); |
| } | | } |
|
| |
|
| .wizlords-class-card-grid-martial .wizlords-class-card { | | $(document).on('click', '.wizlords-mobile-spell-card', function (event) { |
| --wiz-class-accent: #9d7531; | | if ($(event.target).closest('a').length) { |
| }
| | return; |
| | } |
|
| |
|
| .wizlords-class-card-grid-arcane .wizlords-class-card {
| | toggleMobileSpellCard(this); |
| --wiz-class-accent: #9a3dae; | | }); |
| } | |
|
| |
|
| .wizlords-class-card-grid-divine .wizlords-class-card { | | $(document).on('click', '.wizlords-mobile-spellbook-header', function () { |
| --wiz-class-accent: #33b6cf; | | toggleMobileSpellbook(this); |
| } | | }); |
| }
| |
|
| |
|
| /* Citizen-specific safeguard: keep custom mobile collapsible box headings using
| | $(document).on('keydown', '.wizlords-mobile-spell-card', function (event) { |
| the same clean interface typography as Citizen section headings. This is
| | if (event.key === 'Enter' || event.key === ' ') { |
| repeated here because Common.css can override equal-specificity skin rules
| | event.preventDefault(); |
| depending on ResourceLoader order. */
| | toggleMobileSpellCard(this); |
| .skin-citizen .mw-parser-output .wizlords-collapsible-section .wizlords-collapsible-section-title {
| | } |
| font-family: Roboto, Roboto-fallback, system-ui, -apple-system, sans-serif !important;
| | }); |
| font-size: 22px !important;
| |
| font-weight: 700 !important;
| |
| line-height: 1.3 !important; | |
| }
| |
|
| |
|
| .skin-citizen .mw-parser-output .wizlords-collapsible-section > .wizlords-collapsed-hint { | | $(document).on('keydown', '.wizlords-mobile-spellbook-header', function (event) { |
| font-family: Roboto, Roboto-fallback, system-ui, -apple-system, sans-serif !important;
| | if (event.key === 'Enter' || event.key === ' ') { |
| font-size: 14px !important;
| | event.preventDefault(); |
| font-style: normal !important;
| | toggleMobileSpellbook(this); |
| font-weight: 400 !important;
| | } |
| line-height: 1.6 !important; | | }); |
| } | | }() ); |
