diff --git a/assets/parchments/dh-parchment-button-dark.png b/assets/parchments/dh-parchment-button-dark.png new file mode 100644 index 000000000..39dd76b3b Binary files /dev/null and b/assets/parchments/dh-parchment-button-dark.png differ diff --git a/styles/less/global/elements.less b/styles/less/global/elements.less index 7d46d627c..9dbf0683f 100755 --- a/styles/less/global/elements.less +++ b/styles/less/global/elements.less @@ -99,15 +99,16 @@ } button:where(:not(.plain, color-picker *, file-picker *)) { - background: light-dark(transparent, @golden); - border: 1px solid light-dark(@dark-blue, @dark-blue); - color: light-dark(@dark-blue, @dark-blue); + background: var(--dh-button-background); + border: 1px solid light-dark(@dark-blue, #efe6d850); + color: light-dark(@dark-blue, #efe6d8); outline: none; box-shadow: none; + border-radius: 0; &:hover { - background: light-dark(@light-black, @dark-blue); - color: light-dark(@dark-blue, @golden); + background-color: @golden-40; + background-blend-mode: lighten; } &.glow { @@ -115,15 +116,8 @@ } &:disabled { - background: light-dark(transparent, @golden); - color: light-dark(@dark-blue, @dark-blue); opacity: 0.6; cursor: not-allowed; - - &:hover { - background: light-dark(transparent, @golden); - color: light-dark(@dark-blue, @dark-blue); - } } &.reverted { @@ -558,38 +552,31 @@ .item-button { display: flex; - border: 1px solid light-dark(#18162e, #18162e); - color: light-dark(#18162e, #18162e); outline: none; box-shadow: none; - border-radius: 6px; + border-radius: 0; button { - border-radius: 3px 0px 0px 3px; - color: light-dark(@dark-blue, @dark-blue); + --button-size: 2.25em; + font-size: var(--font-size-12); + font-family: @font-body; + font-weight: 500; white-space: nowrap; - border: 0; - &:hover { - color: light-dark(@dark-blue, @golden); + &:not(:last-child) { + border-right-width: 0; } &:not(:first-child) { padding: 6px; - background: light-dark(@dark-blue-10, @golden-secondary); - border-radius: 0px 3px 3px 0px; - color: light-dark(@dark-blue, @dark-golden); - - &:hover { - background: light-dark(@light-black, @dark-blue); - color: light-dark(@dark-blue, @golden-secondary); - } + border-left-width: 0; } } .spacer { - border-right: 1px solid black; + border-right: 1px solid light-dark(#18162e, #efe6d850); content: ''; + margin-left: -1px; } } } @@ -701,6 +688,8 @@ } .theme-light { + --dh-button-background: transparent; + .application { &.sheet.dh-style { button.glow { @@ -723,6 +712,11 @@ } } +.theme-dark .dh-style, +.theme-dark.dh-style { + --dh-button-background: url('../assets/parchments/dh-parchment-button-dark.png'); +} + .application .component.dh-style.card-preview-container { position: relative; border: 2px solid transparent; diff --git a/styles/less/sheets/actors/character/sidebar.less b/styles/less/sheets/actors/character/sidebar.less index e450891b5..7188facae 100644 --- a/styles/less/sheets/actors/character/sidebar.less +++ b/styles/less/sheets/actors/character/sidebar.less @@ -93,6 +93,17 @@ } } + .status-label { + position: relative; + background: light-dark(@dark-blue, @golden); + h4 { + font-weight: bold; + text-align: center; + line-height: 18px; + color: light-dark(@beige, @dark-blue); + } + } + .resources-section { display: flex; justify-content: space-evenly; @@ -106,19 +117,10 @@ height: 40px; .status-label { - position: relative; top: 40px; height: 22px; width: 79px; clip-path: path('M0 0H79L74 16.5L39 22L4 16.5L0 0Z'); - background: light-dark(@dark-blue, @golden); - - h4 { - font-weight: bold; - text-align: center; - line-height: 18px; - color: light-dark(@beige, @dark-blue); - } } .status-value { @@ -253,12 +255,10 @@ .status-label { padding: 2px 2px; - position: relative; top: 30px; height: 22px; width: 95px; border-radius: 3px; - background: light-dark(@dark-blue, @golden); clip-path: none; display: flex; align-items: center; @@ -268,10 +268,6 @@ transition: all 0.3s ease; h4 { - font-weight: bold; - text-align: center; - line-height: 18px; - color: light-dark(@beige, @dark-blue); font-size: var(--font-size-12); } @@ -494,14 +490,8 @@ padding: 2px 10px; width: 100%; border-radius: 3px; - background: light-dark(@dark-blue, @golden); - h4 { - font-weight: bold; - text-align: center; - line-height: 18px; font-size: var(--font-size-12); - color: light-dark(@beige, @dark-blue); } } } diff --git a/templates/sheets/actors/character/features.hbs b/templates/sheets/actors/character/features.hbs index b27609008..7acde7135 100644 --- a/templates/sheets/actors/character/features.hbs +++ b/templates/sheets/actors/character/features.hbs @@ -8,6 +8,7 @@ type='feature' actorType='character' collection=category.values + isGlassy=true canCreate=@root.editable showActions=@root.editable }} @@ -17,6 +18,7 @@ type='feature' actorType='character' collection=category.values + isGlassy=true canCreate=false showActions=@root.editable }}