fix char sidebard and tabs scroll

This commit is contained in:
moliloo 2025-07-24 18:54:05 -03:00
parent 2357aaeb31
commit 6565ab75be
9 changed files with 146 additions and 114 deletions

View file

@ -0,0 +1,19 @@
@import '../../../utils/colors.less';
@import '../../../utils/fonts.less';
.application.sheet.daggerheart.actor.dh-style.character {
.tab.effects {
.effects-sections {
display: flex;
flex-direction: column;
gap: 10px;
overflow-y: auto;
mask-image: linear-gradient(0deg, transparent 0%, black 5%, black 95%, transparent 100%);
padding: 20px 0;
padding-top: 10px;
scrollbar-width: thin;
scrollbar-color: light-dark(@dark-blue, @golden) transparent;
}
}
}

View file

@ -11,7 +11,6 @@
mask-image: linear-gradient(0deg, transparent 0%, black 5%, black 95%, transparent 100%);
padding: 20px 0;
padding-top: 10px;
height: 84%;
scrollbar-width: thin;
scrollbar-color: light-dark(@dark-blue, @golden) transparent;

View file

@ -97,7 +97,6 @@
overflow-y: auto;
mask-image: linear-gradient(0deg, transparent 0%, black 10%, black 98%, transparent 100%);
padding: 20px 0;
height: 84%;
scrollbar-width: thin;
scrollbar-color: light-dark(@dark-blue, @golden) transparent;

View file

@ -63,7 +63,7 @@
flex-direction: column;
top: -20px;
gap: 30px;
margin-bottom: -10px;
margin-bottom: -16px;
.resources-section {
display: flex;
@ -357,54 +357,39 @@
}
}
.equipment-section {
.title {
display: flex;
gap: 15px;
align-items: center;
.shortcut-items-section {
overflow-y: hidden;
max-height: 56%;
padding-top: 16px;
padding-bottom: 20px;
mask-image: linear-gradient(0deg, transparent 0%, black 5%, black 95%, transparent 100%);
h3 {
font-size: 20px;
}
}
.items-list {
display: flex;
flex-direction: column;
gap: 10px;
align-items: center;
&:hover {
overflow-y: auto;
scrollbar-width: thin;
scrollbar-color: light-dark(@dark-blue, @golden) transparent;
}
}
.loadout-section {
.equipment-section,
.loadout-section,
.experience-section {
.title {
display: flex;
gap: 15px;
align-items: center;
.section-title();
}
}
h3 {
font-size: 20px;
}
.equipment-section {
.items-list {
.column-list(10px);
}
}
.experience-section {
.title {
display: flex;
gap: 15px;
align-items: center;
h3 {
font-size: 20px;
}
}
.experience-list {
display: flex;
flex-direction: column;
gap: 5px;
.column-list(5px);
width: 100%;
margin-top: 10px;
align-items: center;
.experience-row {
display: flex;

View file

@ -4,6 +4,7 @@
@import './actors/adversary/sidebar.less';
@import './actors/character/biography.less';
@import './actors/character/effects.less';
@import './actors/character/features.less';
@import './actors/character/header.less';
@import './actors/character/inventory.less';

View file

@ -20,3 +20,27 @@
@lightRules();
}
}
/**
* Apply a style to sidebar titles.
*/
.section-title() {
display: flex;
gap: 15px;
align-items: center;
h3 {
font-size: 20px;
}
}
/**
* Apply default item list style.
* @param {Length} @gap - The vertical spacing between elements (e.g., 10px, 1rem)
*/
.column-list(@gap: 10px) {
display: flex;
flex-direction: column;
gap: @gap;
align-items: center;
}