discourse/plugins/chat/assets/stylesheets/mobile/chat-navbar.scss

.c-navbar {
  gap: 0.75rem;
  &-container {
    max-width: 100vw;
    padding-inline: 0.25rem;
  }
  &__actions {
    margin-right: 0.5rem;
  }
  &__back-button {
    align-self: stretch;
  }

  .c-navbar__title {
    .c-routes-direct-messages &,
    .c-routes-channels &,
    .c-routes-threads & {
      padding-left: 1.25rem;
    }
  }
}
UX: chat navbar > alignments part 2 (#24985) * UX: chat navbar > alignments part 2 * Change copy to be consistent My threads * Dont show back button on full page desktop 2023-12-20 23:24:10 +08:00			`.c-navbar {`
UX: chat header size and alignments (#25239) This commit: - increased the size of chat-header-offset from 46px to 56px on mobile - tweaked navbar padding - Increased the gap between back button and title; this means no more perfect alignment, but I think that's perfectly fine and a fair trade off for an easier click target for the back button without fear of hitting the title 2024-01-12 21:27:44 +08:00			`gap: 0.75rem;`
UX: chat navbar > alignments part 2 (#24985) * UX: chat navbar > alignments part 2 * Change copy to be consistent My threads * Dont show back button on full page desktop 2023-12-20 23:24:10 +08:00			`&-container {`
UX: add max width for c-navbar on mobile to prevent horizontal scroll (#25182) 2024-01-09 20:18:05 +08:00			`max-width: 100vw;`
UX: chat navbar > alignments part 2 (#24985) * UX: chat navbar > alignments part 2 * Change copy to be consistent My threads * Dont show back button on full page desktop 2023-12-20 23:24:10 +08:00			`padding-inline: 0.25rem;`
			`}`
FEATURE: Mobile Chat Footer Redesign (#25161) This update adds three tabs to the bottom of the chat overlay to make it easier for users to navigate chat on mobile. As a result of this change: - Direct Messages are now shown separately from public channels on mobile - My Threads has now moved from the channel list to it's own tab on mobile - My Threads can still be accessed on desktop via the sidebar and within the drawer channel list - Chat back button has been updated to navigate to the correct tab (for both channels and threads) Some special cases: - If DMs are not used then the tab is not rendered - If the user has no threads then the tab is not rendered - If both the tabs for DMs and Threads aren't available then the whole footer will not be rendered - Chat footer is only shown on the listing pages (DMs, Channels, My Threads) --------- Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com> Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com> 2024-01-16 14:29:33 +08:00			`&__actions {`
			`margin-right: 0.5rem;`
			`}`
UX: chat header size and alignments (#25239) This commit: - increased the size of chat-header-offset from 46px to 56px on mobile - tweaked navbar padding - Increased the gap between back button and title; this means no more perfect alignment, but I think that's perfectly fine and a fair trade off for an easier click target for the back button without fear of hitting the title 2024-01-12 21:27:44 +08:00			`&__back-button {`
			`align-self: stretch;`
			`}`
FEATURE: Mobile Chat Footer Redesign (#25161) This update adds three tabs to the bottom of the chat overlay to make it easier for users to navigate chat on mobile. As a result of this change: - Direct Messages are now shown separately from public channels on mobile - My Threads has now moved from the channel list to it's own tab on mobile - My Threads can still be accessed on desktop via the sidebar and within the drawer channel list - Chat back button has been updated to navigate to the correct tab (for both channels and threads) Some special cases: - If DMs are not used then the tab is not rendered - If the user has no threads then the tab is not rendered - If both the tabs for DMs and Threads aren't available then the whole footer will not be rendered - Chat footer is only shown on the listing pages (DMs, Channels, My Threads) --------- Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com> Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com> 2024-01-16 14:29:33 +08:00
			`.c-navbar__title {`
			`.c-routes-direct-messages &,`
			`.c-routes-channels &,`
			`.c-routes-threads & {`
			`padding-left: 1.25rem;`
			`}`
			`}`
UX: chat navbar > alignments part 2 (#24985) * UX: chat navbar > alignments part 2 * Change copy to be consistent My threads * Dont show back button on full page desktop 2023-12-20 23:24:10 +08:00			`}`