fix(mobile): increase font sizes and other mobile-centric improvements (#1907)

packages/web/src/javascripts/Components/NotesOptions/ChangeEditorOption.tsx

@@ -9,9 +9,16 @@ import Popover from '../Popover/Popover'
 type ChangeEditorOptionProps = {
   application: WebApplication
   note: SNNote
+  className: string
+  iconClassName: string
 }
 
-const ChangeEditorOption: FunctionComponent<ChangeEditorOptionProps> = ({ application, note }) => {
+const ChangeEditorOption: FunctionComponent<ChangeEditorOptionProps> = ({
+  application,
+  note,
+  className,
+  iconClassName,
+}) => {
   const [isOpen, setIsOpen] = useState(false)
   const menuContainerRef = useRef<HTMLDivElement>(null)
   const buttonRef = useRef<HTMLButtonElement>(null)
@@ -30,10 +37,10 @@ const ChangeEditorOption: FunctionComponent<ChangeEditorOptionProps> = ({ applic
           }
         }}
         ref={buttonRef}
-        className="flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-mobile-menu-item text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none md:text-menu-item"
+        className={className}
       >
         <div className="flex items-center">
-          <Icon type="dashboard" className="mr-2 text-neutral" />
+          <Icon type="dashboard" className={`${iconClassName} mr-2 text-neutral`} />
           Change note type
         </div>
         <Icon type="chevron-right" className="text-neutral" />