From 8317e0156853ff094210a266a24c352dd81f5273 Mon Sep 17 00:00:00 2001
From: Vadym Samoilenko <vadymsamoilenko@oliver.agency>
Date: Tue, 3 Mar 2026 10:21:59 +0000
Subject: [PATCH] Add azure border to all modal containers per Oliver design

All modal inner containers now have border-2 border-oliver-azure
for consistent Oliver branding across:
- CreateCampaignModal, CreateProjectModal
- FeedbackReport (resolve + flag modals)
- UserManagement (confirmation + history modals)
- Campaigns (upload, delete confirmation, version history modals)
- Projects (upload, delete modals)
- Login (support contact modal)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 frontend/components/Campaigns.tsx           | 8 ++++----
 frontend/components/CreateCampaignModal.tsx | 2 +-
 frontend/components/CreateProjectModal.tsx  | 2 +-
 frontend/components/FeedbackReport.tsx      | 4 ++--
 frontend/components/Login.tsx               | 2 +-
 frontend/components/Projects.tsx            | 4 ++--
 frontend/components/UserManagement.tsx      | 4 ++--
 7 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/frontend/components/Campaigns.tsx b/frontend/components/Campaigns.tsx
index 6f14026..ffa56aa 100755
--- a/frontend/components/Campaigns.tsx
+++ b/frontend/components/Campaigns.tsx
@@ -750,7 +750,7 @@ const UploadProofModal: React.FC<{
                 ></div>
                 <span className="hidden sm:inline-block sm:h-screen sm:align-middle" aria-hidden="true">&#8203;</span>
 
-                <div className="relative inline-block transform overflow-hidden rounded-[10px] bg-white text-left align-bottom shadow-2xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:align-middle border border-grey-300">
+                <div className="relative inline-block transform overflow-hidden rounded-[10px] bg-white text-left align-bottom shadow-2xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:align-middle border-2 border-oliver-azure">
                     {/* Header */}
                     <div className="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 border-b border-grey-300 flex justify-between items-start">
                         <div>
@@ -992,7 +992,7 @@ const DeleteConfirmationModal: React.FC<{
             role="dialog"
         >
             <div
-                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-md transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-md transform transition-all border-2 border-oliver-azure"
                 onClick={e => e.stopPropagation()}
             >
                 <h3 className="text-xl font-bold text-oliver-black">Confirm Deletion</h3>
@@ -1045,7 +1045,7 @@ const AnalysisErrorModal: React.FC<{
             role="dialog"
         >
             <div
-                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg max-h-[80vh] overflow-y-auto transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg max-h-[80vh] overflow-y-auto transform transition-all border-2 border-oliver-azure"
                 onClick={e => e.stopPropagation()}
             >
                 <div className="flex items-start gap-3 mb-4">
@@ -1110,7 +1110,7 @@ const CampaignDeleteConfirmationModal: React.FC<{
             role="dialog"
         >
             <div
-                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-md transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-md transform transition-all border-2 border-oliver-azure"
                 onClick={e => e.stopPropagation()}
             >
                 <h3 className="text-xl font-bold text-oliver-black">Confirm Deletion</h3>
diff --git a/frontend/components/CreateCampaignModal.tsx b/frontend/components/CreateCampaignModal.tsx
index c77481f..043fd20 100755
--- a/frontend/components/CreateCampaignModal.tsx
+++ b/frontend/components/CreateCampaignModal.tsx
@@ -89,7 +89,7 @@ export const CreateCampaignModal: React.FC<CreateCampaignModalProps> = ({ isOpen
             role="dialog"
         >
             <div
-                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg transform transition-all border-2 border-oliver-azure"
                 onClick={(e) => e.stopPropagation()}
             >
                 <div className="flex justify-between items-center mb-6">
diff --git a/frontend/components/CreateProjectModal.tsx b/frontend/components/CreateProjectModal.tsx
index 6bcb896..fd7bacb 100755
--- a/frontend/components/CreateProjectModal.tsx
+++ b/frontend/components/CreateProjectModal.tsx
@@ -75,7 +75,7 @@ export const CreateProjectModal: React.FC<CreateProjectModalProps> = ({ isOpen,
             role="dialog"
         >
             <div
-                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg transform transition-all border-2 border-oliver-azure"
                 onClick={(e) => e.stopPropagation()}
             >
                 <div className="flex justify-between items-center mb-6">
diff --git a/frontend/components/FeedbackReport.tsx b/frontend/components/FeedbackReport.tsx
index b5bf583..8659e3b 100755
--- a/frontend/components/FeedbackReport.tsx
+++ b/frontend/components/FeedbackReport.tsx
@@ -162,7 +162,7 @@ const ResolveIssueModal: React.FC<{
             onClick={onClose}
         >
             <div
-                className="bg-white rounded-[10px] shadow-2xl p-8 w-full max-w-lg transform transition-all border border-grey-300"
+                className="bg-white rounded-[10px] shadow-2xl p-8 w-full max-w-lg transform transition-all border-2 border-oliver-azure"
                 onClick={(e) => e.stopPropagation()}
             >
                 <h3 className="text-2xl font-bold text-oliver-black mb-2">Resolve Issue</h3>
@@ -233,7 +233,7 @@ const FlagIssueModal: React.FC<{
             onClick={showSuccess ? undefined : onClose}
         >
             <div
-                className="bg-white rounded-2xl shadow-2xl p-8 w-full max-w-lg transform transition-all border border-white/20 ring-1 ring-black/5"
+                className="bg-white rounded-[10px] shadow-2xl p-8 w-full max-w-lg transform transition-all border-2 border-oliver-azure"
                 onClick={(e) => e.stopPropagation()}
             >
                 {showSuccess ? (
diff --git a/frontend/components/Login.tsx b/frontend/components/Login.tsx
index 480f949..f6f00e0 100755
--- a/frontend/components/Login.tsx
+++ b/frontend/components/Login.tsx
@@ -58,7 +58,7 @@ const SupportModal: React.FC<{
             onClick={onClose}
         >
             <div
-                className="bg-white rounded-lg shadow-xl p-6 sm:p-8 w-full max-w-lg transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg transform transition-all border-2 border-oliver-azure"
                 onClick={(e) => e.stopPropagation()}
             >
                 <div className="flex justify-between items-start mb-4">
diff --git a/frontend/components/Projects.tsx b/frontend/components/Projects.tsx
index 913f569..6d71986 100755
--- a/frontend/components/Projects.tsx
+++ b/frontend/components/Projects.tsx
@@ -506,7 +506,7 @@ const AnalysisErrorModal: React.FC<{
             role="dialog"
         >
             <div
-                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg max-h-[80vh] overflow-y-auto transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-lg max-h-[80vh] overflow-y-auto transform transition-all border-2 border-oliver-azure"
                 onClick={e => e.stopPropagation()}
             >
                 <div className="flex items-start gap-3 mb-4">
@@ -568,7 +568,7 @@ const DeleteConfirmationModal: React.FC<{
             role="dialog"
         >
             <div
-                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-md transform transition-all"
+                className="bg-white rounded-[10px] shadow-xl p-6 sm:p-8 w-full max-w-md transform transition-all border-2 border-oliver-azure"
                 onClick={e => e.stopPropagation()}
             >
                 <h3 className="text-xl font-bold text-oliver-black">Confirm Deletion</h3>
diff --git a/frontend/components/UserManagement.tsx b/frontend/components/UserManagement.tsx
index fb10255..bf8c879 100644
--- a/frontend/components/UserManagement.tsx
+++ b/frontend/components/UserManagement.tsx
@@ -345,7 +345,7 @@ export const UserManagement: React.FC = () => {
                     onClick={handleCancelSuperAdmin}
                 >
                     <div
-                        className="bg-white rounded-[10px] shadow-xl max-w-md w-full mx-4 p-6"
+                        className="bg-white rounded-[10px] shadow-xl max-w-md w-full mx-4 p-6 border-2 border-oliver-azure"
                         onClick={(e) => e.stopPropagation()}
                     >
                         <div className="flex items-center gap-3 mb-4">
@@ -409,7 +409,7 @@ export const UserManagement: React.FC = () => {
                     onClick={handleCloseHistory}
                 >
                     <div
-                        className="bg-white rounded-[10px] shadow-xl max-w-2xl w-full mx-4 p-6 max-h-[80vh] flex flex-col"
+                        className="bg-white rounded-[10px] shadow-xl max-w-2xl w-full mx-4 p-6 max-h-[80vh] flex flex-col border-2 border-oliver-azure"
                         onClick={(e) => e.stopPropagation()}
                     >
                         <div className="flex items-center justify-between mb-4">