fix(docs-infra): use a fixed top-menu on marketing pages as well (#41051)
Previously, in contrast to docs pages, marketing pages had a non-fixed top-menu, which meant that the top-menu would scroll out of the viewport along with the rest of the content. This had a couple of downsides: - The UI was different between pages (i.e. different top-menu behavior on docs vs marketing pages). - Since some of the marketing pages are long, it was not easy for people to navigate to a different page (i.e. they had to scroll all the way back up). This commit improves the UX by using the same, fixed top-menu on all pages, which restores consistency and allows the user to navigate around more easily. NOTE: The old behavior (non-fixed top-menu) is kept on the homepage, since its top-menu design in a little different than other pages (e.g. it uses a transparent top-menu) and would not play well with a fixed top-menu. PR Close #41051
This commit is contained in:
parent
7944ee2c30
commit
27bb6f6a04
|
@ -20,21 +20,13 @@ mat-toolbar.app-toolbar {
|
||||||
@media (min-width: 481px) {
|
@media (min-width: 481px) {
|
||||||
&:not(.transitioning) {
|
&:not(.transitioning) {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
position: absolute;
|
||||||
transition: background-color 0.2s linear;
|
transition: background-color 0.2s linear;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// MARKETING PAGES OVERRIDE: TOPNAV TOOLBAR AND HAMBURGER
|
|
||||||
@include marketing-pages($nestParentSelector: true) {
|
|
||||||
box-shadow: none;
|
|
||||||
|
|
||||||
// FIXED TOPNAV TOOLBAR FOR SMALL MOBILE
|
|
||||||
@media (min-width: 481px) {
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// DOCS PAGES OVERRIDE: HAMBURGER
|
// DOCS PAGES OVERRIDE: HAMBURGER
|
||||||
@include docs-pages($nestParentSelector: true) {
|
@include docs-pages($nestParentSelector: true) {
|
||||||
@media (min-width: $showTopMenuWidth) {
|
@media (min-width: $showTopMenuWidth) {
|
||||||
|
|
Loading…
Reference in New Issue