mobile: fix styles in editor

packages/editor-mobile/public/index.html

@@ -34,7 +34,11 @@
       }
 
       .ProseMirror > :first-child {
-        margin-top: 0.4em !important;
+        margin-top: 5px !important;
+      }
+
+      .ProseMirror:first-child {
+        margin-top: 0px !important;
       }
 
       #root {

packages/editor-mobile/src/components/editor.tsx

@@ -580,7 +580,8 @@ const Tiptap = ({
                   display: "flex",
                   alignItems: "center",
                   padding: "0px 16px",
-                  paddingBottom: "6px"
+                  paddingBottom: "3px",
+                  boxSizing: "border-box"
                 }}
               >
                 <StatusBar

packages/editor-mobile/src/components/statusbar.tsx

@@ -77,26 +77,19 @@ function StatusBar({
     fontSize: 12,
     color: "var(--nn_secondary_paragraph)",
     paddingBottom: 0,
+    fontFamily: "Inter",
     userSelect: "none"
   };
 
   return (
-    <div
-      style={{
-        display: "flex",
-        height: "25px",
-        alignItems: "center"
+    <p
+      onMouseDown={(e) => {
+        setShowChars(!showChars);
       }}
+      style={paragraphStyle}
     >
-      <p
-        onMouseDown={(e) => {
-          setShowChars(!showChars);
-        }}
-        style={paragraphStyle}
-      >
-        {showChars ? strings.charactersCount(chars) : words}
-      </p>
-    </div>
+      {showChars ? strings.charactersCount(chars) : words}
+    </p>
   );
 }
 

packages/editor-mobile/src/components/tags.tsx

@@ -55,7 +55,6 @@ function Tags(props: { settings: Settings; loading?: boolean }) {
       style={{
         display: "flex",
         alignItems: "center",
-        minHeight: "25px",
         opacity: props.loading ? 0 : 1,
         gap: 6
       }}