RC-31 | Armour | Table Setup
This commit is contained in:
parent
56fe115407
commit
3ba588a3c1
3 changed files with 102 additions and 2 deletions
|
|
@ -34,6 +34,7 @@
|
||||||
"singular": "Weapon",
|
"singular": "Weapon",
|
||||||
"plural": "Weapons"
|
"plural": "Weapons"
|
||||||
},
|
},
|
||||||
|
"armour": "Armour",
|
||||||
"wear": "Wear",
|
"wear": "Wear",
|
||||||
"damage": "Damage",
|
"damage": "Damage",
|
||||||
"guts": "Guts",
|
"guts": "Guts",
|
||||||
|
|
@ -46,7 +47,14 @@
|
||||||
"gold": "Gold",
|
"gold": "Gold",
|
||||||
"silver": "Silver",
|
"silver": "Silver",
|
||||||
"copper": "Copper"
|
"copper": "Copper"
|
||||||
}
|
},
|
||||||
|
"anatomy": {
|
||||||
|
"head": "Head",
|
||||||
|
"body": "Body",
|
||||||
|
"arms": "Arms",
|
||||||
|
"legs": "Legs"
|
||||||
|
},
|
||||||
|
"shield": "Shield"
|
||||||
},
|
},
|
||||||
"setting": {
|
"setting": {
|
||||||
"abbrAccess": {
|
"abbrAccess": {
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,49 @@
|
||||||
>
|
>
|
||||||
|
|
||||||
{{!-- * Armour --}}
|
{{!-- * Armour --}}
|
||||||
<div class="armour"></div>
|
<div class="armour">
|
||||||
|
<div class="section-header label row-alt">
|
||||||
|
{{ rc-i18n "RipCrypt.common.armour" }}
|
||||||
|
</div>
|
||||||
|
<div class="person">
|
||||||
|
<div class="head">
|
||||||
|
<div class="compass small">0</div>
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.head" }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="compass small">0</div>
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.body" }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="arms">
|
||||||
|
<div class="compass small">0</div>
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.arms" }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="legs">
|
||||||
|
<div class="compass small">0</div>
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.legs" }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="shield">
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.shield" }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<ul class="armour-items">
|
||||||
|
<li class="row-alt">
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.head" }}</span>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.body" }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="row-alt">
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.arms" }}</span>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.anatomy.legs" }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="row-alt">
|
||||||
|
<span class="label">{{ rc-i18n "RipCrypt.common.shield" }}</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
{{!-- * Fate & Advancement --}}
|
{{!-- * Fate & Advancement --}}
|
||||||
<div class="fate">
|
<div class="fate">
|
||||||
|
|
|
||||||
|
|
@ -153,6 +153,11 @@
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.small {
|
||||||
|
--size: 30px;
|
||||||
|
font-size: 1.15rem;
|
||||||
|
}
|
||||||
|
|
||||||
&.dual {
|
&.dual {
|
||||||
font-size: var(--font-size-14);
|
font-size: var(--font-size-14);
|
||||||
--distance-from-edge: 4px;
|
--distance-from-edge: 4px;
|
||||||
|
|
@ -185,4 +190,49 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.armour {
|
||||||
|
grid-column: -2 / span 1;
|
||||||
|
grid-row: 1 / -1;
|
||||||
|
display: grid;
|
||||||
|
grid-template-rows: subgrid;
|
||||||
|
|
||||||
|
.section-header {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.person {
|
||||||
|
grid-row: 2 / span 9;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
grid-template-rows: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr);
|
||||||
|
justify-items: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
> div {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Positioning */
|
||||||
|
.head, .body, .legs { grid-column: 1; }
|
||||||
|
.arms, .shield { grid-column: 2; }
|
||||||
|
.head { grid-row: 1; }
|
||||||
|
.body, .arms { grid-row: 2; }
|
||||||
|
.legs, .shield { grid-row: 3; }
|
||||||
|
.shield { align-self: end; }
|
||||||
|
|
||||||
|
.armour-items {
|
||||||
|
display: contents;
|
||||||
|
|
||||||
|
> li {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row-reverse;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue