UX: add channel header offset to browse page height (#19030)

plugins/chat/assets/stylesheets/common/chat-browse.scss

@@ -1,6 +1,9 @@
 .chat-browse-view {
   position: relative;
-  height: calc(100vh - var(--header-offset));
+  height: calc(100vh - var(--header-offset) - var(--chat-header-offset));
+  padding-top: 1em;
+  padding-bottom: 41px;
+  box-sizing: border-box;
   overflow-y: scroll;
   @include chat-scrollbar(var(--secondary));
 
@@ -12,7 +15,6 @@
     display: flex;
     align-items: center;
     justify-content: flex-start;
-    margin-bottom: 1em;
 
     .new-channel-btn {
       margin-left: auto;
@@ -25,7 +27,7 @@
   }
 
   &__content_wrapper {
-    margin: 2rem 0 1rem 1rem;
+    margin: 2rem 0 0 1rem;
     box-sizing: border-box;
 
     @include breakpoint(tablet) {

plugins/chat/assets/stylesheets/common/common.scss

@@ -4,6 +4,7 @@ $float-height: 530px;
   --message-left-width: 42px;
   --full-page-border-radius: 12px;
   --full-page-sidebar-width: 275px;
+  --chat-header-offset: 65px;
 }
 
 .chat-message-move-to-channel-modal-modal {

plugins/chat/assets/stylesheets/desktop/desktop.scss

@@ -19,8 +19,8 @@
 
   .chat-full-page-header {
     padding: 0 1rem;
-    height: 65px;
-    min-height: 65px;
+    height: var(--chat-header-offset);
+    min-height: var(--chat-header-offset);
     flex-shrink: 0;
   }