message: docs(docs-infra): fix topnav layout for smaller screens
  PR Close
diff: @@ -64,18 +64,22 @@ aio-shell.folder-tutorial mat-toolbar.mat-toolbar {
  margin: $hamburgerShownMargin;
  padding: 0;
  - &:not(.starting) {
  - transition-duration: 0.4s;
  - transition-property: color, margin;
  - transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  - }
  -
  @media (min-width: 992px) {
  // Hamburger hidden by default on large screens.
  // (Will be shown per doc.)
  margin: $hamburgerHiddenMargin;
  }
  + @media (max-width: 480px) {
  + min-width: 15%;
  + }
  +
  + &:not(.starting) {
  + transition-duration: 0.4s;
  + transition-property: color, margin;
  + transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  + }
  +
  &:hover {
  color: $offwhite;
  }
  @@ -92,6 +96,10 @@ aio-shell.folder-tutorial mat-toolbar.mat-toolbar {
  margin: 0 16px 0 0;
  padding: 21px 0;
  + @media screen and (max-width: 480px) {
  + margin-right: 8px;
  + }
  +
  img {
  position: relative;
  margin-top: -21px;
  @@ -194,12 +202,17 @@ aio-search-box.search-container {
  .toolbar-external-icons-container {
  display: flex;
  flex-direction: row;
  + height: 100%;
  a {
  display: flex;
  align-items: center;
  margin-left: 16px;
  + @media screen and (max-width: 480px) {
  + margin-left: 8px;
  + }
  +
  &:hover {
  opacity: 0.8;
  }
  