Impproved Adversary Sheet Data Display

Fixes #604
This commit is contained in:
Joaquin Pereyra 2025-08-10 19:40:20 -03:00
commit 9d0cfdd927
130 changed files with 2460 additions and 1451 deletions

View file

@ -27,3 +27,5 @@
@import './damage-reduction/sheets.less';
@import './multiclass-choice/sheet.less';
@import './reroll-dialog/sheet.less';

View file

@ -0,0 +1,125 @@
.daggerheart.dialog.dh-style.views.reroll-dialog {
.window-content {
max-width: 648px;
}
.reroll-outer-container {
h2 {
margin: 0;
}
.dices-container {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.dice-outer-container {
width: 300px;
legend {
display: flex;
align-items: center;
gap: 4px;
i {
margin-right: 4px;
}
}
.dice-container {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
.result-container {
position: relative;
aspect-ratio: 1;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
opacity: 0.8;
&.selected {
opacity: 1;
border: 1px solid;
border-radius: 6px;
border-color: light-dark(@dark-blue, @golden);
filter: drop-shadow(0 0 3px @golden);
}
&:before {
content: ' ';
position: absolute;
width: 100%;
height: 100%;
z-index: -1;
mask: var(--svg-die) no-repeat center;
mask-size: contain;
background: linear-gradient(139.01deg, #efe6d8 3.51%, #372e1f 96.49%);
}
&.d4:before {
--svg-die: url(../assets/icons/dice/default/d4.svg);
}
&.d6:before {
--svg-die: url(../assets/icons/dice/default/d6.svg);
}
&.d8:before {
--svg-die: url(../assets/icons/dice/default/d8.svg);
}
&.d10:before {
--svg-die: url(../assets/icons/dice/default/d10.svg);
}
&.d12:before {
--svg-die: url('../assets/icons/dice/default/d12.svg');
}
&.d20:before {
--svg-die: url(../assets/icons/dice/default/d20.svg);
}
.to-reroll-result {
position: absolute;
bottom: -7px;
gap: 2px;
border: 1px solid;
border-radius: 6px;
background-image: url(../assets/parchments/dh-parchment-dark.png);
display: flex;
align-items: center;
padding: 2px 6px;
input {
margin: 0;
height: 12px;
line-height: 0px;
position: relative;
top: 1px;
&:before,
&:after {
line-height: 12px;
font-size: 12px;
}
}
i {
font-size: 10px;
}
}
}
}
}
}
footer {
margin-top: 8px;
display: flex;
justify-content: space-between;
.controls {
display: flex;
gap: 8px;
}
}
}

View file

@ -32,6 +32,7 @@
.message-header-metadata {
flex: none;
display: flex;
flex-direction: column;
.message-metadata {
font-family: @font-body;
@ -73,6 +74,13 @@
.message-content {
padding-bottom: 8px;
.flavor-text {
font-size: var(--font-size-12);
line-height: 20px;
color: var(--color-dark-4);
text-align: center;
display: block;
}
}
}
}

View file

@ -53,7 +53,7 @@
font-weight: 500;
font-size: 14px;
line-height: 17px;
white-space: nowrap;
color: light-dark(@dark, @beige);
}

View file

@ -571,6 +571,16 @@
white-space: nowrap;
}
}
.button-container {
display: grid;
grid-template-columns: 1fr;
gap: 10px;
text-align: center;
display: flex;
justify-content: center;
width: 100%;
}
}
footer {

View file

@ -14,8 +14,14 @@
margin-bottom: 12px;
}
.feature-list {
.feature-list,
.features-dragger {
display: flex;
width: 100%;
font-family: @font-body;
}
.feature-list {
flex-direction: column;
gap: 10px;
@ -45,5 +51,16 @@
}
}
}
.features-dragger {
align-items: center;
justify-content: center;
box-sizing: border-box;
height: 40px;
margin-top: 10px;
border: 1px dashed light-dark(@dark-blue-50, @beige-50);
border-radius: 3px;
color: light-dark(@dark-blue-50, @beige-50);
}
}
}

View file

@ -10,7 +10,7 @@
}
.character-row .domains-section img {
filter: invert(88%) sepia(98%) saturate(1784%) hue-rotate(311deg) brightness(104%) contrast(91%);
filter: @golden-filter;
}
}
}, {
@ -20,7 +20,7 @@
}
.character-row .domains-section img {
filter: invert(87%) sepia(15%) saturate(343%) hue-rotate(333deg) brightness(110%) contrast(87%);
filter: brightness(0) saturate(100%);
}
}
});

View file

