Fixed header style on the editor page

src/components/Nav/Header/Header.module.scss

@@ -95,9 +95,7 @@
 
 .usernav {
   display: inline-flex;
-  flex: 0 0 40% !important;
   font-weight: 500;
-  max-width: 400px !important;
   position: relative;
 
   @include media-breakpoint-down(md) {
@@ -105,6 +103,11 @@
     max-width: 100% !important;
     padding: 0 !important;
   }
+
+  &:not(.usernavEditor) {
+    flex: 0 0 40% !important;
+    max-width: 400px !important;
+  }
 }
 
 .mainNavigationWrapper {

src/components/Nav/HeaderAuth.tsx

@@ -107,7 +107,7 @@ export const HeaderAuth = (props: Props) => {
   return (
     <ShowOnlyOnClient>
       <Show when={isSessionLoaded()} keyed={true}>
-        <div class={clsx(styles.usernav, 'col')}>
+        <div class={clsx(styles.usernav, 'col')} classList={{ [styles.usernavEditor]: showSaveButton() }}>
           <div class={clsx(styles.userControl, styles.userControl, 'col')}>
             <Show when={showCreatePostButton()}>
               <div class={clsx(styles.userControlItem, styles.userControlItemVerbose)}>