Template:Area/LayoutV2: Difference between revisions

Revision as of 12:25, 17 May 2025

Area/LayoutV2

INFORMATION

{{{Description}}}

Interactive Map

   {{{Map}}}
   

{{{Map-2}}}

Gates	Monsters	NPC
{{{Gates}}}	{{{Monster}}}	{{{NPC}}}

Areas	Old Man	Teleporter
{{{Areas}}}	{{{Old Man}}}	{{{Teleporter}}}

@@ Line 1: / Line 1: @@
 {{#if:{{{Logo|}}} | {{#ifexist: Media:{{{Logo}}}.png | [[File:{{{Logo}}}.png|775px|center]]|[[File:{{{Logo}}}.jpg|775px|center]] }}}}
 <br>
-<table width="100%" style="padding: 0 !important; border-spacing: 0; border: 1px solid #97100d; border-top-left-radius: 10px; border-top-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #FFFFE0;">
+<table width="100%" style="padding: 0 !important; border-spacing: 0; border: 1px solid #ff9c00; border-top-left-radius: 10px; border-top-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #222222;">
-   <td colspan="4" style="font-size: 14px; color: #f0d9a2; padding: 5px 5px 5px 10px !important; border-top-left-radius: 9px; border-top-right-radius: 9px; background: #5d0505;">{{#switch: {{{Empire}}}
+   <td colspan="4" style="font-size: 18px; color: #ffffff; padding: 8px 5px 8px 10px !important; border-top-left-radius: 9px; border-top-right-radius: 9px; background: linear-gradient(to right, #ff9c00, #ff7b00);">{{#switch: {{{Empire}}}
-    | Chunjo = [[File:FlagChunjo.png|24px]]
-    | Jinno = [[File:FlagJinno.png|24px]]
+    | Rahun= [[File:Flag_rahun.png|32px]]
-    | Shinsoo = [[File:FlagShinsoo.png|24px]]
+    | Solon= [[File:Flag_solon.png|32px]]
-    | Neutral = [[File:FlagNeutral.png|24px]]
+    | Rasan= [[File:Flag_rasan.png|32px]]
-    | All = [[File:FlagChunjo.png|24px]] [[File:FlagJinno.png|24px]] [[File:FlagShinsoo.png|24px]]
+    | Teven= [[File:Flag_teven.png|32px]]
+    | All = [[File:Flag_solon.png|28px]] [[File:Flag_rasan.png|28px]] [[File:Flag_teven.png|28px]] [[File:Flag_rahun.png|28px]]
     }} '''{{PAGENAME}}'''
    </td>
   <tr>
    <td rowspan="2" width="30" valign="middle" align="left" style="padding-left: 0 !important; padding-top: 0 !important;">
-    <div align="center" style="width: 20px; border: 1px solid #35215f; border-bottom-right-radius: 10px; border-top-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #35215f; color: #dadada; font-weight: bold; padding: 5px;"><div style="width: 10px; word-wrap: break-word;">INFORMATION</div></div>
+    <div align="center" style="width: 20px; border: 1px solid #ff9c00; border-bottom-right-radius: 10px; border-top-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;"><div style="width: 10px; word-wrap: break-word;">INFORMATION</div></div>
    </td>
-   <td  rowspan="2" style="width: 60%; text-align: justify; padding: 10px; border-right: 1px dashed #88283a;">{{#if: {{{Description}}} | {{{Description}}} | No description available }}
+   <td rowspan="2" style="width: 60%; text-align: justify; padding: 10px; border-right: 1px dashed #ff9c00; color: #e0e0e0;">{{#if: {{{Description}}} | {{{Description}}} | No description available }}
    </td>
    <td valign="top" align="center" style="padding-top: 0 !important;">
-    <div align="center" style="width: 220px; border: 1px solid #35215f; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #35215f; color: #dadada; font-weight: bold; padding: 5px;">Interactive Map</div>
+    <div align="center" style="width: 220px; border: 1px solid #ff9c00; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;">Interactive Map</div>
    </td>
   </tr>
   <tr>
-   <td  align="center" valign="top" style="padding: 10px;">{{{Map}}}
+   <td align="center" valign="top" style="padding: 10px; background: #2a2a2a;">
+    {{{Map}}}
+    {{#if: {{{Map-2}}} | <br><br>{{{Map-2}}} | }}
    </td>
   </tr>
   <tr>
    <td colspan="3">
-    <table width="100%" style="border-spacing: 0;">
+    <table width="100%" style="border-spacing: 0; background: #222222;">
      <tr>
       <td valign="top" align="center" width="33%" style="padding-top: 15px;">
-       <div align="center" style="width: 120px; border: 1px solid #35215f; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #35215f; color: #dadada; font-weight: bold; padding: 5px;">Metins</div>
+       <div align="center" style="width: 120px; border: 1px solid #ff9c00; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;">Gates</div>
       </td>
       <td valign="top" align="center" width="33%" style="padding-top: 15px;">
-       <div align="center" style="width: 120px; border: 1px solid #35215f; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #35215f; color: #dadada; font-weight: bold; padding: 5px;">Monsters</div>
+       <div align="center" style="width: 120px; border: 1px solid #ff9c00; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;">Monsters</div>
       </td>
       <td valign="top" align="center" style="padding-top: 15px;">
-       <div align="center" style="width: 120px; border: 1px solid #35215f; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #35215f; color: #dadada; font-weight: bold; padding: 5px;">NPC</div>
+       <div align="center" style="width: 120px; border: 1px solid #ff9c00; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;">NPC</div>
       </td>
      </tr>
      <tr>
       <td valign="top" style="padding: 5px;">
-       <div style="padding: 5px; border: 1px dashed #88283a;">{{#if:{{{Metins}}} | {{{Metins}}} | <i>No '''metins''' available on this map</i> }}</div>
+       <div style="padding: 5px; border: 1px dashed #ff9c00; color: #e0e0e0;">{{#if:{{{Gates}}} | {{{Gates}}} | <i>No '''gates''' available on this map</i> }}</div>
       </td>
       <td rowspan="3" valign="top" style="padding: 5px;">
-       <div style="padding: 5px; border: 1px dashed #88283a;">{{#if:{{{Monster}}} | {{{Monster}}} | <i>No '''monsters''' available on this map</i> }}</div>
+       <div style="padding: 5px; border: 1px dashed #ff9c00; color: #e0e0e0;">{{#if:{{{Monster}}} | {{{Monster}}} | <i>No '''monsters''' available on this map</i> }}</div>
       </td>
-      <td rowspan="3"  valign="top" style="padding: 5px;">
+      <td rowspan="3" valign="top" style="padding: 5px;">
-       <div style="padding: 5px; border: 1px dashed #88283a;">{{#if:{{{NPC}}} | {{{NPC}}} | <i>No '''NPC's''' available on this map</i> }}</div>
+       <div style="padding: 5px; border: 1px dashed #ff9c00; color: #e0e0e0;">{{#if:{{{NPC}}} | {{{NPC}}} | <i>No '''NPC's''' available on this map</i> }}</div>
       </td>
      </tr>
+   </table>
+  </td>
+ </tr>
+ <!-- Additional Areas and Features Section -->
+ {{#if: {{{Areas}}} |
+ <tr>
+  <td colspan="3" style="padding: 0 !important;">
+   <table width="100%" style="border-spacing: 0; background: #222222;">
      <tr>
-      <td valign="top" align="center" style="padding-top: 10px;">
+      <td valign="top" align="center" width="33%" style="padding-top: 15px;">
-       <div align="center" style="width: 120px; border: 1px solid #35215f; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #35215f; color: #dadada; font-weight: bold; padding: 5px;">Ore Veins</div>
+      <div align="center" style="width: 120px; border: 1px solid #ff9c00; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;">Areas</div>
+     </td>
+     <td valign="top" align="center" width="33%" style="padding-top: 15px;">
+      <div align="center" style="width: 120px; border: 1px solid #ff9c00; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;">Old Man</div>
+     </td>
+     <td valign="top" align="center" style="padding-top: 15px;">
+       <div align="center" style="width: 120px; border: 1px solid #ff9c00; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow:2px 2px 5px #000000; background: #ff9c00; color: #222222; font-weight: bold; padding: 5px;">Teleporter</div>
       </td>
      </tr>
      <tr>
-      <td valign="top" style="padding: 5px; height: 100%;">
+      <td valign="top" style="padding: 5px;">
-       <div style="padding: 5px; border: 1px dashed #88283a;">{{#if:{{{Ores}}} | {{{Ores}}} | <i>No '''ore veins''' available on this map</i> }}</div>
+      <div style="padding: 5px; border: 1px dashed #ff9c00; color: #e0e0e0;">{{#if:{{{Areas}}} | {{{Areas}}} | <i>No '''areas''' available on this map</i> }}</div>
+     </td>
+     <td valign="top" style="padding: 5px;">
+       <div style="padding: 5px; border: 1px dashed #ff9c00; color: #e0e0e0;">{{#if:{{{Old Man}}} | {{{Old Man}}} | <i>No '''Old Man''' available on this map</i> }}</div>
+     </td>
+     <td valign="top" style="padding: 5px;">
+      <div style="padding: 5px; border: 1px dashed #ff9c00; color: #e0e0e0;">{{#if:{{{Teleporter}}} | {{{Teleporter}}} | <i>No '''teleporter''' available on this map</i> }}</div>
       </td>
      </tr>
@@ Line 62: / Line 86: @@
    </td>
   </tr>
+ | }}
 </table>
+<!-- CSS to style listed items -->
+<includeonly>
+<style type="text/css">
+/* Style list items */
+.mw-parser-output ul li {
+  color: #ff9c00 !important;
+}
+.mw-parser-output ul li a {
+  color: #e0e0e0 !important;
+}
+/* Style boss monsters */
+.mw-parser-output b, .mw-parser-output strong {
+  color: #ff9c00 !important;
+  font-weight: bold;
+}
+</style>
+</includeonly>