Fixed overflow layout and added confirmation on countdown removal

This commit is contained in:
WBHarry 2025-06-21 14:39:23 +02:00
parent 2299141442
commit 81cda222da
5 changed files with 107 additions and 41 deletions

View file

@ -1,4 +1,6 @@
.daggerheart.dh-style.countdown {
overflow: hidden;
fieldset {
align-items: center;
margin-top: 5px;
@ -19,7 +21,7 @@
&.minimized {
height: auto !important;
max-height: unset !important;
max-width: 600px !important;
max-width: 740px !important;
width: auto !important;
.window-content {
@ -69,28 +71,53 @@
display: none;
}
.countdown-container {
display: flex;
align-items: center;
gap: 16px;
.window-content {
> div {
height: 100%;
img {
width: 150px;
height: 150px;
cursor: pointer;
}
.countdown-inner-container {
display: flex;
flex-direction: column;
gap: 4px;
.countdown-value-container {
.expanded-view {
height: 100%;
display: flex;
gap: 4px;
flex-direction: column;
input {
max-width: 80px;
.countdowns-container {
display: flex;
gap: 8px;
flex-wrap: wrap;
overflow: auto;
max-height: 100%;
.countdown-fieldset {
width: 340px;
height: min-content;
.countdown-container {
display: flex;
align-items: center;
gap: 16px;
img {
width: 150px;
height: 150px;
cursor: pointer;
}
.countdown-inner-container {
display: flex;
flex-direction: column;
gap: 4px;
.countdown-value-container {
display: flex;
gap: 4px;
input {
max-width: 80px;
}
}
}
}
}
}
}
}

View file

@ -3191,6 +3191,9 @@ div.daggerheart.views.multiclass {
#resources:has(.fear-bar) {
min-width: 200px;
}
.daggerheart.dh-style.countdown {
overflow: hidden;
}
.daggerheart.dh-style.countdown fieldset {
align-items: center;
margin-top: 5px;
@ -3208,7 +3211,7 @@ div.daggerheart.views.multiclass {
.daggerheart.dh-style.countdown.minimized {
height: auto !important;
max-height: unset !important;
max-width: 600px !important;
max-width: 740px !important;
width: auto !important;
}
.daggerheart.dh-style.countdown.minimized .window-content {
@ -3247,26 +3250,45 @@ div.daggerheart.views.multiclass {
.daggerheart.dh-style.countdown .hidden {
display: none;
}
.daggerheart.dh-style.countdown .countdown-container {
.daggerheart.dh-style.countdown .window-content > div {
height: 100%;
}
.daggerheart.dh-style.countdown .window-content > div .expanded-view {
height: 100%;
display: flex;
flex-direction: column;
}
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container {
display: flex;
gap: 8px;
flex-wrap: wrap;
overflow: auto;
max-height: 100%;
}
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset {
width: 340px;
height: min-content;
}
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container {
display: flex;
align-items: center;
gap: 16px;
}
.daggerheart.dh-style.countdown .countdown-container img {
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container img {
width: 150px;
height: 150px;
cursor: pointer;
}
.daggerheart.dh-style.countdown .countdown-container .countdown-inner-container {
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container .countdown-inner-container {
display: flex;
flex-direction: column;
gap: 4px;
}
.daggerheart.dh-style.countdown .countdown-container .countdown-inner-container .countdown-value-container {
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container .countdown-inner-container .countdown-value-container {
display: flex;
gap: 4px;
}
.daggerheart.dh-style.countdown .countdown-container .countdown-inner-container .countdown-value-container input {
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container .countdown-inner-container .countdown-value-container input {
max-width: 80px;
}
.daggerheart.dh-style.setting fieldset {