Fix jumpyness

plausible · Jan 28, 2025 · 5cc073b · 5cc073b
1 parent b5d7d22
commit 5cc073b
Showing 1 changed file with 18 additions and 10 deletions.
diff --git a/assets/js/dashboard/nav-menu/filters-bar.tsx b/assets/js/dashboard/nav-menu/filters-bar.tsx
@@ -165,17 +165,25 @@ export const FiltersBar = ({ elements }: FiltersBarProps) => {
       )}
       ref={containerRef}
     >
-      <AppliedFilterPillsList
-        ref={pillsRef}
-        direction="horizontal"
-        slice={{
-          type: 'invisible-outside',
-          start: 0,
-          end: visibility?.visibleCount
+      <div
+        style={{
+          marginTop: -BUFFER_FOR_SHADOW_PX,
+          marginBottom: -BUFFER_FOR_SHADOW_PX
         }}
-        className="overflow-hidden"
-        style={{ width: visibility?.width ?? '100%' }}
-      />
+        className="flex items-center"
+      >
+        <AppliedFilterPillsList
+          ref={pillsRef}
+          direction="horizontal"
+          slice={{
+            type: 'invisible-outside',
+            start: 0,
+            end: visibility?.visibleCount
+          }}
+          className="overflow-hidden"
+          style={{ width: visibility?.width ?? '100%' }}
+        />
+      </div>
       {visibility !== null &&
         (query.filters.length !== visibility.visibleCount || canClear) && (
           <ToggleDropdownButton