RC-57 | Gear | Setup

This commit is contained in:
Oliver-Akins 2025-01-02 00:09:06 -07:00
parent ff47b97cb9
commit 40ec3b125b
4 changed files with 79 additions and 20 deletions

View file

@ -1,42 +1,61 @@
<div class="HeroSkillsCardV1"> <div class="HeroSkillsCardV1">
<div class="label col-header skill-list-header gait-skills-header"> <div class="label col-header list-header gait-skills-header">
<span>Grit Skills</span> <span>{{ rc-i18n "RipCrypt.Apps.grit-skills" }}</span>
<span class="small">Rank</span> <span class="small">{{ rc-i18n "RipCrypt.common.rank" }}</span>
</div> </div>
<ol class="skill-list even grit-skills"> <ol class="num-before skill-list even grit-skills">
<li></li> <li></li>
<li></li> <li></li>
<li></li> <li></li>
<li></li> <li></li>
</ol> </ol>
<div class="label col-header skill-list-header gait-skills-header"> <div class="label col-header list-header gait-skills-header">
<span>Gait Skills</span> <span>{{ rc-i18n "RipCrypt.Apps.gait-skills" }}</span>
<span class="small">Rank</span> <span class="small">{{ rc-i18n "RipCrypt.common.rank" }}</span>
</div> </div>
<ol class="skill-list even gait-skills"> <ol class="num-before skill-list even gait-skills">
<li></li> <li></li>
<li></li> <li></li>
<li></li> <li></li>
<li></li> <li></li>
</ol> </ol>
<div class="label col-header skill-list-header grip-skills-header"> <div class="label col-header list-header grip-skills-header">
<span>Grip Skills</span> <span>{{ rc-i18n "RipCrypt.Apps.grip-skills" }}</span>
<span class="small">Rank</span> <span class="small">{{ rc-i18n "RipCrypt.common.rank" }}</span>
</div> </div>
<ol class="skill-list odd grip-skills"> <ol class="num-before skill-list odd grip-skills">
<li></li> <li></li>
<li></li> <li></li>
<li></li> <li></li>
<li></li> <li></li>
</ol> </ol>
<div class="label col-header skill-list-header glim-skills-header"> <div class="label col-header list-header glim-skills-header">
<span>Glim Skills</span> <span>{{ rc-i18n "RipCrypt.Apps.glim-skills" }}</span>
<span class="small">Rank</span> <span class="small">{{ rc-i18n "RipCrypt.common.rank" }}</span>
</div> </div>
<ol class="skill-list odd glim-skills"> <ol class="num-before skill-list odd glim-skills">
<li></li>
<li></li>
<li></li>
<li></li>
</ol>
<div class="label col-header list-header">
<span>{{ rc-i18n "RipCrypt.common.gear" }}</span>
<span class="small">{{ rc-i18n "RipCrypt.common.slots" }}</span>
</div>
<ol class="num-after gear-list">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li> <li></li>
<li></li> <li></li>
<li></li> <li></li>

View file

@ -31,7 +31,7 @@
font-weight: bold; font-weight: bold;
} }
.skill-list-header { .list-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
@ -78,4 +78,16 @@
grid-column: 2 / span 1; grid-column: 2 / span 1;
grid-row: 7 / span 4; grid-row: 7 / span 4;
} }
.gear-list {
grid-row: span 12;
display: grid;
grid-template-rows: subgrid;
list-style-type: none;
> :nth-child(even) {
background: var(--alt-row-background);
color: var(--alt-row-text);
}
}
} }

View file

@ -1,12 +1,34 @@
.ripcrypt > .window-content { .ripcrypt > .window-content {
ol { ol {
list-style-position: inside; list-style-type: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
counter-reset: list-index 0;
> li { > li {
margin: 0; margin: 0;
padding: 0; padding: 2px 4px;
display: flex;
flex-direction: row;
gap: 8px;
align-items: center;
counter-increment: list-index 1;
position: relative;
}
&.num-before > li::before,
&.num-after > li::after {
content: counter(list-index);
display: block;
position: absolute;
font-size: var(--font-size-12);
}
&.num-before > li::before {
position: revert;
}
&.num-after > li::after {
right: 4px;
} }
} }
} }

View file

@ -39,7 +39,9 @@
"guts": "Guts", "guts": "Guts",
"glory": "Glory", "glory": "Glory",
"step": "Step", "step": "Step",
"rank": "Rank" "rank": "Rank",
"gear": "Gear",
"slots": "Slots"
}, },
"setting": { "setting": {
"abbrAccess": { "abbrAccess": {
@ -50,6 +52,10 @@
"Apps": { "Apps": {
"move-run": "@RipCrypt.common.move • @RipCrypt.common.run", "move-run": "@RipCrypt.common.move • @RipCrypt.common.run",
"traits-range": "@RipCrypt.common.traits • @RipCrypt.common.range", "traits-range": "@RipCrypt.common.traits • @RipCrypt.common.range",
"grit-skills": "@RipCrypt.common.ability.grit Skills",
"gait-skills": "@RipCrypt.common.ability.gait Skills",
"grip-skills": "@RipCrypt.common.ability.grip Skills",
"glim-skills": "@RipCrypt.common.ability.glim Skills",
"a11y": { "a11y": {
"guts-value-edit": "The current amount of guts the character has", "guts-value-edit": "The current amount of guts the character has",
"guts-value-readonly": "The current amount of guts the character has", "guts-value-readonly": "The current amount of guts the character has",