fix small style details in action config application

This commit is contained in:
moliloo 2025-07-05 16:59:44 -03:00
parent 0f87b389e3
commit 93a61b4d41
7 changed files with 60 additions and 54 deletions

View file

@ -40,6 +40,10 @@ export default class DHActionConfig extends DaggerheartSheet(ApplicationV2) {
};
static PARTS = {
header: {
id: 'header',
template: 'systems/daggerheart/templates/sheets-settings/action-settings/header.hbs'
},
tabs: { template: 'systems/daggerheart/templates/sheets/global/tabs/tab-navigation.hbs' },
base: {
id: 'base',
@ -84,7 +88,7 @@ export default class DHActionConfig extends DaggerheartSheet(ApplicationV2) {
icon: null,
label: 'Effect'
}
}
};
static CLEAN_ARRAYS = ['damage.parts', 'cost', 'effects'];

View file

@ -89,11 +89,18 @@
box-shadow: none;
}
& option {
& option,
& optgroup {
color: @beige;
background-color: @dark-blue;
border-radius: 6px;
}
&:disabled {
opacity: 0.6;
outline: 2px solid transparent;
cursor: not-allowed;
}
}
p {
@ -160,17 +167,6 @@
height: 2rem;
}
}
.checkbox {
display: flex;
align-items: center;
gap: 20px;
align-self: end;
}
.fas.fa-trash {
align-self: end;
}
&.one-column {
display: flex;
@ -182,12 +178,6 @@
> .one-column {
width: 100%;
}
.nest-inputs {
fieldset {
flex: 1;
width: 100%;
}
}
}
&.two-columns {
@ -223,8 +213,10 @@
}
}
&[disabled], select[disabled], input[disabled] {
opacity: .5;
&[disabled],
select[disabled],
input[disabled] {
opacity: 0.5;
}
.nest-inputs {
@ -232,6 +224,18 @@
align-items: center;
width: 100%;
gap: 5px;
.btn {
padding-top: 15px;
}
.image {
height: 40px;
width: 40px;
object-fit: cover;
border-radius: 6px;
border: none;
}
}
.form-group {
@ -241,26 +245,20 @@
font-weight: bold;
font-size: smaller;
}
&.checkbox {
width: fit-content;
.form-fields {
height: 32px;
align-content: center;
}
}
}
&:has(.list-w-img) {
gap: 0;
}
&:has(+ .fas.fa-trash) {
border-bottom-right-radius: 0;
}
.fas.fa-trash {
color: darkred;
border-radius: 0 6px 6px 0;
border-color: light-dark(#18162e, #f3c267);
border-width: 2px;
border-style: groove;
border-left-width: 0;
padding: 5px;
margin-left: -7px;
}
}
.two-columns {

View file

@ -7,6 +7,7 @@
flex-direction: column;
gap: 10px;
align-items: center;
width: 100%;
}
.card-list {
display: flex;

View file

@ -2,8 +2,6 @@
.tab-form-footer {
display: flex;
padding: 0 10px;
position: relative;
bottom: -32px;
button {
flex: 1;

View file

@ -5,13 +5,11 @@
</legend>
{{#each source as |cost index|}}
<div class="nest-inputs">
<fieldset class="flex">
{{formField ../fields.type choices=(@root.disableOption index ../fields.type.choices ../source) label="Resource" value=cost.type name=(concat "cost." index ".type") localize=true}}
{{formField ../fields.value label="Amount" value=cost.value name=(concat "cost." index ".value")}}
{{formField ../fields.scalable label="Scalable" value=cost.scalable name=(concat "cost." index ".scalable") classes="checkbox"}}
{{formField ../fields.step label="Step" value=cost.step name=(concat "cost." index ".step") disabled=(not cost.scalable)}}
</fieldset>
<div class="fas fa-trash" data-action="removeElement" data-index="{{index}}"></div>
{{formField ../fields.scalable label="Scalable" value=cost.scalable name=(concat "cost." index ".scalable") classes="checkbox"}}
{{formField ../fields.type choices=(@root.disableOption index ../fields.type.choices ../source) label="Resource" value=cost.type name=(concat "cost." index ".type") localize=true}}
{{formField ../fields.value label="Amount" value=cost.value name=(concat "cost." index ".value")}}
{{formField ../fields.step label="Step" value=cost.step name=(concat "cost." index ".step") disabled=(not cost.scalable)}}
<a class="btn" data-tooltip="{{localize "DAGGERHEART.Tooltip.delete"}}" data-action="removeElement" data-index="{{index}}"><i class="fas fa-trash"></i></a>
</div>
{{/each}}
</fieldset>

View file

@ -3,17 +3,21 @@
Effects
<a><i class="fa-solid fa-plus icon-button" data-action="addEffect"></i></a>
</legend>
{{#each source as | effect index |}}
<div class="nest-inputs">
<fieldset class="flex list-w-img" data-effect-id="{{effect._id}}" data-action="editEffect">
<ul class="items-list">
{{#each source as | effect index |}}
<div class="inventory-item" data-effect-id="{{effect._id}}" data-action="editEffect">
{{#with (@root.getEffectDetails effect._id) as | details |}}
<img src="{{img}}">
<label>{{name}}</label>
<img class="item-img" src="{{img}}">
<div class="item-label">
<span class="item-name">{{name}}</span>
</div>
{{/with}}
<input type="hidden" name="effects.{{index}}._id" value="{{effect._id}}">
{{#if @root.source.save.trait}}{{formInput ../fields.onSave value=effect.onSave name=(concat "effects." index ".onSave") dataset=(object tooltip="Applied even if save succeeded" tooltipDirection="UP")}}{{/if}}
</fieldset>
<div class="fas fa-trash" data-action="removeEffect" data-index="{{index}}"></div>
</div>
{{/each}}
<div class="controls">
<a data-tooltip="{{localize "DAGGERHEART.Tooltip.delete"}}" data-action="removeEffect" data-index="{{index}}"><i class="fas fa-trash"></i></a>
</div>
</div>
{{/each}}
</ul>
</fieldset>

View file

@ -0,0 +1,3 @@
<header class="dialog-header">
<h1>{{source.name}}</h1>
</header>