Template:CharacterSheet: Difference between revisions

From Mutant Year Zero
No edit summary
Tag: Reverted
(Undo revision 79 by Xavier (talk))
Tag: Undo
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
<includeonly>
[[Category:Player Characters]]
<center><div class="container">
<div class="column">   
   
<!-- ATTRIBUTES--> 
<div class="attributes"> 
      {|class="rpgtable"
! colspan="4" | ATTRIBUTES
|-
| Strength
| {{{Strength|0}}}
| Damage
| ◯ ◯ ◯ ◯ ◯
|-
| Agility
| {{{Agility|0}}}
| Fatigue
| ◯ ◯ ◯ ◯ ◯
|-
| Wits
| {{{Wits|0}}}
| Confusion
| ◯ ◯ ◯ ◯ ◯
|-
| Empathy
| {{{Empathy|0}}}
| Doubt
| ◯ ◯ ◯ ◯ ◯
|} 
</div>


/* Get nice font! */
<!-- SKILLS--
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@500&display=swap');
<div class="conditions">
 
{| class="rpgtable"
:root {
! colspan="4" | CONDITIONS
  --font-family__header--campaign: 'Chakra Petch', sans-serif;
|-
}
| Starving
 
| ◯
/* Wood background */
| Dehydrated
body, .mw-page-container {
| ◯
    background: url("https://rpg.sandcat.nl/.sws/themes/wood-responsive//img/wood.jpg") repeat scroll 0 0 #ab8b4e;
|-
}
| Sleepless
 
| ◯
/* Paper background for relevant modules */
| Hypothermic
.vector-main-menu, .vector-toc, mw-body, .mw-content-container, .vector-user-links, .vector-sticky-header {
| ◯
  background: url("https://rpg.sandcat.nl/.sws/themes/wood-responsive//img/paper.jpg") repeat scroll 0 0 #ab8b4e; 
|-
}
| colspan="4" | Critical injuries:
 
|-
 
| colspan="4" | &nbsp;
/* Improve some paddings */
|-
.vector-user-links {
| colspan="4" | &nbsp;
  padding: 5px 10px 5px 10px;
|}
}
</div>
.mw-content-container {
    
  padding-left:10px;
<!-- SKILLS--
  padding-right:10px;
<div class="skills"> 
  min-width:900px;
      {| class="rpgtable"
}
! colspan="3" | SKILLS
 
|-
/* Logo */
| Endure (Strength)
.mw-logo-icon {
| {{{Strength|&nbsp;}}}
  width:100px;
    | {{#if: {{{Endure}}} | | class="empty"}} | {{{Endure|&nbsp;}}}  
  height:100px;
}
.mw-logo-container {
  color: #9a2e00;
  font-size: 50px;
  font-family: var(--font-family__header--campaign, var(--font-family__header));
  background-image: url(https://rpg.sandcat.nl/myz2024/images/MYZ_logo.png);
   background-size: contain;
  background-repeat: no-repeat;
  width:300px;
  height:100px;
  max-width:300px;
}
.mw-logo-container .mw-logo-wordmark {
  display:none;
}
/* Else the MYZ logo becomes small*/
@media screen and (min-width: 1200px) {
    .vector-feature-page-tools-enabled .mw-header {
        display: grid;
        column-gap: 36px;
        grid-template: auto / 30em minmax(0,1fr);
        grid-template-areas: 'headerStart headerEnd'
    }
}
 
.vector-sticky-header {
  border-bottom: 1px solid black;
}
 
 
/* Footer */
.mw-footer-container li {
  color:#ccc;
}


/* Page title + h1 color/font*/
|-
.mw-page-title-main, h1 {
| Force (Strength)
  color: #9a2e00;
| {{{Strength|&nbsp;}}}
  font-family: var(--font-family__header--campaign, var(--font-family__header));
    | {{#if: {{{Force}}} | | class="empty"}} | {{{Force|&nbsp;}}}  
}


/* Links color*/
|-
a, .vector-pinnable-header-toggle-button {
| Fight (Strength)
    color: #9a2e00 !important;
| {{{Strength|&nbsp;}}}
    text-decoration: none;
    | {{#if: {{{Fight}}} | | class="empty"}} | {{{Fight|&nbsp;}}}
}
|-
a:visited {
| Sneak (Agility)
    color: #742d0f !important;
| {{{Agility|&nbsp;}}}
}
    | {{#if: {{{Sneak}}} | | class="empty"}} | {{{Sneak|&nbsp;}}}
|-
| Move (Agility)
| {{{Agility|&nbsp;}}}
    | {{#if: {{{Move}}} | | class="empty"}} | {{{Move|&nbsp;}}}
    |-
| Shoot (Agility)
| {{{Agility|&nbsp;}}}
    | {{#if: {{{Shoot}}} | | class="empty"}} | {{{Shoot|&nbsp;}}}
|-
| Scout (Wits)
| {{{Wits|&nbsp;}}}
    | {{#if: {{{Scout}}} | | class="empty"}} | {{{Scout|&nbsp;}}}
|-
| Comprehend (Wits)
| {{{Wits|&nbsp;}}}
    | {{#if: {{{Comprehend}}} | | class="empty"}} | {{{Comprehend|&nbsp;}}}
|-
| Know The Zone (Wits)
| {{{Wits|&nbsp;}}}
    | {{#if: {{{KnowTheZone}}} | | class="empty"}} | {{{KnowTheZone|&nbsp;}}}
|-
| Sense Emotion (Empathy)
| {{{Empathy|&nbsp;}}}
    | {{#if: {{{SenseEmotion}}} | | class="empty"}} | {{{SenseEmotion|&nbsp;}}}
|-
| Manipulate (Empathy)
| {{{Empathy|&nbsp;}}}
    | {{#if: {{{Manipulate}}} | | class="empty"}} | {{{Manipulate|&nbsp;}}}
|-
| Heal (Empathy)
| {{{Empathy|&nbsp;}}}
    | {{#if: {{{Heal}}} | | class="empty"}} | {{{Heal|&nbsp;}}}
|-
| {{#if: {{{SpecialistSkill1|}}} | [[{{{SpecialistSkill1|}}}]] | &nbsp;}} {{#if: {{{SpecialistSkill1|}}} | ({{{SpecialistSkill1Attr}}})|}}
    | {{#if: {{{SpecialistSkill1Level}}} | | class="empty"}} | {{{{{{SpecialistSkill1Attr|&nbsp;}}}|&nbsp;}}}
    | {{#if: {{{SpecialistSkill1Level}}} | | class="empty"}} | {{{SpecialistSkill1Level|&nbsp;}}}
|-
| {{#if: {{{SpecialistSkill2|}}} | [[{{{SpecialistSkill2|}}}]] | &nbsp;}} {{#if: {{{SpecialistSkill2|}}} | ({{{SpecialistSkill2Attr}}})|}}
    | {{#if: {{{SpecialistSkill2Level}}} | | class="empty"}} | {{{{{{SpecialistSkill2Attr|&nbsp;}}}|&nbsp;}}}
    | {{#if: {{{SpecialistSkill2Level}}} | | class="empty"}} | {{{SpecialistSkill2Level|&nbsp;}}}
|-
| {{#if: {{{SpecialistSkill3|}}} | [[{{{SpecialistSkill3|}}}]] | &nbsp;}} {{#if: {{{SpecialistSkill3|}}} | ({{{SpecialistSkill3Attr}}})|}}
    | {{#if: {{{SpecialistSkill3Level}}} | | class="empty"}} | {{{{{{SpecialistSkill3Attr|&nbsp;}}}|&nbsp;}}}
    | {{#if: {{{SpecialistSkill3Level}}} | | class="empty"}} | {{{SpecialistSkill3Level|&nbsp;}}}
|-
| {{#if: {{{SpecialistSkill4|}}} | [[{{{SpecialistSkill4|}}}]] | &nbsp;}} {{#if: {{{SpecialistSkill4|}}} | ({{{SpecialistSkill4Attr}}})|}}
    | {{#if: {{{SpecialistSkill4Level}}} | | class="empty"}} | {{{{{{SpecialistSkill4Attr|&nbsp;}}}|&nbsp;}}}
    | {{#if: {{{SpecialistSkill4Level}}} | | class="empty"}} | {{{SpecialistSkill4Level|&nbsp;}}}
|}
    </div>
   
<!-- ROT--> 
<div class="rot">
{| class="rpgtable"
! colspan="7" | ROT POINTS
|-
    | ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp;
|}


html, body, button, input, select, textarea {
{| class="rpgtable"
    font-family: Verdana, Geneva, sans-serif;
! EXPERIENCE POINTS
}
|-
| ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp;
|}


/* Character Sheet */
{| class="rpgtable dice"
.charactersheet {
! colspan="8" |DICE RESULTS
  color:red;
|-
}
| 1
    | Mutant
| 1
    | Break
| 6
| 6
| 6
    | Succes
|}
</div>
</div>
<div class="column">


<!-- PERSONAL -->
<div class="personal">
{|class="rpgtable"
! colspan="2" | PERSONAL
|-
| Player
| {{{Player}}}
|-
    | Name
| {{{Name}}}
|-
| Role
| {{{Role}}}
|-
| Face
| {{{AppearanceFace1}}}
      {{{AppearanceFace2}}}
|-
| Body
| {{{AppearanceBody1}}}
      {{{AppearanceBody2}}}
|-
| Clothing
| {{{AppearanceClothing1}}}
      {{{AppearanceClothing2}}}
    |}
</div>


.rpgtable {
<!-- GEAR -->
  background-color: #fff;
<div class="gear">
  color: #202122;
{| class="rpgtable"
  margin: 1em 0;
! colspan="2" | GEAR
  border: 1px solid #999;
|-
  border-collapse: collapse;
| 1
  width:100%;
        | {{{Gear1|&nbsp;}}}
}
|-
| 2
        | {{{Gear2|&nbsp;}}}
|-
| 3
        | {{{Gear3|&nbsp;}}}
|-
| 4
        | {{{Gear4|&nbsp;}}}
|-
| 5
        | {{{Gear5|&nbsp;}}}
|-
| 6
        | {{{Gear6|&nbsp;}}}
|-
| 7
        | {{{Gear7|&nbsp;}}}
|-
| 8
        | {{{Gear8|&nbsp;}}}
|-
| 9
        | {{{Gear9|&nbsp;}}}
|-
| 10
        | {{{Gear10|&nbsp;}}}
|-
| colspan="2" | Bullets: {{{Bullets|0}}}
|}
</div>


.rpgtable > tr > th,.rpgtable > tr > td,.rpgtable > * > tr > th,.rpgtable > * > tr > td {
<!-- WEAPONS-->
  border: 1px solid #999;
<div class="weapons">
  padding: 1px 4px;
{| class="rpgtable"
}
! WEAPONS
! Bon.
! Dmg
! Range
|-
| {{{Weapon1|&nbsp;}}} &nbsp;
    | {{#if: {{{Weapon1Bonus}}} | | class="empty"}} | {{{Weapon1Bonus|&nbsp;}}}
| {{{Weapon1Damage|&nbsp;}}}
| {{{Weapon1Range|&nbsp;}}}
|-
| colspan="4" | {{{Weapon1Special|&nbsp;}}} &nbsp;
|-
| {{{Weapon2|&nbsp;}}} &nbsp;
    | {{#if: {{{Weapon2Bonus}}} | | class="empty"}} | {{{Weapon2Bonus|&nbsp;}}}
| {{{Weapon2Damage|&nbsp;}}}
| {{{Weapon2Range|&nbsp;}}}
|-
| colspan="4" | {{{Weapon2Special|&nbsp;}}} &nbsp;
|-
| {{{Weapon3|&nbsp;}}} &nbsp;
    | {{#if: {{{Weapon3Bonus}}} | | class="empty"}} | {{{Weapon3Bonus|&nbsp;}}}
| {{{Weapon3Damage|&nbsp;}}}
| {{{Weapon3Range|&nbsp;}}}
|-
| colspan="4" | {{{Weapon3Special|&nbsp;}}} &nbsp;
|}
</div>


.rpgtable > tr > th,.rpgtable > * > tr > th {
<!-- RELATIONS -->
  background-color: #ccc;
<div class="relations">
  text-align: left;
{| class="rpgtable"
}
! colspan="2" | RELATIONSHIPS
! Buddy
|-
| {{#if: {{{Buddy|}}} | [[{{{Buddy}}}]]}}
    | {{{BuddyRelation|&nbsp;}}}
| Yes
|-
| {{#if: {{{PC2|}}} | [[{{{PC2}}}]]}}
    | {{{PC2Relation|&nbsp;}}}
| No
|-
| {{#if: {{{PC3|}}} | [[{{{PC3}}}]]}}
    | {{{PC3Relation|&nbsp;}}}
| No
|-
| {{#if: {{{PC4|}}} | [[{{{PC4}}}]]}}
    | {{{PC4Relation|&nbsp;}}}
| No
|-
| {{#if: {{{PC5|}}} | [[{{{PC5}}}]]}}
    | {{{PC5Relation|&nbsp;}}}
| No
    |-
| colspan="3" | I hate: {{#if: {{{Hate|}}} | [[{{{Hate|}}}]] | &nbsp; }} {{{HateRelation|}}}
|-
| colspan="3" | I need to protect: {{#if: {{{Protect|}}} | [[{{{Protect|}}}]] | &nbsp; }} {{{ProtectRelation|}}}
|-
| colspan="3" | My big dream: {{{Dream|&nbsp;}}}
|}
</div>
</div>
<div class="column">


.rpgtable > caption {
<!-- IMAGE -->
  font-weight: bold;
<div class="image">
}
{| class="rpgtable" style="width:100%;"
! APPEARANCE
|-
| [[File:{{{Image}}}|290px]]
|}
</div>


.rpgtable th, .rpgtable td {
<!-- TALENTS -->
  text-align: left;
<div class="talents">
  white-space: nowrap;
{| class="rpgtable" style="width:100%;"
}
! TALENTS
|-
| {{#if: {{{Talent1|}}} | [[{{{Talent1}}}]] | &nbsp; }}
|-
| {{#if: {{{Talent2|}}} | [[{{{Talent2}}}]] | &nbsp; }}
|-
| {{#if: {{{Talent3|}}} | [[{{{Talent3}}}]] | &nbsp; }}
|-
| {{#if: {{{Talent4|}}} | [[{{{Talent4}}}]] | &nbsp; }}
|-
| {{#if: {{{Talent5|}}} | [[{{{Talent5}}}]] | &nbsp; }}
|-
| {{#if: {{{Talent6|}}} | [[{{{Talent6}}}]] | &nbsp; }}
|-
| {{#if: {{{Talent7|}}} | [[{{{Talent7}}}]] | &nbsp; }}
|-
| {{#if: {{{Talent8|}}} | [[{{{Talent8}}}]] | &nbsp; }}
|}
</div>


.rpgtable td {
<!-- MUTATIONS-->
  height:24px;
<div class="mutations">
}
{| class="rpgtable"
 
! MUTATIONS
.attributes .rpgtable td:nth-child(2) {
|-
  font-weight: bold;
| {{#if: {{{Mutation1|}}} | [[{{{Mutation1}}}]] | &nbsp; }}
  background-color: #ffffba;
|-
  width: 24px;
| {{#if: {{{Mutation2|}}} | [[{{{Mutation2}}}]] | &nbsp; }}
  text-align: center;
|-
  font-size:120%;
| {{#if: {{{Mutation3|}}} | [[{{{Mutation3}}}]] | &nbsp; }}
}
|-
.attributes .rpgtable td:nth-child(3) {
| {{#if: {{{Mutation4|}}} | [[{{{Mutation4}}}]] | &nbsp; }}
  font-size: 90%;
|}
  border-right:none;
</div>
}
<div class="mutationpoints">
.attributes .rpgtable td:nth-child(4) {
     {| class="rpgtable"
  border-left:none;
! MUTATION POINTS
  text-align: center;
|-
}
| ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp; ◯ &nbsp;
.conditions .rpgtable td:nth-child(1), .conditions .rpgtable td:nth-child(3) {
|}
  border-right:none;
</div>
}
.conditions .rpgtable td:nth-child(2), .conditions .rpgtable td:nth-child(4) {
  border-left:none;
}
.conditions .rpgtable tr:nth-child(4) {
  font-size: 90%;
}
.rot .rpgtable td, .mutationpoints .rpgtable td  {
  text-align: center;
}
 
.rot .rpgtable.dice td:nth-child(1) {
  background-color: #ffffba;
  width: 24px;
}
.rot .rpgtable.dice td:nth-child(3) {
  background-color: #666;
  color:#fff;
  width: 24px;
}
.rot .rpgtable.dice td:nth-child(5) {
  background-color: #ffffba;
  width: 24px;
}
.rot .rpgtable.dice td:nth-child(6) {
  background-color: #baffc9;
  width: 24px;
}
.rot .rpgtable.dice td:nth-child(7) {
  background-color: #666;
  width: 24px;
  color:#fff;
}
.rot .rpgtable.dice td:nth-child(2), .rot .rpgtable.dice td:nth-child(4), .rot .rpgtable.dice td:nth-child(8) {
  font-size:80%;
}
 
.skills .rpgtable td:nth-child(2) {
  background-color: #ffffba;
  width: 24px;
  text-align: center; 
  font-size:90%;
}
 
.skills .rpgtable td:nth-child(3) {
  font-weight: bold;
  background-color: #baffc9;
  width: 24px;
  text-align: center; 
  font-size:120%; 
}
.skills .rpgtable td.empty {
  background-color: transparent;
}
.personal .rpgtable td:nth-child(1) {
  font-size: 90%;
}
.gear .rpgtable td:nth-child(1) {
  font-size: 70%;
  width:10px;
  border-right:none;
}
.gear .rpgtable td:nth-child(2) {
  border-left:none;
}
.gear .rpgtable tr:nth-child(12) {
  font-size:120%;
}
.image .rpgtable td {
  height:209px;
  padding:0px;
}
.weapons .rpgtable tr:nth-child(3), .weapons .rpgtable tr:nth-child(5), .weapons .rpgtable tr:nth-child(7) {
  font-size: 80%;
}
.weapons .rpgtable th:nth-child(2), .weapons .rpgtable th:nth-child(3), .weapons .rpgtable th:nth-child(4) {
  font-size: 80%;
  text-align:center;
}
.weapons .rpgtable td:nth-child(2), .weapons .rpgtable td:nth-child(3), .weapons .rpgtable td:nth-child(4) {
  text-align: center;
}
.weapons .rpgtable td:nth-child(2) {
  font-weight:bold;
  background-color: #666;
  color:#fff;
  width: 24px;
}
.weapons .rpgtable td:nth-child(3) {
  width: 24px;
}
.weapons .rpgtable td:nth-child(2), .weapons .rpgtable td:nth-child(3) {
  font-size: 120%;
}
.weapons .rpgtable td:nth-child(4) {
  font-size: 80%;
}
.weapons .rpgtable td.empty {
  background-color: transparent;
}
 
.armor .rpgtable th:nth-child(2) {
  font-size: 80%;
  text-align:center;
}
.armor .rpgtable td:nth-child(2) {
  width:40px;
}
.relations .rpgtable th:nth-child(2), .relations .rpgtable td:nth-child(3) {
  font-size: 80%;
  text-align:center;
}
.relations .rpgtable td:nth-child(1), .relations .rpgtable td:nth-child(2) {
  font-size: 80%;
}
.relations .rpgtable td {
  white-space: normal;
}
.den .rpgtable td {
  font-size: 80%;
  white-space: normal;
}
 
.image td {
  background-color: #000;
}
 
.container {
  display: grid;
  grid-template-columns: 32.5% 32.5% 32.5%;
  column-gap: 10px;
  row-gap: 10px;
  font-family: var(--font-family__header--campaign, var(--font-family__header)) !important;
  width:900px;
}
 
.container th {
  font-size:16px;
  vertical-align:middle;
}
 
.container .column div {
  margin-bottom:10px;
}
 
.container .table {
  width:100%;
  border:1px solid black;
}
 
.background {  
  page-break-before: always;
  font-size:90%;
}
 
@media print
{  
  body, .mw-page-container {
    background: none;
  }
  .vector-main-menu, .vector-toc, mw-body, .mw-content-container, .vector-user-links, .vector-sticky-header {
    background: none;
  }
  /* .mw-body-header,  */
  .mw-header, .vector-main-menu-container, .vector-sitenotice-container, .mw-panel-toc, .vector-page-toolbar, .vector-column-end {
     height:0px;
    display:none;
  }
  body {
  font-size:80%;
  }
  a {
  text-decoration:none !important;
  }
 
  a, .vector-pinnable-header-toggle-button {
    color: #000 !important;
    text-decoration: none !important;
  }
  a:visited {
    color: #000 !important;
text-decoration: none !important;
  }


  div.portrait {
<!-- ARMOR-->
    -webkit-print-color-adjust: exact;  
<div class="armor">
  }
{| class="rpgtable"
! ARMOR
! Rating
|-
| {{{Armor|&nbsp;}}} &nbsp;
        | {{{ArmorRating|&nbsp;}}} &nbsp;
|}
</div>


  a[href]:after {
<div class="den">
    content: none !important;
{| class="rpgtable"
  }
! MY DEN
  .container .rpgtable td {
|-
  font-family: var(--font-family__header--campaign, var(--font-family__header)) !important;
| Description: {{{DenDescription1|&nbsp;}}}
  }  
|-
}
| {{{DenDescription2|&nbsp;}}} &nbsp;
|-
| Gear Stashed: {{{DenGear1|&nbsp;}}}
|-
| {{{DenGear2|&nbsp;}}} &nbsp;
|-
|  {{{DenGear3|&nbsp;}}} &nbsp;
|-
| {{{DenGear4|&nbsp;}}} &nbsp;
|-
| {{{DenGear5|&nbsp;}}} &nbsp;
|}
</div>
</div>
</div>
</center>
<div class="background">
<h3>Background</h3>
{{{Background}}}
</includeonly>

Revision as of 12:17, 3 December 2023