diff --git a/core/src/components/header/header.utils.ts b/core/src/components/header/header.utils.ts index 9f93299c40..c5dd7c6ee9 100644 --- a/core/src/components/header/header.utils.ts +++ b/core/src/components/header/header.utils.ts @@ -60,7 +60,7 @@ export const handleContentScroll = (scrollEl: HTMLElement, scrollHeaderIndex: He }); }; -export const setToolbarBackgroundOpacity = (toolbar: ToolbarIndex, opacity: number | undefined) => { +export const setToolbarBackgroundOpacity = (toolbar: ToolbarIndex, opacity?: number) => { if (opacity === undefined) { toolbar.background.style.removeProperty('--opacity'); } else { @@ -117,7 +117,7 @@ export const handleToolbarIntersection = (ev: any, mainHeaderIndex: HeaderIndex, if (hasValidIntersection) { setHeaderActive(mainHeaderIndex); setHeaderActive(scrollHeaderIndex, false); - setToolbarBackgroundOpacity(mainHeaderIndex.toolbars[0], 1); + setToolbarBackgroundOpacity(mainHeaderIndex.toolbars[0]); } } }); diff --git a/core/src/components/toolbar/test/title/index.html b/core/src/components/toolbar/test/title/index.html index db542b65ed..a8fd544740 100644 --- a/core/src/components/toolbar/test/title/index.html +++ b/core/src/components/toolbar/test/title/index.html @@ -30,6 +30,10 @@ .create ion-icon { transform: scale(0.9); } + + .main-toolbar { + --background: rgba(0, 0, 0, 0.05); + } @@ -77,8 +81,8 @@ connectedCallback() { this.innerHTML = ` - - + + @@ -89,7 +93,7 @@ - + Page Two