egullickson/motovaultpro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: post Dark mode fixes

Browse Source
This commit is contained in:
Eric Gullickson
2025-12-27 20:00:51 -06:00
parent 1799f2fee1
commit 69171f7778
17 changed files with 125 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/features/admin/mobile/AdminBackupMobileScreen.tsx
View File

@@ -610,7 +610,7 @@ export const AdminBackupMobileScreen: React.FC = () => {
{showRestoreConfirm && (
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
<div className="bg-white rounded-lg p-6 max-w-sm w-full">
<div className="bg-white dark:bg-scuro rounded-lg p-6 max-w-sm w-full">
<h3 className="text-lg font-semibold text-slate-800 mb-4">Confirm Restore</h3>
<div className="bg-red-50 border border-red-200 rounded-lg p-3 mb-4">
<p className="text-xs text-red-800">
@@ -988,7 +988,7 @@ export const AdminBackupMobileScreen: React.FC = () => {
{/* Delete Backup Confirmation Modal */}
{showDeleteBackupConfirm && (
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
<div className="bg-white rounded-lg p-6 max-w-sm w-full">
<div className="bg-white dark:bg-scuro rounded-lg p-6 max-w-sm w-full">
<h3 className="text-lg font-semibold text-slate-800 mb-4">Delete Backup</h3>
<p className="text-sm text-slate-600 mb-4">
Are you sure you want to delete "{selectedBackup?.filename}"? This action cannot be
@@ -1016,7 +1016,7 @@ export const AdminBackupMobileScreen: React.FC = () => {
{/* Delete Schedule Confirmation Modal */}
{showDeleteScheduleConfirm && (
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
<div className="bg-white rounded-lg p-6 max-w-sm w-full">
<div className="bg-white dark:bg-scuro rounded-lg p-6 max-w-sm w-full">
<h3 className="text-lg font-semibold text-slate-800 mb-4">Delete Schedule</h3>
<p className="text-sm text-slate-600 mb-4">
Are you sure you want to delete "{selectedSchedule?.name}"? This action cannot be

22
frontend/src/features/admin/mobile/AdminCatalogMobileScreen.tsx
View File

@@ -379,14 +379,14 @@ export const AdminCatalogMobileScreen: React.FC = () => {
{menuOpen && (
<div className="fixed inset-0 bg-black bg-opacity-50 z-50 flex items-end justify-center">
<div
className="bg-white rounded-t-2xl w-full max-w-lg p-4 space-y-2 animate-slide-up"
className="bg-white dark:bg-scuro rounded-t-2xl w-full max-w-lg p-4 space-y-2 animate-slide-up"
onClick={(e) => e.stopPropagation()}
>
<div className="flex items-center justify-between mb-2">
<h2 className="text-lg font-semibold text-slate-800">Options</h2>
<h2 className="text-lg font-semibold text-slate-800 dark:text-avus">Options</h2>
<button
onClick={() => setMenuOpen(false)}
className="p-2 text-slate-500 hover:text-slate-700"
className="p-2 text-slate-500 dark:text-titanio hover:text-slate-700 dark:hover:text-avus"
style={{ minHeight: '44px', minWidth: '44px' }}
>
<Close />
@@ -396,7 +396,7 @@ export const AdminCatalogMobileScreen: React.FC = () => {
<button
onClick={handleImportClick}
disabled={importPreviewMutation.isPending}
className="w-full flex items-center gap-3 px-4 py-3 text-left text-slate-700 hover:bg-slate-50 rounded-lg transition"
className="w-full flex items-center gap-3 px-4 py-3 text-left text-slate-700 dark:text-avus hover:bg-slate-50 dark:hover:bg-gray-800 rounded-lg transition"
style={{ minHeight: '44px' }}
>
<FileUpload />
@@ -406,7 +406,7 @@ export const AdminCatalogMobileScreen: React.FC = () => {
<button
onClick={handleExport}
disabled={exportMutation.isPending}
className="w-full flex items-center gap-3 px-4 py-3 text-left text-slate-700 hover:bg-slate-50 rounded-lg transition"
className="w-full flex items-center gap-3 px-4 py-3 text-left text-slate-700 dark:text-avus hover:bg-slate-50 dark:hover:bg-gray-800 rounded-lg transition"
style={{ minHeight: '44px' }}
>
<FileDownload />
@@ -415,7 +415,7 @@ export const AdminCatalogMobileScreen: React.FC = () => {
<button
onClick={() => setMenuOpen(false)}
className="w-full bg-slate-100 text-slate-700 py-3 rounded-lg font-medium hover:bg-slate-200 transition mt-4"
className="w-full bg-slate-100 dark:bg-gray-700 text-slate-700 dark:text-gray-200 py-3 rounded-lg font-medium hover:bg-slate-200 dark:hover:bg-gray-600 transition mt-4"
style={{ minHeight: '44px' }}
>
Cancel
@@ -427,9 +427,9 @@ export const AdminCatalogMobileScreen: React.FC = () => {
{/* Delete Confirmation Sheet */}
{deleteSheet.open && deleteSheet.item && (
<div className="fixed inset-0 bg-black bg-opacity-50 z-50 flex items-end justify-center">
<div className="bg-white rounded-t-2xl w-full max-w-lg p-6 space-y-4 animate-slide-up">
<h2 className="text-xl font-bold text-slate-800">Delete Configuration?</h2>
<p className="text-slate-600">
<div className="bg-white dark:bg-scuro rounded-t-2xl w-full max-w-lg p-6 space-y-4 animate-slide-up">
<h2 className="text-xl font-bold text-slate-800 dark:text-avus">Delete Configuration?</h2>
<p className="text-slate-600 dark:text-titanio">
Are you sure you want to delete{' '}
<strong>
{deleteSheet.item.year} {deleteSheet.item.make} {deleteSheet.item.model}{' '}
@@ -441,7 +441,7 @@ export const AdminCatalogMobileScreen: React.FC = () => {
<button
onClick={() => setDeleteSheet({ open: false, item: null })}
disabled={deleting}
className="flex-1 bg-slate-200 text-slate-700 py-3 rounded-lg font-medium hover:bg-slate-300 transition disabled:opacity-50"
className="flex-1 bg-slate-200 dark:bg-gray-700 text-slate-700 dark:text-gray-200 py-3 rounded-lg font-medium hover:bg-slate-300 dark:hover:bg-gray-600 transition disabled:opacity-50"
style={{ minHeight: '44px' }}
>
Cancel
@@ -466,7 +466,7 @@ export const AdminCatalogMobileScreen: React.FC = () => {
{/* Import Preview/Results Sheet */}
{importSheet && (importPreview || importResult) && (
<div className="fixed inset-0 bg-black bg-opacity-50 z-50 flex items-end justify-center">
<div className="bg-white rounded-t-2xl w-full max-w-lg p-6 space-y-4 animate-slide-up max-h-[80vh] overflow-y-auto">
<div className="bg-white dark:bg-scuro rounded-t-2xl w-full max-w-lg p-6 space-y-4 animate-slide-up max-h-[80vh] overflow-y-auto">
<div className="flex items-center justify-between">
<h2 className="text-xl font-bold text-slate-800">
{importResult ? 'Import Results' : 'Import Preview'}

4
frontend/src/features/admin/mobile/AdminEmailTemplatesMobileScreen.tsx
View File

@@ -238,7 +238,7 @@ export const AdminEmailTemplatesMobileScreen: React.FC = () => {
{editingTemplate.variables.map((variable) => (
<span
key={variable}
className="inline-block px-2 py-1 bg-white border border-blue-300 rounded text-xs font-mono text-blue-700"
className="inline-block px-2 py-1 bg-white dark:bg-gray-800 border border-blue-300 dark:border-blue-600 rounded text-xs font-mono text-blue-700 dark:text-blue-400"
>
{`{{${variable}}}`}
</span>
@@ -250,7 +250,7 @@ export const AdminEmailTemplatesMobileScreen: React.FC = () => {
<div className="flex gap-2 pt-2">
<button
onClick={handleCloseEdit}
className="flex-1 px-4 py-3 bg-gray-100 text-gray-700 rounded-lg font-medium hover:bg-gray-200 transition-colors min-h-[44px]"
className="flex-1 px-4 py-3 bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-200 rounded-lg font-medium hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors min-h-[44px]"
>
Cancel
</button>

10
frontend/src/features/admin/mobile/AdminUsersMobileScreen.tsx
View File

@@ -37,8 +37,8 @@ const Modal: React.FC<ModalProps> = ({ isOpen, onClose, title, children, actions
return (
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
<div className="bg-white rounded-xl p-6 max-w-sm w-full shadow-xl">
<h3 className="text-lg font-semibold text-slate-800 mb-4">{title}</h3>
<div className="bg-white dark:bg-scuro rounded-xl p-6 max-w-sm w-full shadow-xl">
<h3 className="text-lg font-semibold text-slate-800 dark:text-avus mb-4">{title}</h3>
{children}
<div className="flex justify-end gap-2 mt-4">
{actions || (
@@ -337,7 +337,7 @@ export const AdminUsersMobileScreen: React.FC = () => {
value={searchInput}
onChange={(e) => setSearchInput(e.target.value)}
onKeyPress={(e) => e.key === 'Enter' && handleSearch()}
className="w-full px-4 py-3 rounded-lg border border-slate-200 focus:outline-none focus:ring-2 focus:ring-blue-500 min-h-[44px]"
className="w-full px-4 py-3 rounded-lg border border-slate-200 dark:border-silverstone dark:bg-scuro dark:text-avus focus:outline-none focus:ring-2 focus:ring-blue-500 min-h-[44px]"
/>
{searchInput && (
<button
@@ -378,7 +378,7 @@ export const AdminUsersMobileScreen: React.FC = () => {
<select
value={params.tier || ''}
onChange={(e) => handleTierFilterChange(e.target.value as SubscriptionTier | '')}
className="w-full px-3 py-2 rounded-lg border border-slate-200 min-h-[44px]"
className="w-full px-3 py-2 rounded-lg border border-slate-200 dark:border-silverstone dark:bg-scuro dark:text-avus min-h-[44px]"
>
<option value="">All Tiers</option>
<option value="free">Free</option>
@@ -393,7 +393,7 @@ export const AdminUsersMobileScreen: React.FC = () => {
<select
value={params.status || 'all'}
onChange={(e) => handleStatusFilterChange(e.target.value as 'active' | 'deactivated' | 'all')}
className="w-full px-3 py-2 rounded-lg border border-slate-200 min-h-[44px]"
className="w-full px-3 py-2 rounded-lg border border-slate-200 dark:border-silverstone dark:bg-scuro dark:text-avus min-h-[44px]"
>
<option value="all">All</option>
<option value="active">Active</option>