Browse Source

fix: improve button text visibility in preview modal

- Add light text colors to Rendered/Raw toggle buttons
- Active buttons: white text on cyan background
- Inactive buttons: light slate text with white on hover
- Add hover background effect for better UX
Fszontagh 4 months ago
parent
commit
84cd0714b7
1 changed files with 2 additions and 2 deletions
  1. 2 2
      shopcall.ai-main/src/components/ManageStoreDataContent.tsx

+ 2 - 2
shopcall.ai-main/src/components/ManageStoreDataContent.tsx

@@ -1649,7 +1649,7 @@ export function ManageStoreDataContent() {
                   variant={previewMode === 'rendered' ? 'default' : 'outline'}
                   variant={previewMode === 'rendered' ? 'default' : 'outline'}
                   size="sm"
                   size="sm"
                   onClick={() => setPreviewMode('rendered')}
                   onClick={() => setPreviewMode('rendered')}
-                  className={previewMode === 'rendered' ? 'bg-cyan-500 hover:bg-cyan-600' : 'border-slate-600'}
+                  className={previewMode === 'rendered' ? 'bg-cyan-500 hover:bg-cyan-600 text-white' : 'border-slate-600 text-slate-200 hover:text-white hover:bg-slate-700'}
                 >
                 >
                   <Eye className="w-3 h-3 mr-1" />
                   <Eye className="w-3 h-3 mr-1" />
                   Rendered
                   Rendered
@@ -1658,7 +1658,7 @@ export function ManageStoreDataContent() {
                   variant={previewMode === 'raw' ? 'default' : 'outline'}
                   variant={previewMode === 'raw' ? 'default' : 'outline'}
                   size="sm"
                   size="sm"
                   onClick={() => setPreviewMode('raw')}
                   onClick={() => setPreviewMode('raw')}
-                  className={previewMode === 'raw' ? 'bg-cyan-500 hover:bg-cyan-600' : 'border-slate-600'}
+                  className={previewMode === 'raw' ? 'bg-cyan-500 hover:bg-cyan-600 text-white' : 'border-slate-600 text-slate-200 hover:text-white hover:bg-slate-700'}
                 >
                 >
                   <Code className="w-3 h-3 mr-1" />
                   <Code className="w-3 h-3 mr-1" />
                   Raw
                   Raw