Template:Infobox character: Difference between revisions

← Older edit

Template:Infobox character (view source)

Revision as of 16:17, 14 October 2023

2,032 bytes added , 14 October 2023

no edit summary

VisualWikitext

Cleo

Bureaucrats, contributors, Interface administrators, Administrators, uploadaccess

621

edits

@@ Line 1: / Line 1: @@
-<div class="infobox-wrapper">
+<div class="container">
+<div class="toc-container">__TOC__</div>
+<div class="infobox-wrapper box-style">
    <div class="content">
-     <!-- Bio Introduction and List of Contents go here -->
+     <div class="bio-info">
+      <h2>Bio - Information</h2>
+      {{{bio|<p>Character Description Here</p>}}}
+    </div>
+    <div class="blessings top-dot">
+      <h2>{{{blessings|}}} Blessings</h2>
+      <div style="display: flex; flex-wrap: wrap; justify-content: center">
+        <div style="margin: 0 10px">
+          [[File:{{{blessing 1|Empty Blessing}}}_1r.png|center|80x80px|link={{{blessing 1|}}}]]{{#if: {{{blessing 1|}}}|[[{{{blessing 1|}}}]]|}}
+        </div>
+        <div style="margin: 0 10px">
+          [[File:{{{blessing 2|Empty Blessing}}}_1r.png|center|80x80px|link={{{blessing 2|}}}]]{{#if: {{{blessing 2|}}}|[[{{{blessing 2|}}}]]|}}
+        </div>
+        <div style="margin: 0 10px">
+          [[File:{{{blessing 3|Empty Blessing}}}_1r.png|center|80x80px|link={{{blessing 3|}}}]]{{#if: {{{blessing 3|}}}|[[{{{blessing 3|}}}]]|}}
+        </div>
+        <div style="margin: 0 10px">
+          [[File:{{{blessing 4|Empty Blessing}}}_1r.png|center|80x80px|link={{{blessing 4|}}}]]{{#if: {{{blessing 4|}}}|[[{{{blessing 4|}}}]]|}}
+        </div>
+      </div>
+    </div>
    </div>
-   <div class="infobox">
+   <div>
-     <div class="name-box">
+     <div class="char-info">
-       <h2 style="text-align: center;">{{{name|}}}</h2>
+       <h2>{{{name|Name}}}</h2>
+      <div class="charWithType">
+        [[File:{{{name|}}}_1r.png|center|150x150px|link={{{name|}}}]]
+        {{#if: {{{type|}}}|[[File:{{{type|}}}.png|center|40x40px|class=type|link={{{name|}}}]]|}}
+        {{#if: {{{rarity|}}}|[[File:{{{rarity|}}}.png|center|40x40px|class=rarity|link={{{name|}}}]]|}}
+      </div>
+      <p>
+        <hr />
+        <u>'''Title:'''</u><br />{{{title|}}}<hr />
+        <u>'''Race:'''</u><br />{{{race|}}}<hr />
+        {{#if: {{{occupation|}}}|<u>'''Occupation:'''</u><br />{{{occupation|}}}<hr />|}}
+      </p>
      </div>
-    '''Age:''' {{{age|}}}<br/>
-    '''Gender:''' {{{gender|}}}<br/>
-    '''Species:''' {{{species|}}}<br/>
-    '''Residence:''' {{{residence|}}}<br/>
-    '''Relatives:''' {{{relatives|}}}<br/>
-    '''Status:''' {{{status|}}}<br/>
-    '''Game Stats:''' {{{gamestats|}}}
-    '''Bio Info:''' {{{bioinfo|}}}
    </div>
 </div>
-<div class="categories">
-  {{#if: {{{gamestats|}}} | [[Category:Pages with Game Stats]] }}
-  {{#if: {{{bioinfo|}}} | [[Category:Pages with Bio Info]] }}
 </div>
-In this modified template:
+<noinclude>
+<templatedata>
-The infobox-wrapper class is used to create a container for both the content and the infobox.
+{
+	"params": {
-The content class represents the left side of the screen, where you can place your Bio Introduction and List of Contents.
+		"bio": {
+			"label": "Bio",
-The infobox class contains the infobox content, including the centered "Name" section and the other fields.
+			"description": "The bio for this character.",
+			"type": "string",
-With this structure, the infobox will appear on the right side of the screen, and the left side will remain open for your bio introduction and list of contents. You can adjust the width and positioning of the infobox and content areas by using CSS. Here's a basic example of how you might use CSS to position the infobox on the right:
+			"required": true
+		},
-css
+		"blessings": {
-Copy code
+			"label": "Blessing (Optional)",
-/* Style the infobox wrapper */
+			"description": "Word which shows before the \"Blessings\" text below the bio.",
-.infobox-wrapper {
+			"example": "Family/Fellow",
-  display: flex;
+			"type": "string",
-  justify-content: flex-end; /* Position infobox to the right */
+			"suggestedvalues": [
-  align-items: flex-start;
+				"Family",
-}
+				"Fellow"
+			]
-/* Style the content on the left */
+		},
-.content {
+		"blessing 1": {
-  flex: 1; /* Takes up remaining space on the left */
+			"label": "Blessing 1 (Optional)",
-  padding: 10px; /* Add padding as needed */
+			"description": "The first blessings character name.",
-}
+			"example": "Sadako",
+			"type": "string"
-/* Style the infobox on the right */
+		},
-.infobox {
+		"blessing 2": {
-  width: 300px; /* Adjust the width as needed */
+			"label": "Blessing 2 (Optional)",
-  padding: 10px; /* Add padding as needed */
+			"description": "The second blessings character name.",
-}
+			"example": "Lina",
+			"type": "string"
-/* Style the name-box (centered "Name" section) */
+		},
-.name-box {
+		"blessing 3": {
-  text-align: center;
+			"label": "Blessing 3 (Optional)",
+			"description": "The third blessings character name.",
+			"type": "string"
+		},
+		"blessing 4": {
+			"label": "Blessing 4 (Optional)",
+			"description": "The fourth blessings character name.",
+			"type": "string"
+		},
+		"name": {
+			"label": "Name",
+			"description": "The name of the character, this is used in the label / image url.",
+			"example": "Jewlry",
+			"type": "string",
+			"required": true
+		},
+		"type": {
+			"label": "Type (Optional) [Fellows Only]",
+			"description": "The characters type.",
+			"example": "Diligent",
+			"type": "string",
+			"suggestedvalues": [
+				"Diligent",
+				"Informed",
+				"Inspiring",
+				"Brave",
+				"Unfettered"
+			]
+		},
+		"rarity": {
+			"label": "Rarity",
+			"description": "The characters rarity.",
+			"example": "UR/SSR/SR/R/N",
+			"type": "string",
+			"suggestedvalues": [
+				"UR",
+				"SSR",
+				"SR",
+				"R",
+				"N"
+			],
+			"required": true
+		},
+		"title": {
+			"label": "Title",
+			"description": "The characters title.",
+			"type": "string",
+			"required": true
+		},
+		"race": {
+			"label": "Race",
+			"description": "The characters race.",
+			"type": "string",
+			"required": true
+		},
+		"occupation": {
+			"label": "Occupation (Optional) [Fellows Only]",
+			"description": "The characters occupation.",
+			"type": "string"
+		}
+	},
+	"description": "Info box for characters",
+	"paramOrder": [
+		"name",
+		"title",
+		"race",
+		"occupation",
+		"bio",
+		"type",
+		"rarity",
+		"blessings",
+		"blessing 1",
+		"blessing 2",
+		"blessing 3",
+		"blessing 4"
+	]
 }
-These CSS rules create a flexible layout where the infobox is positioned to the right, leaving the left side open for your content. Adjust the width and padding values to suit your design preferences.
+</templatedata>
+</noinclude>