From f591f6d4287e1dd90d72a1316c00048469960e02 Mon Sep 17 00:00:00 2001
From: Vladyslav Matsiiako <matsiiako@gmail.com>
Date: Sun, 7 Jul 2024 08:49:05 -0700
Subject: [PATCH 1/2] update mobile view

---
 .../ShareSecretPage/components/AddShareSecretForm.tsx     | 8 ++++----
 .../views/ShareSecretPublicPage/ShareSecretPublicPage.tsx | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/frontend/src/views/ShareSecretPage/components/AddShareSecretForm.tsx b/frontend/src/views/ShareSecretPage/components/AddShareSecretForm.tsx
index a2f978b21..4e950dc3f 100644
--- a/frontend/src/views/ShareSecretPage/components/AddShareSecretForm.tsx
+++ b/frontend/src/views/ShareSecretPage/components/AddShareSecretForm.tsx
@@ -118,7 +118,7 @@ export const AddShareSecretForm = ({
     }
   };
   return (
-    <form className="flex w-full flex-col items-center" onSubmit={handleSubmit(onFormSubmit)}>
+    <form className="flex w-full flex-col items-center px-4 sm:px-0" onSubmit={handleSubmit(onFormSubmit)}>
       <div
         className={`w-full ${!inModal && "rounded-md border border-mineshaft-600 bg-mineshaft-800 p-6"}`}
       >
@@ -143,7 +143,7 @@ export const AddShareSecretForm = ({
             )}
           />
         </div>
-        <div className="flex w-full flex-row justify-start">
+        <div className="flex w-full flex-col md:flex-row justify-start">
           <div className="flex justify-start">
             <div className="flex justify-start">
               <div className="flex w-full justify-center pr-2">
@@ -188,10 +188,10 @@ export const AddShareSecretForm = ({
               </div>
             </div>
           </div>
-          <div className="sm:w-1/7 mx-auto hidden items-center justify-center px-6 sm:flex">
+          <div className="sm:w-1/7 mx-auto items-center justify-center px-6 hidden md:flex">
             <p className="px-4 mt-2 text-sm text-gray-400">AND</p>
           </div>
-          <div className="flex items-center pt-2">
+          <div className="items-center pb-4 md:pb-0 md:pt-2 flex">
             <Controller
               control={control}
               name="expiresAfterViews"
diff --git a/frontend/src/views/ShareSecretPublicPage/ShareSecretPublicPage.tsx b/frontend/src/views/ShareSecretPublicPage/ShareSecretPublicPage.tsx
index f707e0011..a20fd684c 100644
--- a/frontend/src/views/ShareSecretPublicPage/ShareSecretPublicPage.tsx
+++ b/frontend/src/views/ShareSecretPublicPage/ShareSecretPublicPage.tsx
@@ -125,7 +125,7 @@ export const ShareSecretPublicPage = ({ isNewSession }: { isNewSession: boolean
           <div className="m-auto my-6 flex w-full max-w-xl justify-center px-8 px-4 sm:my-8">
             <div className="w-full border-t border-mineshaft-600" />
           </div>
-          <div className="flex flex-col justify-center items-center m-auto max-w-2xl px-6">
+          <div className="flex flex-col justify-center items-center m-auto max-w-2xl px-4 sm:px-6">
             <div className="m-auto mb-12 flex flex max-w-2xl w-full flex-col justify-center rounded-md border border-primary-500/30 bg-primary/5 p-6 pt-5">
               <p className="pb-2 font-semibold text-mineshaft-100 md:pb-3 text-lg md:text-xl w-full">
                 Open source <span className="bg-clip-text text-transparent bg-gradient-to-tr from-yellow-500 to-primary-500">secret management</span> for developers

From 98ef1614c6d601c5a541d40ea544baeee4760227 Mon Sep 17 00:00:00 2001
From: Vladyslav Matsiiako <matsiiako@gmail.com>
Date: Sun, 7 Jul 2024 08:52:02 -0700
Subject: [PATCH 2/2] update mobile view

---
 .../src/views/ShareSecretPublicPage/components/SecretTable.tsx  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/views/ShareSecretPublicPage/components/SecretTable.tsx b/frontend/src/views/ShareSecretPublicPage/components/SecretTable.tsx
index 6f393ef01..2d405f118 100644
--- a/frontend/src/views/ShareSecretPublicPage/components/SecretTable.tsx
+++ b/frontend/src/views/ShareSecretPublicPage/components/SecretTable.tsx
@@ -26,7 +26,7 @@ export const SecretTable = ({
       </Tr>
     )}
     {!isLoading && decryptedSecret && (
-      <div className="dark relative flex h-full w-full items-center overflow-y-auto border border-mineshaft-700 bg-mineshaft-900 rounded-md p-3 pr-2">
+      <div className="dark relative flex h-full w-full items-center overflow-y-auto border border-mineshaft-700 bg-mineshaft-900 rounded-md p-2 md:p-3 pr-2">
         <div className="thin-scrollbar flex h-full max-h-44 w-full flex-1 overflow-y-scroll break-words pr-4 dark:[color-scheme:dark]">
           <div className="align-center flex w-full min-w-full whitespace-pre-line">
             {decryptedSecret}