From 33ba3e31ed91aea8cbc8ff534e6ca539c89b90ed Mon Sep 17 00:00:00 2001 From: George Kalpakas Date: Thu, 8 Jun 2017 10:49:54 +0300 Subject: [PATCH] fix(aio): smoother transition from page with SideNav to homepage (#17312) When navigating from a page with open SideNav to a page without closed SideNav, the main content area animates from a non-zero left margin to zero left margin. Additionally, the top-bar on the homepage is transparent, which allows the white background behind the main content to be seen while the left margin is animated to zero, making it appear as if something (e.g. the SideNav covers the top-bar). This commit works around this issue, by not making the top-bar transparent immediately when navigating to the homepage, but animating it from its blue color to transparent with a delay. Fixes #17248 --- aio/src/styles/1-layouts/_top-menu.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/aio/src/styles/1-layouts/_top-menu.scss b/aio/src/styles/1-layouts/_top-menu.scss index 84580770ef..d40c20d730 100644 --- a/aio/src/styles/1-layouts/_top-menu.scss +++ b/aio/src/styles/1-layouts/_top-menu.scss @@ -53,6 +53,7 @@ aio-top-menu { // HOME PAGE OVERRIDE: TOPNAV TOOLBAR HAMBURGER MENU aio-shell.page-home md-toolbar.app-toolbar.mat-toolbar { background-color: transparent; + transition: background-color .2s linear .3s; @media (max-width: 480px) { background-color: $blue;