fix scrolling in armour

This commit is contained in:
psitacus 2025-07-07 21:45:41 -06:00
parent 87b3677956
commit b0cdd4dce9
3 changed files with 114 additions and 0 deletions

View file

@ -4,6 +4,7 @@ export default class ArmorSheet extends DHBaseItemSheet {
/**@inheritdoc */
static DEFAULT_OPTIONS = {
classes: ['armor'],
window: { resizable: true },
dragDrop: [{ dragSelector: null, dropSelector: null }],
tagifyConfigs: [
{

View file

@ -1897,6 +1897,60 @@ fieldset.daggerheart.chat .daggerheart.chat {
.daggerheart.sheet.class .class-feature button {
width: 40px;
}
.daggerheart.sheet.armor .window-content {
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
overflow: auto;
/* Allow outer scrolling when content is too large */
}
.daggerheart.sheet.armor .item-sheet-header {
flex-shrink: 0;
/* Keep header visible */
}
.daggerheart.sheet.armor .tab-navigation {
flex-shrink: 0;
/* Don't shrink the navigation */
}
.daggerheart.sheet.armor .tab {
flex: 1;
min-height: 0;
/* Allow the tab to shrink */
display: none;
/* Hide all tabs by default */
}
.daggerheart.sheet.armor .tab.active {
display: flex;
flex-direction: column;
overflow: hidden;
/* Let the inner container handle scrolling */
}
.daggerheart.sheet.armor .tab fieldset {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.daggerheart.sheet.armor .tab fieldset legend {
flex-shrink: 0;
/* Keep legend visible */
}
.daggerheart.sheet.armor .tab fieldset .actions-list {
flex: 1;
overflow-y: auto;
min-height: 0;
scrollbar-width: thin;
scrollbar-color: light-dark(#18162e, #f3c267) transparent;
}
.daggerheart.sheet.armor .tab fieldset.two-columns,
.daggerheart.sheet.armor .tab fieldset.one-column {
flex: 1;
overflow-y: auto;
min-height: 0;
scrollbar-width: thin;
scrollbar-color: light-dark(#18162e, #f3c267) transparent;
}
.daggerheart.sheet .domain-card-description .editor {
height: 300px;
}

View file

@ -29,6 +29,65 @@
}
}
&.armor {
.window-content {
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
overflow: auto; /* Allow outer scrolling when content is too large */
}
.item-sheet-header {
flex-shrink: 0; /* Keep header visible */
}
.tab-navigation {
flex-shrink: 0; /* Don't shrink the navigation */
}
.tab {
flex: 1;
min-height: 0; /* Allow the tab to shrink */
display: none; /* Hide all tabs by default */
// Only show the active tab
&.active {
display: flex;
flex-direction: column;
overflow: hidden; /* Let the inner container handle scrolling */
}
fieldset {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
legend {
flex-shrink: 0; /* Keep legend visible */
}
.actions-list {
flex: 1;
overflow-y: auto;
min-height: 0;
scrollbar-width: thin;
scrollbar-color: light-dark(#18162e, #f3c267) transparent;
}
&.two-columns,
&.one-column {
flex: 1;
overflow-y: auto;
min-height: 0;
scrollbar-width: thin;
scrollbar-color: light-dark(#18162e, #f3c267) transparent;
}
}
}
}
.domain-card-description {
.editor {
height: 300px;