Remove certain fieldsets and adjust scrollsbars

module/applications/sheets/actors/adversary.mjs

@@ -7,7 +7,7 @@ export default class AdversarySheet extends DHBaseActorSheet {
     /** @inheritDoc */
     static DEFAULT_OPTIONS = {
         classes: ['adversary'],
-        position: { width: 645, height: 760 },
+        position: { width: 645, height: 750 },
         window: { resizable: true },
         actions: {
             toggleHitPoints: AdversarySheet.#toggleHitPoints,

styles/less/global/elements.less

@@ -261,7 +261,7 @@
 
     fieldset {
         align-items: center;
-        margin-top: 5px;
+        margin: 5px 0 0 0;
         border-radius: 6px;
         border-color: @color-fieldset-border;
         padding-inline: 0.625rem;

styles/less/global/sheet.less

@@ -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;

styles/less/sheets/actors/actor-sheet-shared.less

@@ -39,6 +39,20 @@
 
     .window-header > .attribution-header-label {
         margin-right: var(--spacer-4);
+        pointer-events: none;
+    }
+
+    .tab-navigation {
+        margin-bottom: 0;
+    }
+
+    .tab {
+        flex: 1;
+        padding: 0;
+        overflow: hidden;
+        .search-section {
+            padding: 12px 14px var(--spacer-8) 12px;
+        }
     }
 
     .tab.inventory {
@@ -46,7 +60,7 @@
             display: grid;
             grid-template-columns: 1fr 1fr 1fr 1fr;
             gap: 10px;
-            padding: 10px 10px 0;
+            padding: var(--spacer-8) 16px var(--spacer-8) 16px;
 
             .input {
                 color: light-dark(@dark, @beige);
@@ -57,7 +71,6 @@
     .tab.notes.active {
         padding: 0;
         margin: 0;
-        margin-top: -10px; // will be removed once tab-navigation bottom margin is removed on all actor sheets
         scrollbar-gutter: unset;
 
         // Add padding around top level level prosemirrors used for note tabs

styles/less/sheets/actors/adversary/effects.less

@@ -7,9 +7,8 @@
             display: flex;
             flex-direction: column;
             gap: 10px;
-            overflow-y: auto;
+            padding: 7px calc(12px - var(--scrollbar-width)) 4px 12px;
-            padding-bottom: 20px;
+            .stable-scroll-container();
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/adversary/features.less

@@ -5,12 +5,8 @@
 .application.sheet.daggerheart.actor.dh-style.adversary {
     .tab.features {
         .feature-section {
-            display: flex;
+            padding: 16px calc(16px - var(--scrollbar-width)) 4px 16px;
-            flex-direction: column;
+            .stable-scroll-container();
-            gap: 10px;
-            overflow-y: auto;
-            padding-bottom: 20px;
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/adversary/sheet.less

@@ -30,9 +30,9 @@
         grid-row: 2;
         grid-column: 2;
         &.active {
-            overflow: hidden;
             display: flex;
             flex-direction: column;
+            margin: 0 0 10px 0;
         }
     }
 }

styles/less/sheets/actors/character/biography.less

@@ -9,16 +9,13 @@
             flex-direction: column;
             gap: 10px;
             height: 100%;            
-            overflow-y: auto;
+            padding: 12px calc(12px - var(--scrollbar-width)) 4px 12px;
-            padding-top: 8px;
+            .stable-scroll-container();
-            padding-bottom: 20px;
-            height: 100%;
-            .with-scroll-shadows();
         }
 
         .characteristics-section {
             gap: 20px;
-            padding: 0 10px;
+            padding: 0 4px;
         }
 
         .biography-section {

styles/less/sheets/actors/character/effects.less

@@ -8,9 +8,8 @@
             display: flex;
             flex-direction: column;
             gap: 10px;
-            overflow-y: auto;
+            padding: 7px calc(12px - var(--scrollbar-width)) 4px 12px;
-            padding-bottom: 20px;
+            .stable-scroll-container();
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/character/features.less

@@ -8,9 +8,8 @@
             display: flex;
             flex-direction: column;
             gap: 10px;
-            overflow-y: auto;
+            padding: 7px calc(12px - var(--scrollbar-width)) 4px 12px;
-            padding-bottom: 20px;
+            .stable-scroll-container();
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/character/header.less

@@ -19,16 +19,19 @@
 
 .application.sheet.daggerheart.actor.dh-style.character {
     .character-header-sheet {
-        padding: 0 15px;
         padding-top: var(--header-height);
         width: 100%;
 
+        > *:not(line-div, .tab-navigation) {
+            padding-left: 15px;
+            padding-right: 15px;
+        }
+
         .name-row {
             display: flex;
             gap: 6px;
             align-items: start;
             justify-content: space-between;
-            padding: 0;
             padding-top: 5px;
             flex: 1;
 
@@ -100,8 +103,8 @@
         .character-details {
             display: flex;
             justify-content: space-between;
-            padding: 5px 0;
+            margin-top: 5px;
-            margin-bottom: 8px;
+            margin-bottom: 10px;
             font-size: var(--font-size-12);
             color: @color-text-emphatic;
 
@@ -130,7 +133,6 @@
         .character-row {
             display: flex;
             align-items: center;
-            padding: 0;
             margin-bottom: 12px;
 
             .resource-section {
@@ -218,12 +220,11 @@
 
         .character-traits {
             display: flex;
-            padding: 0;
             margin-bottom: 15px;
             justify-content: space-between;
             max-width: 38.5rem;
             gap: 0.5rem;
-            padding-left: 0.5rem;
+            margin-left: 0.5rem;
 
             .trait {
                 cursor: pointer;
@@ -325,5 +326,9 @@
                 }
             }
         }
+
+        .tab-navigation button[data-action="openSettings"] {
+            margin-right: 12px;
+        }
     }
 }

styles/less/sheets/actors/character/index.less

@@ -1,8 +1,8 @@
+@import './sheet.less';
 @import './biography.less';
 @import './effects.less';
 @import './features.less';
 @import './header.less';
 @import './inventory.less';
 @import './loadout.less';
-@import './sheet.less';
 @import './sidebar.less';

styles/less/sheets/actors/character/inventory.less

@@ -8,10 +8,8 @@
             display: flex;
             flex-direction: column;
             gap: 10px;            
-            overflow-y: auto;
+            padding: 8px calc(12px - var(--scrollbar-width)) 4px 12px;
-            margin-top: 20px;
+            .stable-scroll-container();
-            padding-bottom: 20px;
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/character/loadout.less

@@ -50,11 +50,8 @@
             display: flex;
             flex-direction: column;
             gap: 10px;
-            height: 100%;
+            padding: 8px calc(12px - var(--scrollbar-width)) 4px 12px;
-            overflow-y: auto;
+            .stable-scroll-container();
-            margin-top: 20px;
-            padding-bottom: 20px;
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/character/sheet.less

@@ -30,7 +30,7 @@
             &.active {
                 display: flex;
                 flex-direction: column;
-                overflow: hidden;
+                margin: 0 0 10px 0;
             }
         }
     }

styles/less/sheets/actors/companion/details.less

@@ -1,7 +1,10 @@
 @import '../../../utils/colors.less';
 @import '../../../utils/fonts.less';
 
-.application.sheet.daggerheart.actor.dh-style.companion {
+.application.sheet.daggerheart.actor.dh-style.companion .tab.details.active {
+    padding: 12px calc(12px - var(--scrollbar-width)) 4px 12px;
+    .stable-scroll-container();
+
     .partner-section,
     .attack-section,
     .experience-list {

styles/less/sheets/actors/companion/effects.less

@@ -6,9 +6,8 @@
             display: flex;
             flex-direction: column;
             gap: 10px;
-            overflow-y: auto;
+            padding: 7px calc(12px - var(--scrollbar-width)) 4px 12px;
-            padding-bottom: 20px;
+            .stable-scroll-container();
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/environment/features.less

@@ -5,12 +5,8 @@
 .application.sheet.daggerheart.actor.dh-style.environment {
     .tab.features {
         .feature-section {
-            display: flex;
+            padding: 16px calc(16px - var(--scrollbar-width)) 4px 16px;
-            flex-direction: column;
+            .stable-scroll-container();
-            gap: 10px;
-            overflow-y: auto;
-            padding-bottom: 4px;
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/environment/index.less

@@ -1,4 +1,4 @@
+@import './sheet.less';
 @import './features.less';
 @import './header.less';
 @import './potentialAdversaries.less';
-@import './sheet.less';

styles/less/sheets/actors/environment/potentialAdversaries.less

@@ -6,9 +6,8 @@
             display: flex;
             flex-direction: column;
             gap: 10px;
-            overflow-y: auto;
+            padding: 7px calc(12px - var(--scrollbar-width)) 4px 12px;
-            padding-bottom: 4px;
+            .stable-scroll-container();
-            .with-scroll-shadows();
         }
     }
 }

styles/less/sheets/actors/environment/sheet.less

@@ -14,9 +14,7 @@
 
 .application.sheet.daggerheart.actor.dh-style.environment {
     .tab {
-        flex: 1;
         overflow-y: auto;
-
         &.active {
             overflow: hidden;
             display: flex;

styles/less/sheets/actors/party/party-members.less

@@ -3,7 +3,8 @@
 @import '../../../utils/mixin.less';
 
 .application.sheet.daggerheart.actor.dh-style.party .tab.partyMembers {
-    overflow: auto;
+    padding: 12px calc(12px - var(--scrollbar-width)) 4px 12px;
+    .stable-scroll-container();
 
     .actions-section {
         display: flex;

styles/less/sheets/actors/party/sheet.less

@@ -17,15 +17,8 @@
 });
 
 .application.sheet.daggerheart.actor.dh-style.party {
-    .tab {
+    .tab.active {
-        flex: 1;
+        display: flex;
-        overflow-y: auto;
+        flex-direction: column;
-        scrollbar-gutter: stable;
-
-        &.active {
-            overflow: auto;
-            display: flex;
-            flex-direction: column;
-        }
     }
 }

styles/less/utils/mixin.less

@@ -174,10 +174,10 @@
             --fade-start: 0;
         }
         10%, 100% {
-            --fade-start: 12px;
+            --fade-start: 14px;
         }
         0%, 90% {
-            --fade-end: 12px;
+            --fade-end: 14px;
         }
         100% {
             --fade-end: 0;
@@ -198,3 +198,9 @@
         transparent 100%
     );
 }
+
+.stable-scroll-container() {
+    overflow-y: auto;
+    scrollbar-gutter: stable;
+    .with-scroll-shadows();
+}

templates/sheets/actors/adversary/features.hbs

@@ -1,14 +1,15 @@
 <section class='tab {{tabs.features.cssClass}} {{tabs.features.id}}' data-tab='{{tabs.features.id}}'
     data-group='{{tabs.features.group}}'>
-    <div class="feature-section">
+    <div class="feature-section items-list">
-        {{> 'daggerheart.inventory-items'
+        {{#each @root.features as |item|}}
-            title=tabs.features.label
+            {{> "daggerheart.inventory-item"
-            type='feature'
+                item=item
-            collection=@root.features
+                type="feature"
-            hideContextMenu=true
+                actorType=@root.document.type
-            hideModifyControls=true
+                hideContextMenu=true
-            canCreate=@root.editable
+                hideModifyControls=true
-            showActions=@root.editable
+                showActions=@root.editable
-        }}
+            }}
+        {{/each}}
     </div>
 </section>

templates/sheets/actors/character/header.hbs

@@ -79,8 +79,6 @@
                 {{/if}}
             </div>
         {{/if}}
-
-
     </div>
 
     <div class="character-row">

templates/sheets/actors/environment/features.hbs

@@ -3,15 +3,16 @@
     data-tab='{{tabs.features.id}}'
     data-group='{{tabs.features.group}}'
 >
-    <div class="feature-section">
+    <div class="feature-section items-list">
-        {{> 'daggerheart.inventory-items'
+        {{#each @root.features as |item|}}
-        title=tabs.features.label
+            {{> "daggerheart.inventory-item"
-        type='feature'
+                item=item
-        collection=@root.features
+                type="feature"
-        hideContextMenu=true
+                actorType=@root.document.type
-        hideModifyControls=true
+                hideContextMenu=true
-        canCreate=@root.editable
+                hideModifyControls=true
-        showActions=@root.editable
+                showActions=@root.editable
-        }}
+            }}
+        {{/each}}
     </div>
 </section>