Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Join the Playtest on Steam Now: SpiritVale

User:Eviand/TemplateTesting: Difference between revisions

From SpiritVale Wiki
 
(2 intermediate revisions by the same user not shown)
Line 107: Line 107:
| {{#if:{{{SkillImage6|}}}|[[File:{{{SkillImage6}}}|50px]]}}<br />{{{SkillDescription6}}}
| {{#if:{{{SkillImage6|}}}|[[File:{{{SkillImage6}}}|50px]]}}<br />{{{SkillDescription6}}}
|-
|-
! | {{{Skill7}}}
| style="width:16%;" | {{{Skill7}}}
! | {{{Skill8}}}
| style="width:16%;" | {{{Skill8}}}
! | {{{Skill9}}}
| style="width:16%;" | {{{Skill9}}}
! | {{{Skill10}}}
| style="width:16%;" | {{{Skill10}}}
! | {{{Skill11}}}
| style="width:16%;" | {{{Skill11}}}
! | {{{Skill12}}}
| style="width:16%;" | {{{Skill12}}}
|-
|-
| {{#if:{{{SkillImage7|}}}|[[File:{{{SkillImage7}}}|50px]]}}<br />{{{SkillDescription7}}}
| {{#if:{{{SkillImage7|}}}|[[File:{{{SkillImage7}}}|50px]]}}<br />{{{SkillDescription7}}}
Line 121: Line 121:
| {{#if:{{{SkillImage12|}}}|[[File:{{{SkillImage12}}}|50px]]}}<br />{{{SkillDescription12}}}
| {{#if:{{{SkillImage12|}}}|[[File:{{{SkillImage12}}}|50px]]}}<br />{{{SkillDescription12}}}
|-
|-
! | {{{Skill13}}}
| style="width:16%;" | {{{Skill13}}}
! | {{{Skill14}}}
| style="width:16%;" | {{{Skill14}}}
! | {{{Skill15}}}
| style="width:16%;" | {{{Skill15}}}
! | {{{Skill16}}}
| style="width:16%;" | {{{Skill16}}}
! | {{{Skill17}}}
| style="width:16%;" | {{{Skill17}}}
! | {{{Skill18}}}
| style="width:16%;" | {{{Skill18}}}
|-
|-
| {{#if:{{{SkillImage13|}}}|[[File:{{{SkillImage13}}}|50px]]}}<br />{{{SkillDescription13}}}
| {{#if:{{{SkillImage13|}}}|[[File:{{{SkillImage13}}}|50px]]}}<br />{{{SkillDescription13}}}
Line 135: Line 135:
| {{#if:{{{SkillImage18|}}}|[[File:{{{SkillImage18}}}|50px]]}}<br />{{{SkillDescription18}}}
| {{#if:{{{SkillImage18|}}}|[[File:{{{SkillImage18}}}|50px]]}}<br />{{{SkillDescription18}}}
|-
|-
! | {{{Skill19}}}
| style="width:16%;" | {{{Skill19}}}
! | {{{Skill20}}}
| style="width:16%;" | {{{Skill20}}}
! | {{{Skill21}}}
| style="width:16%;" | {{{Skill21}}}
! | {{{Skill22}}}
| style="width:16%;" | {{{Skill22}}}
! | {{{Skill23}}}
| style="width:16%;" | {{{Skill23}}}
! | {{{Skill24}}}
| style="width:16%;" | {{{Skill24}}}
|-
|-
| {{#if:{{{SkillImage19|}}}|[[File:{{{SkillImage19}}}|50px]]}}<br />{{{SkillDescription19}}}
| {{#if:{{{SkillImage19|}}}|[[File:{{{SkillImage19}}}|50px]]}}<br />{{{SkillDescription19}}}
Line 149: Line 149:
| {{#if:{{{SkillImage24|}}}|[[File:{{{SkillImage24}}}|50px]]}}<br />{{{SkillDescription24}}}
| {{#if:{{{SkillImage24|}}}|[[File:{{{SkillImage24}}}|50px]]}}<br />{{{SkillDescription24}}}
|}
|}
|-
|-
! | '''Advanced Classes'''
! | '''Advanced Classes'''
|-
|-
|  
|  
<div style="display:flex; justify-content:space-between; gap:20px;">
<div style="display:flex; gap:20px;">
   <div style="flex:1;">
   <div style="flex:1;">
   {| class="infobox custom-table"
   {| class="infobox custom-table"
Line 180: Line 179:
   </div>
   </div>
</div>
</div>
|-
|-
! | '''Advice & Guides'''
! | '''Advice & Guides'''
Line 187: Line 185:
|}
|}


==Template Box==
== Template Box ==


Had this super fun template idea, but I couldn't get it to work on mobile. Going to shelve it for now as it might be useful for later.
Had this super fun template idea, but I couldn't get it to work on mobile. Going to shelve it for now as it might be useful for later.


<!-- Compact Infobox Template with Shrinking Rows, Equal Height Columns, Word Wrapping, and Mobile-Safe Display -->
{| class="infobox custom-table" style="float:{{{float|right}}}; width:100%; max-width:260px; font-size:95%;"
 
|-
<div style="display:inline-block; width:100%; max-width:260px; margin:0 0 1em 1em; float:{{{float|right}}}; border:2px solid #5a4e7c; background:#f0f2f8; border-radius:12px; box-shadow:0 2px 4px rgba(0,0,0,0.2); font-size:95%; overflow:hidden; box-sizing:border-box;">
! colspan="2" |
 
<!-- Header Section -->
<div style="background:linear-gradient(180deg,#7a6fb0,#5a4e7c); color:white; text-align:center; padding:4px 6px; font-size:110%; border-top-left-radius:10px; border-top-right-radius:10px;">
'''{{{BoxName}}}'''
'''{{{BoxName}}}'''
</div>


<!-- Content Section -->
{{#if:{{{A1|}}}|
<div style="padding:0; display:flex; flex-direction:column;">
|-
 
| style="border-right:1px solid #555; width:{{{Col1Width|35%}}};" | {{{A1}}}
<!-- Row 1 -->
| {{{B1}}}
{{#if: {{{A1|}}} |  
<div style="display:flex; align-items:center; flex-wrap:nowrap;">
<div style="flex:0 0 {{{Col1Width|35%}}}; display:flex; align-items:center; background:#e6e3f0; font-weight:bold; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #f7f7f7;">{{{A1}}}</div>
<div style="flex:1; max-width:48ch; display:flex; align-items:center; background:#ffffff; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #ccc;">{{{B1}}}</div>
</div>
}}
}}


<!-- Row 2 -->
{{#if:{{{A2|}}}|
{{#if: {{{A2|}}} |  
|-
<div style="display:flex; align-items:center; flex-wrap:nowrap;">
| style="border-right:1px solid #555; width:{{{Col1Width|35%}}};" | {{{A2}}}
<div style="flex:0 0 {{{Col1Width|35%}}}; display:flex; align-items:center; background:#e6e3f0; font-weight:bold; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #f7f7f7;">{{{A2}}}</div>
| {{{B2}}}
<div style="flex:1; max-width:48ch; display:flex; align-items:center; background:#ffffff; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #ccc;">{{{B2}}}</div>
</div>
}}
}}


<!-- Row 3 -->
{{#if:{{{A3|}}}|
{{#if: {{{A3|}}} |  
|-
<div style="display:flex; align-items:center; flex-wrap:nowrap;">
| style="border-right:1px solid #555; width:{{{Col1Width|35%}}};" | {{{A3}}}
<div style="flex:0 0 {{{Col1Width|35%}}}; display:flex; align-items:center; background:#e6e3f0; font-weight:bold; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #f7f7f7;">{{{A3}}}</div>
| {{{B3}}}
<div style="flex:1; max-width:48ch; display:flex; align-items:center; background:#ffffff; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #ccc;">{{{B3}}}</div>
</div>
}}
}}


<!-- Row 4 -->
{{#if:{{{A4|}}}|
{{#if: {{{A4|}}} |  
|-
<div style="display:flex; align-items:center; flex-wrap:nowrap;">
| style="border-right:1px solid #555; width:{{{Col1Width|35%}}};" | {{{A4}}}
<div style="flex:0 0 {{{Col1Width|35%}}}; display:flex; align-items:center; background:#e6e3f0; font-weight:bold; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #f7f7f7;">{{{A4}}}</div>
| {{{B4}}}
<div style="flex:1; max-width:48ch; display:flex; align-items:center; background:#ffffff; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #ccc;">{{{B4}}}</div>
</div>
}}
}}


<!-- Row 5 -->
{{#if:{{{A5|}}}|
{{#if: {{{A5|}}} |  
|-
<div style="display:flex; align-items:center; flex-wrap:nowrap;">
| style="border-right:1px solid #555; width:{{{Col1Width|35%}}};" | {{{A5}}}
<div style="flex:0 0 {{{Col1Width|35%}}}; display:flex; align-items:center; background:#e6e3f0; font-weight:bold; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #f7f7f7;">{{{A5}}}</div>
| {{{B5}}}
<div style="flex:1; max-width:48ch; display:flex; align-items:center; background:#ffffff; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #ccc;">{{{B5}}}</div>
</div>
}}
}}


<!-- Row 6 -->
{{#if:{{{A6|}}}|
{{#if: {{{A6|}}} |  
|-
<div style="display:flex; align-items:center; flex-wrap:nowrap;">
| style="border-right:1px solid #555; width:{{{Col1Width|35%}}};" | {{{A6}}}
<div style="flex:0 0 {{{Col1Width|35%}}}; display:flex; align-items:center; background:#e6e3f0; font-weight:bold; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #f7f7f7;">{{{A6}}}</div>
| {{{B6}}}
<div style="flex:1; max-width:48ch; display:flex; align-items:center; background:#ffffff; padding:4px; word-break:break-word; white-space:normal; border-bottom:1px solid #ccc;">{{{B6}}}</div>
</div>
}}
}}


<!-- Row 7 -->
{{#if:{{{A7|}}}|
{{#if: {{{A7|}}} |  
|-
<div style="display:flex; align-items:center; flex-wrap:nowrap;">
| style="border-right:1px solid #555; width:{{{Col1Width|35%}}};" | {{{A7}}}
<div style="flex:0 0 {{{Col1Width|35%}}}; display:flex; align-items:center; background:#e6e3f0; font-weight:bold; padding:4px; word-break:break-word; white-space:normal;">{{{A7}}}</div>
| {{{B7}}}
<div style="flex:1; max-width:48ch; display:flex; align-items:center; background:#ffffff; padding:4px; word-break:break-word; white-space:normal;">{{{B7}}}</div>
</div>
}}
}}
 
|}
</div>
</div>

Latest revision as of 18:15, 20 September 2025

Generic Infobox

edit edit source

Used as a base template for other boxes. Rows must be manually added or removed.

Example Infobox

Player

Character Eviand
Class Acolyte
Role Support

This one is much more appropriate, and feels a lot easier to use. Will be for classes only.

{| class="infobox custom-table"
|-
! colspan="2" |
'''Class Overview'''<br />
|-
| style="border-right:1px solid #555;" | Role
| {{{Role}}}
|-
| style="border-right:1px solid #555;" | Primary Stats
| {{{Stats}}}
|-
| style="border-right:1px solid #555;" | Weapons
| {{{Weapons}}}
|}
 

Fun Class Template Idea

edit edit source

Had fun creating this for testing, but will instead use a simpler template.


{{{Class}}}

{{{ClassDescription}}}
Class Information
Class Information
Role {{{Role}}}
Primary Stats {{{Stats}}}
Weapon Type(s) {{{Weapons}}}
Skills
{{{Skill1}}} {{{Skill2}}} {{{Skill3}}} {{{Skill4}}} {{{Skill5}}} {{{Skill6}}}

{{{SkillDescription1}}}

{{{SkillDescription2}}}

{{{SkillDescription3}}}

{{{SkillDescription4}}}

{{{SkillDescription5}}}

{{{SkillDescription6}}}
{{{Skill7}}} {{{Skill8}}} {{{Skill9}}} {{{Skill10}}} {{{Skill11}}} {{{Skill12}}}

{{{SkillDescription7}}}

{{{SkillDescription8}}}

{{{SkillDescription9}}}

{{{SkillDescription10}}}

{{{SkillDescription11}}}

{{{SkillDescription12}}}
{{{Skill13}}} {{{Skill14}}} {{{Skill15}}} {{{Skill16}}} {{{Skill17}}} {{{Skill18}}}

{{{SkillDescription13}}}

{{{SkillDescription14}}}

{{{SkillDescription15}}}

{{{SkillDescription16}}}

{{{SkillDescription17}}}

{{{SkillDescription18}}}
{{{Skill19}}} {{{Skill20}}} {{{Skill21}}} {{{Skill22}}} {{{Skill23}}} {{{Skill24}}}

{{{SkillDescription19}}}

{{{SkillDescription20}}}

{{{SkillDescription21}}}

{{{SkillDescription22}}}

{{{SkillDescription23}}}

{{{SkillDescription24}}}
Advanced Classes
{{{AdvancedClass1}}}
[[File:{{{AdvancedClassImage1}}}|100px]]
Role {{{AdvancedClassRole1}}}
Description {{{AdvancedClassDescription1}}}
{{{AdvancedClass2}}}
[[File:{{{AdvancedClassImage2}}}|100px]]
Role {{{AdvancedClassRole2}}}
Description {{{AdvancedClassDescription2}}}
Advice & Guides

Had this super fun template idea, but I couldn't get it to work on mobile. Going to shelve it for now as it might be useful for later.

{{{BoxName}}}

-

-

-

-

-

-

-