.chat-message { .message-content { .card-buttons, .message-buttons { .pf2e-toolbelt-target-buttons { display: flex; gap: 1px; button[data-save], button[data-action="roll-area-damage"], button[data-action="roll-fake-check"] { flex: 1; border-radius: 0 4px 4px 0; &:has(+ button) { border-radius: 0; } } button[class^="pf2e-toolbelt-target-"] { width: 2.4em; border-radius: 4px 0 0 4px; } button.pf2e-toolbelt-target-expend { i { background-size: contain; height: 100%; width: 100%; background-repeat: no-repeat; background-position: center; } span { position: absolute; color: white; text-shadow: 0 0 2px black, 0 0 2px black, 0 0 2px black; font-weight: bold; padding-left: 1em; padding-top: 0.9em; } &:disabled { opacity: 0.5; } } button.pf2e-toolbelt-target-rollSaves { border-radius: 0 4px 4px 0; } } } .dice-result { .pf2e-toolbelt-target-buttons { position: absolute; left: 1px; bottom: 1px; display: flex; gap: 1px; align-items: center; button { height: 1.4rem; width: 1.4rem; min-height: revert; } button.pf2e-toolbelt-target-expend { padding: 0; i { background-size: contain; height: 1em; width: 100%; background-repeat: no-repeat; background-position: center; } span { display: none; } &:disabled { opacity: 0.5; } } .pf2e-toolbelt-target-toggleDamageRows { &.expanded { .expand { display: none; } } &:not(.expanded) { .collapse { display: none; } } } } } .chat-card { footer { .pf2e-toolbelt-target-buttons { display: inline-flex; float: right; margin-bottom: -1px; height: 100%; gap: 0.5em; } span:has(+ .pf2e-toolbelt-target-buttons) { border-right: 0; } } } } .message-content .pf2e-toolbelt-target-targetRows .target-row { --criticalSuccess: #008000; --success: #0000ff; --failure: #ff6a00; --criticalFailure: #ff0000; --drag-over: #368a8b45; --highlight: #00000021; user-select: none; hr { margin-block: 0.2em; } .target-header { display: flex; align-items: center; justify-content: space-between; gap: 0.5em; height: 1.7em; .name, .controls { height: 100%; display: flex; align-items: center; white-space: nowrap; height: 100%; } .name { font-weight: bold; overflow: hidden; text-overflow: ellipsis; flex: 1; i { &:not(.empty) { display: flex; align-items: center; justify-content: center; width: 18px; } &.fa-person { font-size: 1.1em; margin-top: -1px; } } } .controls { hr { width: 0; border: none; border-left: 2px groove white; height: 70%; margin: -1px 0.3em 0 0.4em; } .observe, .roll, .reroll { display: flex; align-items: center; } .degree, i.die, i.ban, i.unknown { width: 1.05rem; display: inline-block; text-align: center; } .degree { font-size: 1.1em; line-height: 1; &.show { &.criticalSuccess { color: var(--criticalSuccess); } &.success { color: var(--success); } &.failure { color: var(--failure); } &.criticalFailure { text-shadow: 0 0 black; color: var(--criticalFailure); } } } i { &.die { font-size: 0.95em; margin-top: 0.5px; } &.rotate { font-size: 0.9em; margin-right: 2px; } &.reroll { font-size: 0.9em; opacity: 0.8; margin-top: 2px; } &.list { font-size: 0.96em; margin-right: 0.3em; } } &.has-significant-modifiers { &.ESSENTIAL { --significant-glow: var(--pf2emm-color-essential); } &.HELPFUL { --significant-glow: var(--pf2emm-color-helpful); } &.HARMFUL { --significant-glow: var(--pf2emm-color-harmful); } &.DETRIMENTAL { --significant-glow: var(--pf2emm-color-detrimental); } .save { animation: pf2e-toolbelt-blinking 0.4s infinite alternate; @keyframes pf2e-toolbelt-blinking { from { text-shadow: 0 0 0 var(--significant-glow); } to { text-shadow: 0 0 6px var(--significant-glow); } } } } } } .damage-application { margin-top: 0; margin-bottom: 0.4em; &.small { button { --button-size: 1.2em; height: var(--button-size); img, i, span:has(+ span) { display: none; } } } &.success button[data-multiplier="0.5"] { box-shadow: inset 0 0 6px var(--success); } &.failure button[data-multiplier="1"] { box-shadow: inset 0 0 6px var(--failure); } &.criticalFailure button[data-multiplier="2"] { box-shadow: inset 0 0 6px var(--criticalFailure); } &.applied { button { filter: blur(1px); } } } &.drag-over { .target-header { background: var(--drag-over); } } &:last-child { .damage-application { margin-bottom: 0; + .damage-application { margin-top: 2px; } } } } .message-content .pf2e-toolbelt-target-targetRows:not(.pf2e-toolbelt-target-actionRows) { .target-row:first-child { margin-top: 0.4em; } } &.pf2e-toolbelt-check-gm { .message-content .card-buttons .pf2e-toolbelt-target-buttons { button[data-action="merge-to-damage"] { display: none; border-radius: 0; } } &:has(+ .pf2e-toolbelt-damage) { .message-content .card-buttons .pf2e-toolbelt-target-buttons { button[data-action="merge-to-damage"] { display: block; } } } } } body.pf2e-toolbelt-target-helper-save-colorblind { .message-content .pf2e-toolbelt-target-targetRows .target-row { --criticalSuccess: #009e73; --success: #0072b2; --failure: #d55e00; --criticalFailure: #cc79a7; } } [role="tooltip"] { .pf2e-toolbelt-target-save { display: flex; flex-direction: column; align-items: start; gap: 0.2em; .result { i { font-size: 0.8em; } } .note { font-style: italic; font-size: 0.9em; align-self: flex-end; margin-left: 2em; i { font-size: 0.95em; &:not(.rotate) { opacity: 0.8; } } } .excluded { text-decoration: line-through; } .ESSENTIAL { color: var(--pf2emm-color-essential); } .HELPFUL { color: var(--pf2emm-color-helpful); } .HARMFUL { color: var(--pf2emm-color-harmful); } .DETRIMENTAL { color: var(--pf2emm-color-detrimental); } } .pf2e-toolbelt-target-notes { list-style: none; padding: 0; .roll-note { strong { &::after { content: ":"; } } } } } .application.dialog.pf2e-toolbelt { .window-content { input[type="radio"] { --checkbox-size: 1rem; } } .dialog-content { label { i { font-size: 1.2em; width: 1.6em; text-align: center; } } } } .application.dialog.pf2e-toolbelt.pf2e-toolbelt-template-helper { min-width: revert; .window-header { flex: 1 2em; --button-size: 12px; } .window-content { padding: 0.1em 0.6em 0.5em; } .dialog-form { gap: 0.3em; } .dialog-content { display: grid; grid-template-rows: repeat(3, 1fr); grid-template-columns: auto auto; gap: 0 1em; align-items: center; font-size: 0.9em; label { display: flex; align-items: center; white-space: nowrap; input { &[type="radio"] { --checkbox-size: 13px; margin-inline: 0.3em; } &[type="checkbox"] { --checkbox-size: 16px; } } } } .form-footer { button { --button-size: 1.5rem; padding: 0; } } }