Add css for army and new item cohort/fortif

This commit is contained in:
Mandar
2021-11-18 13:32:50 +01:00
parent b0629ef19b
commit 9be0ed3571
5 changed files with 142 additions and 50 deletions

View File

@@ -10,6 +10,7 @@
@import "../scss/dices-chat"; @import "../scss/dices-chat";
@import "../scss/sheets"; @import "../scss/sheets";
@import "../scss/npc"; @import "../scss/npc";
@import "../scss/army";
@import "../scss/nav"; @import "../scss/nav";
@import "../scss/rings"; @import "../scss/rings";
@import "../scss/skills"; @import "../scss/skills";

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,87 @@
/** Sheets **/
&.sheet {
&.army {
.sheet-header {
height: auto;
h1 {
flex: 1;
}
.warlord,
.commander {
display: flex;
fieldset {
flex: content;
margin-top: 0.25rem;
margin-bottom: 0.25rem;
strong {
color: $l5r5e-label;
}
label {
flex: 100%;
}
}
}
.readiness,
.standing {
align-items: flex-start;
h2 {
flex: 0 0 100%;
}
ul > li {
position: relative;
padding: 0.25rem;
display: flex;
flex-direction: column-reverse;
strong {
text-align: center;
}
input {
background: transparent;
border: 0 none;
text-align: center;
}
&:after {
content: "";
width: 2rem;
height: 2rem;
position: absolute;
right: calc(50% - 0.95rem);
top: calc(50% - 1.6rem);
background: transparent url("../assets/icons/circle.svg") no-repeat 0 0;
background-size: contain;
opacity: 0.25;
}
&:nth-child(1) {
&:after {
transform: rotate(0deg);
}
}
&:nth-child(2) {
&:after {
transform: rotate(90deg);
}
}
&:nth-child(3) {
&:after {
transform: rotate(180deg);
}
}
&:nth-child(4) {
&:after {
transform: rotate(-90deg);
}
}
}
}
.readiness {
ul {
display: flex;
flex-wrap: wrap;
li {
flex: 50%;
}
}
}
}
}
}

View File

@@ -98,6 +98,8 @@
} }
// Advancement Sheet, Armor Sheet, Item Sheet, Peculiarity Sheet, Property Sheet, Technique Sheet, Weapon Sheet // Advancement Sheet, Armor Sheet, Item Sheet, Peculiarity Sheet, Property Sheet, Technique Sheet, Weapon Sheet
&.advancement, &.advancement,
&.army-cohort,
&.army-fortification,
&.armor, &.armor,
&.bond, &.bond,
&.item, &.item,

View File

