From 8e11f79fcca94a9c50ccc7e18e0fe44ef9764b1d Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Tue, 14 Jan 2020 11:40:35 -0500 Subject: [PATCH] fix(header): header opacity properly resets on collapsible titles (#20202) --- core/src/components/header/header.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/core/src/components/header/header.tsx b/core/src/components/header/header.tsx index 290d32e798..4b22f0d157 100644 --- a/core/src/components/header/header.tsx +++ b/core/src/components/header/header.tsx @@ -116,7 +116,9 @@ export class Header implements ComponentInterface { * border as the top-most toolbar collapses or expands. */ const toolbarIntersection = (ev: any) => { handleToolbarIntersection(ev, mainHeaderIndex, scrollHeaderIndex); }; - this.intersectionObserver = new IntersectionObserver(toolbarIntersection, { threshold: [0.25, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1], rootMargin: `-${mainHeaderHeight}px 0px 0px 0px` }); + + // Subtracting 1 pixel gives us some wiggle room for ensuring everything is reset in different edge cases + this.intersectionObserver = new IntersectionObserver(toolbarIntersection, { threshold: [0.25, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1], rootMargin: `-${mainHeaderHeight - 1}px 0px 0px 0px` }); this.intersectionObserver.observe(scrollHeaderIndex.toolbars[scrollHeaderIndex.toolbars.length - 1].el); /**