Move successful buttons to inner result

This commit is contained in:
Carlos Fernandez 2026-04-23 06:53:41 -04:00
parent 98f9957ba0
commit 632e33ecd6
2 changed files with 138 additions and 127 deletions

View file

@ -46,68 +46,6 @@
}
}
.member-roll-container {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
height: 3.375rem;
.name-area {
display: flex;
flex-direction: column;
flex: 1;
justify-content: center;
.name {
font-weight: 500;
}
.trait {
display: flex;
align-items: center;
gap: 6px;
select {
--input-height: 2em;
width: auto;
}
}
.item-tags {
align-items: stretch;
.buttons {
align-items: stretch;
display: flex;
button {
--button-size: auto;
color: var(--medium-red);
padding: 0 var(--spacer-4);
&[data-success=true] {
color: var(--green);
}
&.inactive {
opacity: 0.5;
}
}
}
}
}
&.inactive {
opacity: 0.3;
pointer-events: none;
}
a.roll-button.initial-roll {
width: 1.875rem;
height: 1.875rem;
margin-right: 2px; /** makes hover look a bit nicer */
}
}
}
.roll-container {
display: flex;
flex-direction: column;
}
.with-result {
border-radius: 5px;
background: var(--duality-bg);
@ -135,6 +73,61 @@
}
}
.member-roll-container {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
height: 3.375rem;
&.inactive {
opacity: 0.3;
pointer-events: none;
}
.name-area {
display: flex;
flex-direction: column;
flex: 1;
justify-content: center;
.name {
font-weight: 500;
}
.trait {
display: flex;
align-items: center;
gap: 6px;
select {
--input-height: 2em;
width: auto;
}
}
.item-tags {
align-items: stretch;
}
}
.buttons {
display: flex;
flex-direction: column;
button {
--button-size: 1.5em;
padding: 0 var(--spacer-4);
}
}
a.roll-button.initial-roll {
width: 1.875rem;
height: 1.875rem;
margin-right: 2px; /** makes hover look a bit nicer */
}
.with-result {
display: flex;
justify-content: end;
align-items: center;
gap: 6px;
.roll-data {
display: flex;
flex-direction: column;
@ -191,6 +184,22 @@
}
}
.buttons {
gap: 2px;
button {
color: var(--medium-red);
&[data-success=true] {
color: var(--green);
}
&.inactive {
opacity: 0.4;
}
}
}
}
}
}
.group-roll-results {
display: flex;
flex-direction: column;

View file

@ -12,12 +12,6 @@
{{numberFormat modifier sign=true}}
</span>
{{/if}}
{{#if (and isEditable (ne ../partId "leader"))}}
<div class="buttons">
<button type="button" data-action="markSuccessful" data-success="true" class="plain icon fa-solid fa-check {{#if modifier}}{{#if successfull}}active{{else}}inactive{{/if}}{{/if}}"></button>
<button type="button" data-action="markSuccessful" class="plain icon fa-solid fa-times {{#if modifier}}{{#if successfull}}inactive{{else}}active{{/if}}{{/if}}"></button>
</div>
{{/if}}
</div>
{{else if readyToRoll}}
<div class="trait">
@ -29,7 +23,8 @@
{{/if}}
</div>
{{#if roll}}
<div class="roll-data with-result {{#if roll.withHope}}hope{{else if roll.withFear}}fear{{else}}critical{{/if}}">
<div class="with-result {{#if roll.withHope}}hope{{else if roll.withFear}}fear{{else}}critical{{/if}}">
<div class="roll-data">
<div class="duality-label">
{{roll.total}}
<span class="with">{{localize "DAGGERHEART.GENERAL.withThing" thing=roll.totalLabel}}</span>
@ -54,6 +49,13 @@
<span class="roll-value">{{positive roll.modifierTotal}}</span>
</div>
</div>
{{#if (and isEditable (ne ../partId "leader"))}}
<div class="buttons">
<button type="button" data-action="markSuccessful" data-success="true" class="plain icon fa-solid fa-check {{#if modifier}}{{#if successfull}}active{{else}}inactive{{/if}}{{/if}}"></button>
<button type="button" data-action="markSuccessful" class="plain icon fa-solid fa-times {{#if modifier}}{{#if successfull}}inactive{{else}}active{{/if}}{{/if}}"></button>
</div>
{{/if}}
</div>
{{else if readyToRoll}}
<a class="roll-button initial-roll" data-action="makeRoll" data-member="{{@root.partId}}">
<img class="roll-img duality" src="systems/daggerheart/assets/icons/dice/duality/DualityBW.svg" alt="2d12">