Fix/scrollbar position on publish flow (#606)

* fix: fix scrollbar position

* fix: update width

* fix: update media query

src/components/Publish/Navigation/index.module.css

@@ -1,10 +1,11 @@
 .navigation {
   margin: -1.3rem calc(var(--spacer) / -1.5) var(--spacer)
     calc(var(--spacer) / -1.5);
-  padding: calc(var(--spacer) / 2) 0;
   scrollbar-width: none;
   border-bottom: 1px solid var(--border-color);
   background-color: var(--background-highlight);
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
 }
 
 @media (min-width: 40rem) {
@@ -15,26 +16,29 @@
   }
 }
 
-@media (min-width: 60rem) {
-  .navigation {
-    padding: var(--spacer) 0;
-    margin-left: calc(var(--spacer) * -4);
-    margin-right: calc(var(--spacer) * -4);
-  }
-}
-
 .navigation ol {
   white-space: nowrap;
   text-align: center;
   width: 100%;
-  padding: 0;
+  padding: calc(var(--spacer) / 2) 0;
   margin: 0;
   counter-reset: list-number;
-  overflow-x: auto;
+  overflow-x: visible;
   overflow-y: hidden;
   -webkit-overflow-scrolling: touch;
 }
 
+@media (min-width: 60rem) {
+  .navigation {
+    margin-left: calc(var(--spacer) * -4);
+    margin-right: calc(var(--spacer) * -4);
+  }
+
+  .navigation ol {
+    padding: var(--spacer) 0;
+  }
+}
+
 .navigation li {
   cursor: pointer;
   display: inline-block;