cosmo/daggerheart
1
0
Fork 0
mirror of https://github.com/Foundryborne/daggerheart.git synced 2026-06-07 05:14:16 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Implement new button styling

Browse source
This commit is contained in:
Carlos Fernandez 2026-05-13 06:31:04 -04:00
parent 24813e7e4f
commit b2bda3e76c
4 changed files with 37 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

54
styles/less/global/elements.less
View file

@ -100,16 +100,17 @@
scrollbar-color: light-dark(@dark-blue, @golden) transparent;
}
button:where(:not(.plain)) {
background: light-dark(transparent, @golden);
border: 1px solid light-dark(@dark-blue, @dark-blue);
color: light-dark(@dark-blue, @dark-blue);
button:where(:not(.plain, .icon)) {
background: var(--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 {
@ -117,15 +118,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 {
@ -551,38 +545,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;
}
}
}
@ -747,6 +734,8 @@
}
.theme-light {
--button-background: transparent;
.application {
&.sheet.dh-style {
button.glow {
@ -769,6 +758,11 @@
}
}
.theme-dark .dh-style,
.theme-dark.dh-style {
--button-background: url('../assets/parchments/dh-parchment-button-dark.png');
}
.application .component.dh-style.card-preview-container {
position: relative;
border: 2px solid transparent;