From b5801af9a8a87c03636133f98c2f09f453eb3765 Mon Sep 17 00:00:00 2001
From: Scott Wilson <scottraywilson@gmail.com>
Date: Mon, 30 Jun 2025 18:32:36 -0700
Subject: [PATCH] improvements: address feedback

---
 .../components/SecretApprovalRequestAction.tsx                | 4 ++--
 .../components/SecretApprovalRequestChanges.tsx               | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestAction.tsx b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestAction.tsx
index 4853f7cae..58b707b04 100644
--- a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestAction.tsx
+++ b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestAction.tsx
@@ -103,7 +103,7 @@ export const SecretApprovalRequestAction = ({
   if (!hasMerged && status === "open") {
     return (
       <div className="flex w-full flex-col items-start justify-between py-4 text-mineshaft-100 transition-all">
-        <div className="flex w-full items-center justify-between">
+        <div className="flex w-full flex-col justify-between xl:flex-row xl:items-center">
           <div className="mr-auto flex items-center space-x-4 px-4">
             <div
               className={`flex items-center justify-center rounded-full ${isMergable ? "h-8 w-8 bg-green" : "h-10 w-10 bg-red-600"}`}
@@ -126,7 +126,7 @@ export const SecretApprovalRequestAction = ({
               )}
             </span>
           </div>
-          <div className="flex items-center justify-end space-x-2 px-4">
+          <div className="mt-4 flex items-center justify-end space-x-2 px-4 xl:mt-0">
             {canApprove || isSoftEnforcement ? (
               <div className="flex items-center space-x-4">
                 <Button
diff --git a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx
index 697ff05ea..d6931abb1 100644
--- a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx
+++ b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx
@@ -224,8 +224,8 @@ export const SecretApprovalRequestChanges = ({
   const hasMerged = secretApprovalRequestDetails?.hasMerged;
 
   return (
-    <div className="flex space-x-6">
-      <div className="max-w-[calc(100%-17rem)] flex-1">
+    <div className="flex flex-col space-x-6 lg:flex-row">
+      <div className="flex-1 lg:max-w-[calc(100%-17rem)]">
         <div className="sticky top-0 z-20 flex items-center space-x-4 bg-bunker-800 pb-6 pt-2">
           <IconButton variant="outline_bg" ariaLabel="go-back" onClick={onGoBack}>
             <FontAwesomeIcon icon={faArrowLeft} />