|
|
| Line 1: |
Line 1: |
| <noinclude> | | <noinclude> |
| This is a template for merchant NPC pages. | | This is a test template for merchants. |
|
| |
|
| Common parameters:
| | Usage notes: |
| * <code>imagefilename</code> — optional image filename | | * <code>imagefilename</code> is optional. |
| * <code>width</code> — optional image width, defaults to <code>420px</code> | | * <code>width</code> is optional and defaults to <code>520px</code>. |
| * <code>second_image</code> — optional secondary image | | * Example: <code>| width = 420px</code> |
| * <code>second_width</code> — optional secondary image width, defaults to <code>280px</code>
| |
| ---- | | ---- |
| </noinclude>__NOTOC__ | | </noinclude>__NOTOC__ |
|
| |
|
| <div class="merchant-page-shell" style=" | | {{#if:{{{imagefilename|}}}| |
| margin: 0.75rem 0 1rem;
| | <div class="merchant-page-image" style="float:right; margin: 0 0 1rem 1.25rem; max-width: min(620px, 55vw); text-align:center;"> |
| padding: 0.85rem;
| | [[File:{{{imagefilename}}}|{{#if:{{{width|}}}|{{{width}}}|520px}}|frameless|alt={{{name|Merchant image}}}]] |
| background: linear-gradient(180deg, rgba(13,18,26,0.88), rgba(8,12,18,0.94));
| | </div> |
| border: 1px solid rgba(216,183,92,0.34);
| | }} |
| border-radius: 10px;
| |
| box-shadow: 0 10px 28px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04);
| |
| box-sizing: border-box;
| |
| ">
| |
|
| |
|
| <div class="merchant-page-top" style="
| |
| display: grid;
| |
| grid-template-columns: minmax(230px, 0.45fr) minmax(320px, 0.55fr);
| |
| gap: 0.85rem;
| |
| align-items: start;
| |
| ">
| |
|
| |
| <div class="merchant-page-stats" style="
| |
| min-width: 0;
| |
| padding: 0.65rem;
| |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(255,255,255,0.09);
| |
| border-radius: 8px;
| |
| box-sizing: border-box;
| |
| ">
| |
| {{Mobstatsbox | | {{Mobstatsbox |
| | name = {{{name}}} | | | name = {{{name}}} |
| Line 53: |
Line 33: |
| | damage_per_hit = {{{damage_per_hit}}} | | | damage_per_hit = {{{damage_per_hit}}} |
| | special = {{{special}}} | | | special = {{{special}}} |
| }}
| |
| </div>
| |
|
| |
| <div class="merchant-page-media" style="
| |
| min-width: 0;
| |
| display: flex;
| |
| flex-direction: column;
| |
| gap: 0.75rem;
| |
| ">
| |
|
| |
| {{#if:{{{imagefilename|}}}|
| |
| <div class="merchant-page-image" style="
| |
| padding: 0.55rem;
| |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(216,183,92,0.24);
| |
| border-radius: 8px;
| |
| text-align: center;
| |
| box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
| |
| box-sizing: border-box;
| |
| ">
| |
| [[File:{{{imagefilename}}}|{{#if:{{{width|}}}|{{{width}}}|420px}}|frameless|alt={{{name|Merchant image}}}]]
| |
| </div>
| |
| }} | | }} |
|
| |
|
| {{#if:{{{second_image|}}}| | | {{#if:{{{second_image|}}}| |
| <div class="merchant-page-image-secondary" style=" | | <div class="merchant-page-image-secondary" style="float:right; clear:right; margin: 0 0 1rem 1.25rem; max-width: min(420px, 45vw); text-align:center;"> |
| padding: 0.55rem;
| | [[File:{{{second_image}}}|{{#if:{{{second_width|}}}|{{{second_width}}}|320px}}|frame|{{{second_imagetext|}}}]] |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(216,183,92,0.20);
| |
| border-radius: 8px;
| |
| text-align: center;
| |
| box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
| |
| box-sizing: border-box;
| |
| "> | |
| [[File:{{{second_image}}}|{{#if:{{{second_width|}}}|{{{second_width}}}|280px}}|frameless|{{{second_imagetext|}}}]] | |
| {{#if:{{{second_imagetext|}}}|
| |
| <div style="margin-top: 0.35rem; color: #aab3c2; font-size: 0.84rem; line-height: 1.25;">
| |
| {{{second_imagetext}}}
| |
| </div> | | </div> |
| }} | | }} |
| </div>
| |
| }}
| |
|
| |
| </div>
| |
| </div>
| |
|
| |
| <div class="mobPageDiv merchant-page-content" style="
| |
| margin-top: 0.85rem;
| |
| display: grid;
| |
| grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr);
| |
| gap: 0.85rem;
| |
| align-items: start;
| |
| ">
| |
|
| |
|
| <div class="merchant-page-main" style=" | | <div class="mobPageDiv"> |
| display: grid;
| |
| grid-template-columns: 1fr;
| |
| gap: 0.85rem;
| |
| min-width: 0;
| |
| "> | |
|
| |
|
| <div class="merchant-page-section" style="
| | === Description === |
| padding: 0.8rem;
| |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(255,255,255,0.09);
| |
| border-radius: 8px;
| |
| box-sizing: border-box;
| |
| ">
| |
| <h2 style="
| |
| margin: 0 0 0.55rem;
| |
| padding: 0 0 0.3rem;
| |
| color: #d8b75c;
| |
| font-family: Georgia, 'Times New Roman', serif;
| |
| font-size: 1.15rem;
| |
| letter-spacing: 0.04em;
| |
| border-bottom: 1px solid rgba(216,183,92,0.22);
| |
| ">Description</h2>
| |
|
| |
|
| {{{description|none}}} | | {{{description|none}}} |
| </div>
| |
|
| |
|
| <div class="merchant-page-section" style="
| | === Items Sold === |
| padding: 0.8rem;
| |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(255,255,255,0.09);
| |
| border-radius: 8px;
| |
| box-sizing: border-box;
| |
| ">
| |
| <h2 style="
| |
| margin: 0 0 0.55rem;
| |
| padding: 0 0 0.3rem;
| |
| color: #d8b75c;
| |
| font-family: Georgia, 'Times New Roman', serif;
| |
| font-size: 1.15rem;
| |
| letter-spacing: 0.04em;
| |
| border-bottom: 1px solid rgba(216,183,92,0.22);
| |
| ">Items Sold</h2>
| |
|
| |
|
| {{{items_sold|* None}}} | | {{{items_sold|* None}}} |
| </div>
| |
|
| |
| </div>
| |
|
| |
| <div class="merchant-page-side" style="
| |
| display: grid;
| |
| grid-template-columns: 1fr;
| |
| gap: 0.65rem;
| |
| min-width: 0;
| |
| ">
| |
|
| |
|
| <div class="merchant-page-section" style="
| | === Factions === |
| padding: 0.7rem;
| |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(255,255,255,0.09);
| |
| border-radius: 8px;
| |
| box-sizing: border-box;
| |
| ">
| |
| <h2 style="
| |
| margin: 0 0 0.45rem;
| |
| padding: 0 0 0.25rem;
| |
| color: #d8b75c;
| |
| font-family: Georgia, 'Times New Roman', serif;
| |
| font-size: 1rem;
| |
| letter-spacing: 0.04em;
| |
| border-bottom: 1px solid rgba(216,183,92,0.20);
| |
| ">Factions</h2>
| |
|
| |
|
| {{{factions|* None}}} | | {{{factions|* None}}} |
| </div>
| |
|
| |
|
| <div class="merchant-page-section" style="
| | === Opposing Factions === |
| padding: 0.7rem;
| |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(255,255,255,0.09);
| |
| border-radius: 8px;
| |
| box-sizing: border-box;
| |
| ">
| |
| <h2 style="
| |
| margin: 0 0 0.45rem;
| |
| padding: 0 0 0.25rem;
| |
| color: #d8b75c;
| |
| font-family: Georgia, 'Times New Roman', serif;
| |
| font-size: 1rem;
| |
| letter-spacing: 0.04em;
| |
| border-bottom: 1px solid rgba(216,183,92,0.20);
| |
| ">Opposing Factions</h2>
| |
|
| |
|
| {{{opposing_factions|* None}}} | | {{{opposing_factions|* None}}} |
| </div>
| |
|
| |
|
| <div class="merchant-page-section" style="
| | === Related Quests === |
| padding: 0.7rem;
| |
| background: rgba(255,255,255,0.03);
| |
| border: 1px solid rgba(255,255,255,0.09);
| |
| border-radius: 8px;
| |
| box-sizing: border-box;
| |
| ">
| |
| <h2 style="
| |
| margin: 0 0 0.45rem;
| |
| padding: 0 0 0.25rem;
| |
| color: #d8b75c;
| |
| font-family: Georgia, 'Times New Roman', serif;
| |
| font-size: 1rem;
| |
| letter-spacing: 0.04em;
| |
| border-bottom: 1px solid rgba(216,183,92,0.20);
| |
| ">Related Quests</h2>
| |
|
| |
|
| {{{related_quests|* None}}} | | {{{related_quests|* None}}} |
| </div>
| |
|
| |
|
| </div> | | </div> |
| </div>
| |
|
| |
| </div>
| |
|
| |
| <div style="clear:both;"></div> | | <div style="clear:both;"></div> |
|
| |
|