Oliver/modcomms
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add azure border to all modal containers per Oliver design

Browse source 
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>
This commit is contained in:
Vadym Samoilenko 2026-03-03 10:21:59 +00:00
parent 4302b9391a
commit 8317e01568
7 changed files with 13 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
frontend/components/Campaigns.tsx
View file

@ -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>

2
frontend/components/CreateCampaignModal.tsx
View file

@ -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">

2
frontend/components/CreateProjectModal.tsx
View file

@ -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">

4
frontend/components/FeedbackReport.tsx
View file

@ -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 ? (

2
frontend/components/Login.tsx
View file

@ -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">

4
frontend/components/Projects.tsx
View file

@ -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>

4
frontend/components/UserManagement.tsx
View file

@ -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">