p => Typography

web/apps/auth/src/pages/auth.tsx

@@ -126,7 +126,7 @@ const Page: React.FC = () => {
                             }}
                         >
                             {searchTerm.length > 0 ? (
-                                <p>{t("no_results")}</p>
+                                <Typography>{t("no_results")}</Typography>
                             ) : (
                                 <Typography color="text.muted">
                                     {t("no_codes_added_yet")}
@@ -409,7 +409,7 @@ const UnparseableCode: React.FC<UnparseableCodeProps> = ({
 const Footer: React.FC = () => {
     return (
         <Footer_>
-            <p>{t("AUTH_DOWNLOAD_MOBILE_APP")}</p>
+            <Typography>{t("AUTH_DOWNLOAD_MOBILE_APP")}</Typography>
             <a
                 href="https://github.com/ente-io/ente/tree/main/auth#-download"
                 download
@@ -421,9 +421,9 @@ const Footer: React.FC = () => {
 };
 
 const Footer_ = styled("div")`
-    margin-block-start: 2rem;
-    margin-block-end: 4rem;
+    margin-block: 4rem;
     display: flex;
+    gap: 1rem;
     flex-direction: column;
     align-items: center;
     justify-content: center;