@@ -2,74 +2,76 @@
{{!-- Sheet Header --}} {{!-- Sheet Header --}}
<header class="sheet-header"> <header class="sheet-header">
<img class="profile-img" src="{{data.img}}" data-edit="img" title="{{data.name}}"/> <img class="profile-img" src="{{data.img}}" data-edit="img" title="{{data.name}}"/>
<div class="header-fields identity-wrapper"> <h1 class="charname"><input name="name" type="text" value="{{data.name}}" placeholder="Name"/></h1>
<h1 class="charname"><input name="name" type="text" value="{{data.name}}" placeholder="Name"/></h1> <div class="header-fields warlord">
</div> <fieldset>
<div class="header-fields">
<div class="warlord">
<p> <p>
{{localize 'l5r5e.army.warlord'}} <strong>{{localize 'l5r5e.army.warlord'}}</strong>
<input name="data.warlord" type="text" value="{{data.data.warlord}}" /> <input name="data.warlord" type="text" value="{{data.data.warlord}}" />
</p> </p>
<p> <p>
{{localize 'l5r5e.army.allies_backers'}} <strong>{{localize 'l5r5e.army.allies_backers'}}</strong>
<textarea type="text" name="data.allies_backers">{{data.data.allies_backers}}</textarea> <textarea type="text" name="data.allies_backers">{{data.data.allies_backers}}</textarea>
</p> </p>
<p> <p>
{{localize 'l5r5e.army.purpose_mustering'}} <strong>{{localize 'l5r5e.army.purpose_mustering'}}</strong>
<textarea type="text" name="data.purpose_mustering">{{data.data.purpose_mustering}}</textarea> <textarea type="text" name="data.purpose_mustering">{{data.data.purpose_mustering}}</textarea>
</p> </p>
</fieldset>
<div class="attributes-wrapper"> <fieldset class="readiness">
{{localize 'l5r5e.army.battle_readiness.title'}} <h2>{{localize 'l5r5e.army.battle_readiness.title'}}</h2>
<p> <ul>
{{localize 'l5r5e.army.battle_readiness.strength'}} <li>
<strong>{{localize 'l5r5e.army.battle_readiness.strength'}}</strong>
<input name="data.battle_readiness.casualties_strength.max" type="text" value="{{data.data.battle_readiness.casualties_strength.max}}" /> <input name="data.battle_readiness.casualties_strength.max" type="text" value="{{data.data.battle_readiness.casualties_strength.max}}" />
</p> </li>
<p> <li>
{{localize 'l5r5e.army.battle_readiness.casualties'}} <strong>{{localize 'l5r5e.army.battle_readiness.casualties'}}</strong>
<input name="data.battle_readiness.casualties_strength.value" type="text" value="{{data.data.battle_readiness.casualties_strength.value}}" /> <input name="data.battle_readiness.casualties_strength.value" type="text" value="{{data.data.battle_readiness.casualties_strength.value}}" />
</p> </li>
<p> <li>
{{localize 'l5r5e.army.battle_readiness.discipline'}} <strong>{{localize 'l5r5e.army.battle_readiness.discipline'}}</strong>
<input name="data.battle_readiness.panic_discipline.max" type="text" value="{{data.data.battle_readiness.panic_discipline.max}}" /> <input name="data.battle_readiness.panic_discipline.max" type="text" value="{{data.data.battle_readiness.panic_discipline.max}}" />
</p> </li>
<p> <li>
{{localize 'l5r5e.army.battle_readiness.panic'}} <strong>{{localize 'l5r5e.army.battle_readiness.panic'}}</strong>
<input name="data.battle_readiness.panic_discipline.value" type="text" value="{{data.data.battle_readiness.panic_discipline.value}}" /> <input name="data.battle_readiness.panic_discipline.value" type="text" value="{{data.data.battle_readiness.panic_discipline.value}}" />
</p> </li>
</div> </ul>
</div> </fieldset>
<div class="commander"> </div>
<p> <div class="header-fields commander">
{{localize 'l5r5e.army.commander'}} <fieldset>
<label>
<strong>{{localize 'l5r5e.army.commander'}}</strong>
<input name="data.commander" type="text" value="{{data.data.commander}}" /> <input name="data.commander" type="text" value="{{data.data.commander}}" />
</p> </label>
<p> <label>
{{localize 'l5r5e.army.commander_abilities'}} <strong>{{localize 'l5r5e.army.commander_abilities'}}</strong>
<textarea type="text" name="data.commander_abilities">{{data.data.commander_abilities}}</textarea> <textarea type="text" name="data.commander_abilities">{{data.data.commander_abilities}}</textarea>
</p> </label>
<p> <label>
{{localize 'l5r5e.army.army_abilities'}} <strong>{{localize 'l5r5e.army.army_abilities'}}</strong>
<textarea type="text" name="data.army_abilities">{{data.data.army_abilities}}</textarea> <textarea type="text" name="data.army_abilities">{{data.data.army_abilities}}</textarea>
</p> </label>
</fieldset>
<div class="attributes-wrapper"> <fieldset class="standing">
{{localize 'l5r5e.army.commander_standing'}} <h2>{{localize 'l5r5e.army.commander_standing'}}</h2>
<p> <ul>
{{localize 'l5r5e.social.honor'}} <li>
<strong>{{localize 'l5r5e.social.honor'}}</strong>
<input name="data.commander_standing.honor" type="text" value="{{data.data.commander_standing.honor}}" /> <input name="data.commander_standing.honor" type="text" value="{{data.data.commander_standing.honor}}" />
</p> </li>
<p> <li>
{{localize 'l5r5e.social.glory'}} <strong>{{localize 'l5r5e.social.glory'}}</strong>
<input name="data.commander_standing.glory" type="text" value="{{data.data.commander_standing.glory}}" /> <input name="data.commander_standing.glory" type="text" value="{{data.data.commander_standing.glory}}" />
</p> </li>
<p> <li>
{{localize 'l5r5e.social.status'}} <strong>{{localize 'l5r5e.social.status'}}</strong>
<input name="data.commander_standing.status" type="text" value="{{data.data.commander_standing.status}}" /> <input name="data.commander_standing.status" type="text" value="{{data.data.commander_standing.status}}" />
</p> </li>
</div> </ul>
</div> </fieldset>
</div> </div>
</header> </header>
{{!-- Sheet Body --}} {{!-- Sheet Body --}}