@ -11,333 +11,6 @@
}
}
/* &.roll {
.dice-flavor {
text-align: center;
font-weight: bold;
}
.dice-tooltip {
.dice-rolls {
&.duality {
display: flex;
gap: 0.25rem;
> .roll {
background-image: none;
.reroll-button {
border: none;
background: initial;
width: 42px;
&:hover {
background: var(--button-background-color);
border: 1px solid var(--button-border-color);
}
}
}
}
&.rerollable {
position: relative;
flex: none;
.dice-rerolled {
z-index: 2;
position: absolute;
right: 0;
font-size: 12px;
cursor: help;
}
.reroll-button {
border: none;
background: initial;
&:hover {
background: var(--button-background-color);
border: 1px solid var(--button-border-color);
}
}
}
// margin: 0;
> .roll {
display: flex;
align-items: center;
justify-content: center;
gap: 4px;
margin-bottom: 4px;
.dice-container {
display: flex;
flex-direction: column;
gap: 2px;
position: relative;
.dice-title {
color: var(--color-light-1);
text-shadow: 0 0 1px black;
}
.dice-rerolled {
z-index: 2;
position: absolute;
right: -2px;
font-size: 12px;
cursor: help;
}
.dice-inner-container {
display: flex;
align-items: center;
justify-content: center;
position: relative;
&.hope,
&.fear {
.dice-wrapper {
clip-path: polygon(
50% 0%,
80% 10%,
100% 35%,
100% 70%,
80% 90%,
50% 100%,
20% 90%,
0% 70%,
0% 35%,
20% 10%
);
}
}
.dice-wrapper {
height: 24px;
width: 24px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
.dice {
height: 26px;
width: 26px;
max-width: unset;
position: absolute;
}
}
.dice-value {
position: absolute;
font-weight: bold;
font-size: 16px;
}
&.hope {
.dice-wrapper {
background: black;
.dice {
filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(333%)
hue-rotate(352deg) brightness(102%) contrast(103%);
}
}
.dice-value {
color: var(--color-dark-1);
text-shadow: 0 0 4px white;
}
}
&.fear {
.dice-wrapper {
background: white;
.dice {
filter: brightness(0) saturate(100%) invert(12%) sepia(88%) saturate(4321%)
hue-rotate(221deg) brightness(92%) contrast(110%);
}
}
.dice-value {
color: var(--color-light-1);
text-shadow: 0 0 4px black;
}
}
&.advantage {
.dice-wrapper {
.dice {
filter: brightness(0) saturate(100%) invert(18%) sepia(92%) saturate(4133%)
hue-rotate(96deg) brightness(104%) contrast(107%);
}
}
}
&.disadvantage {
.dice-wrapper {
.dice {
filter: brightness(0) saturate(100%) invert(9%) sepia(78%) saturate(6903%)
hue-rotate(11deg) brightness(93%) contrast(117%);
}
}
}
}
}
}
}
.damage-resource {
font-weight: 600;
margin-top: 5px;
}
}
.dice-total {
&.duality {
&.hope {
border-color: @hope;
border-width: 3px;
background: rgba(@hope, 0.5);
}
&.fear {
border-color: @fear;
border-width: 3px;
background: rgba(@fear, 0.5);
}
&.critical {
border-color: @critical;
border-width: 3px;
background: rgba(@critical, 0.5);
}
}
.dice-total-value {
.hope {
color: @hope;
}
.fear {
color: @fear;
}
.critical {
color: @critical;
}
}
}
.dice-total-label {
font-size: 12px;
font-weight: bold;
font-variant: all-small-caps;
margin: -@fullMargin 0;
}
.target-selection {
display: flex;
justify-content: space-around;
input[type='radio'] {
display: none;
&:checked + label {
text-shadow: 0px 0px 4px #ce5937;
}
&:not(:checked) + label {
opacity: 0.75;
}
}
label {
cursor: pointer;
opacity: 0.75;
&.target-selected {
text-shadow: 0px 0px 4px #ce5937;
opacity: 1;
}
}
}
.target-section {
margin-top: 5px;
.target-container {
display: flex;
transition: all 0.2s ease-in-out;
&:hover {
filter: drop-shadow(0 0 3px @secondaryShadow);
border-color: gold;
}
&.hidden {
display: none;
border: 0;
}
&.hit {
background: @hit;
}
&.miss {
background: @miss;
}
img,
.target-save-container {
width: 22px;
height: 22px;
align-self: center;
border-color: transparent;
}
img {
flex: 0;
margin-left: 8px;
}
.target-save-container {
margin-right: 8px;
justify-content: center;
display: flex;
align-items: center;
min-height: unset;
border: 1px solid black;
}
.target-inner-container {
flex: 1;
display: flex;
justify-content: center;
font-size: var(--font-size-16);
}
&:not(:has(.target-save-container)) .target-inner-container {
margin-right: @hugeMargin;
}
}
}
.dice-actions {
display: flex;
gap: 4px;
button {
flex: 1;
height: 40px;
font-family: @font-body;
font-weight: 600;
}
}
.dice-result {
.roll-damage-button,
.damage-button,
.duality-action {
margin-top: 5px;
}
}
&:not(.expanded) .dice-tooltip {
grid-template-rows: 0fr;
}
} */
button {
&.inner-button {
--button-size: 1.25rem;
@ -349,19 +22,6 @@
}
}
}
[data-use-perm='false'] {
pointer-events: none;
border-color: transparent;
}
[data-view-perm='false'] {
> * {
display: none;
}
&::after {
content: '??';
}
}
}
.daggerheart,
@ -370,6 +30,20 @@
--text-color: light-dark(@dark-blue, @golden);
--bg-color: light-dark(@dark-blue-40, @golden-40);
[data-use-perm='false'] {
pointer-events: none;
border-color: transparent;
}
[data-view-perm='false'] {
&[data-perm-hidden='true'],
> * {
display: none;
}
&::after {
content: '??';
}
}
&.duality {
&.hope {
--text-color: @golden;
@ -412,7 +86,7 @@
grid-template-columns: 1fr auto 1fr;
align-items: center;
color: light-dark(@dark, @beige);
margin: 5px 0;
margin: 10px 0;
span {
display: flex;
@ -450,7 +124,6 @@
flex-direction: column;
align-items: center;
gap: 5px;
padding: 5px 0;
.dice-tooltip {
width: 100%;
@ -489,6 +162,7 @@
color: var(--text-color);
font-weight: 700;
font-family: 'Cinzel', sans-serif;
line-height: 0.75;
.roll-result-value {
font-size: var(--font-size-24);
@ -503,10 +177,6 @@
}
}
}
.roll-difficulty {
margin-top: -5px;
}
}
}
@ -522,10 +192,14 @@
.roll-die {
display: grid;
grid-template-areas:
". a a"
"c b b";
'. a a'
'c b b';
gap: 3px;
.reroll-button:hover {
filter: drop-shadow(0 0 3px @golden);
}
label {
text-align: center;
height: var(--font-size-12);
@ -580,7 +254,7 @@
.button-target-selection {
flex: 1;
text-align: center;
padding: 5px 0;
margin: -5px 0;
}
.button-target-selection:hover,
@ -600,6 +274,11 @@
width: 100%;
gap: 10px;
align-items: center;
border-radius: 3px;
&:hover {
background-color: rgba(255, 255, 255, 0.1);
}
.target-img {
border-radius: 50%;
@ -640,6 +319,7 @@
padding: 3px 5px;
width: fit-content;
margin: auto;
white-space: nowrap;
}
.roll-difficulty,
@ -706,6 +386,19 @@
margin-top: 0;
}
.damage-section[data-action='expandRoll'] {
.on-reduced {
.wrapper {
flex-wrap: wrap;
gap: 10px 5px;
}
.roll-formula {
font-size: var(--font-size-16);
}
}
}
.target-section {
.roll-part-content {
gap: 10px;

View file

@ -2,43 +2,14 @@
.encounter-controls.combat {
justify-content: space-between;
.encounter-fear-controls {
.encounter-title {
text-align: left;
}
.inner-controls {
display: flex;
align-items: center;
gap: 8px;
.encounter-fear-dice-container {
display: flex;
gap: 2px;
.encounter-control-fear-container {
display: flex;
position: relative;
align-items: center;
justify-content: center;
color: black;
.dice {
height: 22px;
width: 22px;
}
.encounter-control-fear {
position: absolute;
font-size: 16px;
}
.encounter-control-counter {
position: absolute;
right: -10px;
color: var(--color-text-secondary);
}
}
}
.encounter-countdowns {
color: var(--content-link-icon-color);
}
gap: 4px;
}
.control-buttons {

View file

@ -227,14 +227,16 @@
display: flex;
> * {
flex: 1;
flex: 2.5;
text-align: center;
}
.item-list-img {
width: 40px;
flex: unset;
}
.item-list-name {
flex-grow: 3 !important;
flex-grow: 3;
text-align: start;
}
}

View file

@ -108,7 +108,7 @@
box-shadow: unset;
border-color: transparent;
header,
.controls,
#resource-fear .controls,
.window-resize-handle {
opacity: 0;
}