cosmo/daggerheart
1
0
Fork 0
mirror of https://github.com/Foundryborne/daggerheart.git synced 2026-07-23 19:09:55 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Styling pass for scrollbars, fieldsets, and scroll shadows

Browse source
This commit is contained in:
Carlos Fernandez 2026-05-29 05:41:22 -04:00
parent 1ebbad4797
commit a15b82df36
37 changed files with 355 additions and 278 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -261,13 +261,14 @@
fieldset {
align-items: center;
margin-top: 5px;
border-radius: 6px;
border-color: @color-fieldset-border;
margin-top: 5px;
&.glassy {
background-color: light-dark(@dark-blue-10, @golden-10);
border-color: transparent;
padding-inline: 10px;
border: none;
legend {
padding: 2px 12px;
@ -501,7 +502,7 @@
height: 1px;
width: 100%;
border-bottom: 1px solid @color-border;
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
mask-image: linear-gradient(270deg, transparent 0%, black 35%, black 50%, black 65%, transparent 100%);
}
side-line-div {
@ -535,50 +536,6 @@
transform-origin: top;
}
.item-buttons {
grid-column: span 3;
display: flex;
gap: 8px;
flex-wrap: wrap;
margin-top: 2px;
.item-button {
display: flex;
border: 1px solid light-dark(#18162e, #18162e);
color: light-dark(#18162e, #18162e);
outline: none;
box-shadow: none;
border-radius: 6px;
button {
border-radius: 3px 0px 0px 3px;
color: light-dark(@dark-blue, @dark-blue);
white-space: nowrap;
border: 0;
&:hover {
color: @color-text-emphatic;
}
&: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);
}
}
}
.spacer {
border-right: 1px solid black;
content: '';
}
}
}
.artist-attribution {
width: 100%;
display: flex;

2
styles/less/global/global.less
View file

@ -93,7 +93,7 @@
flex-wrap: wrap;
font-size: var(--font-size-12);
justify-content: start;
padding: 3px 5px;
padding: 2px 5px;
}
}
}

48
styles/less/global/inventory-item.less
View file

@ -45,8 +45,12 @@
.item-main {
border-radius: 5px;
// Make hover extend out of bounds.
// Because of this extra spacing, the scroll container parent needs some padding
padding: 2px;
margin: -2px;
margin-bottom: 0;
}
&:hover {
@ -271,6 +275,50 @@
grid-area: labels;
}
}
.item-buttons {
grid-column: span 3;
display: flex;
gap: 8px;
flex-wrap: wrap;
.item-button {
display: flex;
border: 1px solid light-dark(#18162e, #18162e);
color: light-dark(#18162e, #18162e);
outline: none;
box-shadow: none;
border-radius: 6px;
button {
border-radius: 3px 0px 0px 3px;
color: light-dark(@dark-blue, @dark-blue);
white-space: nowrap;
border: 0;
&:hover {
color: @color-text-emphatic;
}
&: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);
}
}
}
.spacer {
border-right: 1px solid black;
content: '';
}
}
}
}
.card-item {

2
styles/less/global/sheet.less
View file

@ -54,7 +54,7 @@ body.game:is(.performance-low, .noblur) {
position: relative;
min-height: -webkit-fill-available;
transition: opacity 0.3s ease;
padding-bottom: 20px;
padding-bottom: 16px;
.tab {
padding: 0 10px;