chihlasm/resolutionflow
1
0
Fork 0
Code Issues 23 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: replace all hardcoded orange rgba with blue rgba

Browse Source 
Mechanical find-and-replace: rgba(249,115,22,...) → rgba(96,165,250,...)
across ~40 component and page files.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
chihlasm
2026-03-29 16:20:13 +00:00
parent 3e52708253
commit 5ff9a9d75e
36 changed files with 100 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/analytics/PsaMetricsPanel.tsx
View File

@@ -95,7 +95,7 @@ export default function PsaMetricsPanel({ data }: PsaMetricsPanelProps) {
<Bar <Bar
yAxisId="entries" yAxisId="entries"
dataKey="entries" dataKey="entries"
fill="rgba(249,115,22,0.3)" fill="rgba(96,165,250,0.3)"
radius={[4, 4, 0, 0]} radius={[4, 4, 0, 0]}
/> />
<Area <Area

44
frontend/src/components/common/EmptyStateIllustrations.tsx
View File

@@ -8,19 +8,19 @@ export function FlowIllustration() {
return ( return (
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Root node */} {/* Root node */}
<circle cx="40" cy="10" r="6" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <circle cx="40" cy="10" r="6" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
{/* Branches */} {/* Branches */}
<line x1="40" y1="16" x2="20" y2="34" stroke="#ea580c" strokeWidth="1.5" /> <line x1="40" y1="16" x2="20" y2="34" stroke="#ea580c" strokeWidth="1.5" />
<line x1="40" y1="16" x2="60" y2="34" stroke="#ea580c" strokeWidth="1.5" /> <line x1="40" y1="16" x2="60" y2="34" stroke="#ea580c" strokeWidth="1.5" />
{/* Left child */} {/* Left child */}
<circle cx="20" cy="38" r="5" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <circle cx="20" cy="38" r="5" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
{/* Right child */} {/* Right child */}
<circle cx="60" cy="38" r="5" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <circle cx="60" cy="38" r="5" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
{/* Leaf branches */} {/* Leaf branches */}
<line x1="20" y1="43" x2="12" y2="52" stroke="#f97316" strokeWidth="1" /> <line x1="20" y1="43" x2="12" y2="52" stroke="#f97316" strokeWidth="1" />
<line x1="20" y1="43" x2="28" y2="52" stroke="#f97316" strokeWidth="1" /> <line x1="20" y1="43" x2="28" y2="52" stroke="#f97316" strokeWidth="1" />
<circle cx="12" cy="54" r="3" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1" /> <circle cx="12" cy="54" r="3" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1" />
<circle cx="28" cy="54" r="3" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1" /> <circle cx="28" cy="54" r="3" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1" />
</svg> </svg>
) )
} }
@@ -29,10 +29,10 @@ export function AnalyticsIllustration() {
return ( return (
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Bars */} {/* Bars */}
<rect x="12" y="38" width="10" height="16" rx="2" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <rect x="12" y="38" width="10" height="16" rx="2" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
<rect x="26" y="28" width="10" height="26" rx="2" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <rect x="26" y="28" width="10" height="26" rx="2" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
<rect x="40" y="20" width="10" height="34" rx="2" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <rect x="40" y="20" width="10" height="34" rx="2" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
<rect x="54" y="10" width="10" height="44" rx="2" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <rect x="54" y="10" width="10" height="44" rx="2" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
{/* Baseline */} {/* Baseline */}
<line x1="8" y1="56" x2="72" y2="56" stroke="#ea580c" strokeWidth="1" opacity="0.5" /> <line x1="8" y1="56" x2="72" y2="56" stroke="#ea580c" strokeWidth="1" opacity="0.5" />
</svg> </svg>
@@ -43,15 +43,15 @@ export function SessionIllustration() {
return ( return (
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Card 1 */} {/* Card 1 */}
<rect x="12" y="8" width="56" height="12" rx="3" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <rect x="12" y="8" width="56" height="12" rx="3" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
<circle cx="22" cy="14" r="2" fill="#ea580c" /> <circle cx="22" cy="14" r="2" fill="#ea580c" />
<line x1="28" y1="14" x2="56" y2="14" stroke="#ea580c" strokeWidth="1" opacity="0.5" /> <line x1="28" y1="14" x2="56" y2="14" stroke="#ea580c" strokeWidth="1" opacity="0.5" />
{/* Card 2 */} {/* Card 2 */}
<rect x="12" y="24" width="56" height="12" rx="3" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <rect x="12" y="24" width="56" height="12" rx="3" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
<circle cx="22" cy="30" r="2" fill="#f97316" /> <circle cx="22" cy="30" r="2" fill="#f97316" />
<line x1="28" y1="30" x2="52" y2="30" stroke="#f97316" strokeWidth="1" opacity="0.5" /> <line x1="28" y1="30" x2="52" y2="30" stroke="#f97316" strokeWidth="1" opacity="0.5" />
{/* Card 3 */} {/* Card 3 */}
<rect x="12" y="40" width="56" height="12" rx="3" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <rect x="12" y="40" width="56" height="12" rx="3" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
<circle cx="22" cy="46" r="2" fill="#ea580c" /> <circle cx="22" cy="46" r="2" fill="#ea580c" />
<line x1="28" y1="46" x2="48" y2="46" stroke="#ea580c" strokeWidth="1" opacity="0.5" /> <line x1="28" y1="46" x2="48" y2="46" stroke="#ea580c" strokeWidth="1" opacity="0.5" />
</svg> </svg>
@@ -62,11 +62,11 @@ export function IntegrationIllustration() {
return ( return (
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Left box */} {/* Left box */}
<rect x="6" y="18" width="22" height="24" rx="4" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <rect x="6" y="18" width="22" height="24" rx="4" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
<line x1="12" y1="26" x2="22" y2="26" stroke="#ea580c" strokeWidth="1" opacity="0.6" /> <line x1="12" y1="26" x2="22" y2="26" stroke="#ea580c" strokeWidth="1" opacity="0.6" />
<line x1="12" y1="30" x2="20" y2="30" stroke="#ea580c" strokeWidth="1" opacity="0.4" /> <line x1="12" y1="30" x2="20" y2="30" stroke="#ea580c" strokeWidth="1" opacity="0.4" />
{/* Right box */} {/* Right box */}
<rect x="52" y="18" width="22" height="24" rx="4" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <rect x="52" y="18" width="22" height="24" rx="4" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
<line x1="58" y1="26" x2="68" y2="26" stroke="#f97316" strokeWidth="1" opacity="0.6" /> <line x1="58" y1="26" x2="68" y2="26" stroke="#f97316" strokeWidth="1" opacity="0.6" />
<line x1="58" y1="30" x2="66" y2="30" stroke="#f97316" strokeWidth="1" opacity="0.4" /> <line x1="58" y1="30" x2="66" y2="30" stroke="#f97316" strokeWidth="1" opacity="0.4" />
{/* Dashed arrows */} {/* Dashed arrows */}
@@ -83,13 +83,13 @@ export function StepLibraryIllustration() {
return ( return (
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* List items */} {/* List items */}
<circle cx="18" cy="14" r="3" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <circle cx="18" cy="14" r="3" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
<line x1="26" y1="14" x2="62" y2="14" stroke="#ea580c" strokeWidth="1.5" opacity="0.5" /> <line x1="26" y1="14" x2="62" y2="14" stroke="#ea580c" strokeWidth="1.5" opacity="0.5" />
<circle cx="18" cy="27" r="3" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <circle cx="18" cy="27" r="3" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
<line x1="26" y1="27" x2="58" y2="27" stroke="#f97316" strokeWidth="1.5" opacity="0.5" /> <line x1="26" y1="27" x2="58" y2="27" stroke="#f97316" strokeWidth="1.5" opacity="0.5" />
<circle cx="18" cy="40" r="3" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <circle cx="18" cy="40" r="3" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
<line x1="26" y1="40" x2="54" y2="40" stroke="#ea580c" strokeWidth="1.5" opacity="0.5" /> <line x1="26" y1="40" x2="54" y2="40" stroke="#ea580c" strokeWidth="1.5" opacity="0.5" />
<circle cx="18" cy="53" r="3" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <circle cx="18" cy="53" r="3" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
<line x1="26" y1="53" x2="50" y2="53" stroke="#f97316" strokeWidth="1.5" opacity="0.5" /> <line x1="26" y1="53" x2="50" y2="53" stroke="#f97316" strokeWidth="1.5" opacity="0.5" />
</svg> </svg>
) )
@@ -99,7 +99,7 @@ export function ScriptIllustration() {
return ( return (
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Terminal window */} {/* Terminal window */}
<rect x="8" y="4" width="64" height="52" rx="4" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <rect x="8" y="4" width="64" height="52" rx="4" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
{/* Title bar */} {/* Title bar */}
<line x1="8" y1="14" x2="72" y2="14" stroke="#ea580c" strokeWidth="1" opacity="0.3" /> <line x1="8" y1="14" x2="72" y2="14" stroke="#ea580c" strokeWidth="1" opacity="0.3" />
<circle cx="16" cy="9" r="2" fill="#ea580c" opacity="0.4" /> <circle cx="16" cy="9" r="2" fill="#ea580c" opacity="0.4" />
@@ -117,11 +117,11 @@ export function ShareIllustration() {
return ( return (
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Center node */} {/* Center node */}
<circle cx="28" cy="30" r="8" fill="rgba(249,115,22,0.15)" stroke="#ea580c" strokeWidth="1.5" /> <circle cx="28" cy="30" r="8" fill="rgba(96,165,250,0.15)" stroke="#ea580c" strokeWidth="1.5" />
{/* Top-right node */} {/* Top-right node */}
<circle cx="58" cy="14" r="6" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <circle cx="58" cy="14" r="6" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
{/* Bottom-right node */} {/* Bottom-right node */}
<circle cx="58" cy="46" r="6" fill="rgba(249,115,22,0.15)" stroke="#f97316" strokeWidth="1.5" /> <circle cx="58" cy="46" r="6" fill="rgba(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
{/* Connecting lines */} {/* Connecting lines */}
<line x1="35" y1="25" x2="52" y2="17" stroke="#ea580c" strokeWidth="1.5" /> <line x1="35" y1="25" x2="52" y2="17" stroke="#ea580c" strokeWidth="1.5" />
<line x1="35" y1="35" x2="52" y2="43" stroke="#ea580c" strokeWidth="1.5" /> <line x1="35" y1="35" x2="52" y2="43" stroke="#ea580c" strokeWidth="1.5" />

2
frontend/src/components/common/RichTextInput.tsx
View File

@@ -234,7 +234,7 @@ export function RichTextInput({
disabled={disabled} disabled={disabled}
className={cn( className={cn(
'w-full bg-card border border-border rounded-xl p-3 text-sm text-foreground placeholder:text-muted-foreground', 'w-full bg-card border border-border rounded-xl p-3 text-sm text-foreground placeholder:text-muted-foreground',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-none resize-none transition-colors', 'focus:border-[rgba(96,165,250,0.3)] focus:outline-none resize-none transition-colors',
isDragOver && 'border-primary/50 bg-primary/5', isDragOver && 'border-primary/50 bg-primary/5',
disabled && 'opacity-50 cursor-not-allowed' disabled && 'opacity-50 cursor-not-allowed'
)} )}

4
frontend/src/components/dashboard/RecentActivity.tsx
View File

@@ -16,9 +16,9 @@ interface RecentActivityProps {
const DEFAULT_ACTIVITIES: ActivityItem[] = [ const DEFAULT_ACTIVITIES: ActivityItem[] = [
{ id: '1', icon: Play, iconColor: '#34d399', iconBg: 'rgba(52, 211, 153, 0.1)', description: 'Started VPN Connectivity Triage session', timestamp: '2 min ago' }, { id: '1', icon: Play, iconColor: '#34d399', iconBg: 'rgba(52, 211, 153, 0.1)', description: 'Started VPN Connectivity Triage session', timestamp: '2 min ago' },
{ id: '2', icon: CheckCircle, iconColor: '#ea580c', iconBg: 'rgba(249, 115, 22, 0.1)', description: 'Completed M365 License Provisioning', timestamp: '15 min ago' }, { id: '2', icon: CheckCircle, iconColor: '#ea580c', iconBg: 'rgba(96, 165, 250, 0.1)', description: 'Completed M365 License Provisioning', timestamp: '15 min ago' },
{ id: '3', icon: Edit, iconColor: '#eab308', iconBg: 'rgba(234, 179, 8, 0.1)', description: 'Updated Printer Troubleshooting flow', timestamp: '1 hr ago' }, { id: '3', icon: Edit, iconColor: '#eab308', iconBg: 'rgba(234, 179, 8, 0.1)', description: 'Updated Printer Troubleshooting flow', timestamp: '1 hr ago' },
{ id: '4', icon: GitBranch, iconColor: '#ea580c', iconBg: 'rgba(249, 115, 22, 0.1)', description: 'Created new DNS Resolution flow', timestamp: '3 hr ago' }, { id: '4', icon: GitBranch, iconColor: '#ea580c', iconBg: 'rgba(96, 165, 250, 0.1)', description: 'Created new DNS Resolution flow', timestamp: '3 hr ago' },
{ id: '5', icon: FileText, iconColor: '#8891a0', iconBg: 'rgba(136, 145, 160, 0.1)', description: 'Exported session report #TK-4821', timestamp: 'Yesterday' }, { id: '5', icon: FileText, iconColor: '#8891a0', iconBg: 'rgba(136, 145, 160, 0.1)', description: 'Exported session report #TK-4821', timestamp: 'Yesterday' },
] ]

4
frontend/src/components/dashboard/StartSessionInput.tsx
View File

@@ -200,7 +200,7 @@ export function StartSessionInput() {
<div className={cn( <div className={cn(
'relative rounded-2xl border bg-card transition-all', 'relative rounded-2xl border bg-card transition-all',
isDragOver ? 'border-primary/50 bg-primary/5' : 'border-border', isDragOver ? 'border-primary/50 bg-primary/5' : 'border-border',
'focus-within:border-[rgba(249,115,22,0.25)] focus-within:ring-1 focus-within:ring-[rgba(249,115,22,0.1)]' 'focus-within:border-[rgba(96,165,250,0.25)] focus-within:ring-1 focus-within:ring-[rgba(96,165,250,0.1)]'
)}> )}>
{/* Drag overlay */} {/* Drag overlay */}
{isDragOver && ( {isDragOver && (
@@ -278,7 +278,7 @@ export function StartSessionInput() {
onChange={(e) => setLogContent(e.target.value)} onChange={(e) => setLogContent(e.target.value)}
placeholder="Paste event viewer logs, error messages, PowerShell output..." placeholder="Paste event viewer logs, error messages, PowerShell output..."
rows={4} rows={4}
className="w-full resize-none rounded-lg border border-border bg-background p-3 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none" className="w-full resize-none rounded-lg border border-border bg-background p-3 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none"
/> />
</div> </div>
)} )}

2
frontend/src/components/flowpilot/FlowPilotActionBar.tsx
View File

@@ -152,7 +152,7 @@ export function FlowPilotActionBar({
value={resolutionSummary} value={resolutionSummary}
onChange={(e) => setResolutionSummary(e.target.value)} onChange={(e) => setResolutionSummary(e.target.value)}
placeholder="What resolved the issue?" placeholder="What resolved the issue?"
className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none resize-none" className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none resize-none"
rows={4} rows={4}
autoFocus autoFocus
/> />

4
frontend/src/components/flowpilot/FlowPilotIntake.tsx
View File

@@ -166,7 +166,7 @@ export function FlowPilotIntake({ onSubmit, isLoading, defaultProblem }: FlowPil
value={additionalContext} value={additionalContext}
onChange={(e) => setAdditionalContext(e.target.value)} onChange={(e) => setAdditionalContext(e.target.value)}
placeholder="Add extra context (optional) — e.g. 'User called back and said it's also affecting their second monitor'" placeholder="Add extra context (optional) — e.g. 'User called back and said it's also affecting their second monitor'"
className="mt-3 w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none resize-none" className="mt-3 w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none resize-none"
rows={3} rows={3}
/> />
</div> </div>
@@ -229,7 +229,7 @@ export function FlowPilotIntake({ onSubmit, isLoading, defaultProblem }: FlowPil
value={logContent} value={logContent}
onChange={(e) => setLogContent(e.target.value)} onChange={(e) => setLogContent(e.target.value)}
placeholder="Paste log output, error messages, or Event Viewer entries here..." placeholder="Paste log output, error messages, or Event Viewer entries here..."
className="w-full rounded-lg border border-border bg-card px-4 py-3 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none resize-none" className="w-full rounded-lg border border-border bg-card px-4 py-3 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none resize-none"
rows={6} rows={6}
/> />
)} )}

4
frontend/src/components/flowpilot/FlowPilotMessageBar.tsx
View File

@@ -194,7 +194,7 @@ export function FlowPilotMessageBar({ onRespond, disabled = false, isProcessing
? 'border-border/50 opacity-50' ? 'border-border/50 opacity-50'
: isDragOver : isDragOver
? 'border-primary/50 bg-primary/5' ? 'border-primary/50 bg-primary/5'
: 'border-border focus-within:border-[rgba(249,115,22,0.3)] focus-within:ring-1 focus-within:ring-primary/20' : 'border-border focus-within:border-[rgba(96,165,250,0.3)] focus-within:ring-1 focus-within:ring-primary/20'
)} )}
style={{ background: 'var(--color-bg-card)' }} style={{ background: 'var(--color-bg-card)' }}
> >
@@ -275,7 +275,7 @@ export function FlowPilotMessageBar({ onRespond, disabled = false, isProcessing
onChange={(e) => setLogContent(e.target.value)} onChange={(e) => setLogContent(e.target.value)}
placeholder="Paste event viewer logs, error messages, PowerShell output..." placeholder="Paste event viewer logs, error messages, PowerShell output..."
rows={3} rows={3}
className="w-full resize-none rounded-lg border border-border bg-background p-2 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none" className="w-full resize-none rounded-lg border border-border bg-background p-2 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none"
/> />
</div> </div>
)} )}

2
frontend/src/components/flowpilot/FlowPilotOptions.tsx
View File

@@ -29,7 +29,7 @@ export function FlowPilotOptions({ options, onSelect, disabled }: FlowPilotOptio
disabled={disabled} disabled={disabled}
className={cn( className={cn(
'group relative rounded-xl border p-3 sm:p-4 text-left transition-all min-h-[44px]', 'group relative rounded-xl border p-3 sm:p-4 text-left transition-all min-h-[44px]',
'hover:border-[rgba(249,115,22,0.3)] hover:shadow-[0_0_20px_rgba(249,115,22,0.08)]', 'hover:border-[rgba(96,165,250,0.3)] hover:shadow-[0_0_20px_rgba(96,165,250,0.08)]',
'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40', 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40',
isSelected isSelected
? 'border-primary/40 bg-accent-dim' ? 'border-primary/40 bg-accent-dim'

2
frontend/src/components/flowpilot/InSessionScriptGenerator.tsx
View File

@@ -96,7 +96,7 @@ export function InSessionScriptGenerator({
<input <input
value={value} value={value}
onChange={(e) => setParams(prev => ({ ...prev, [key]: e.target.value }))} onChange={(e) => setParams(prev => ({ ...prev, [key]: e.target.value }))}
className="w-full rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none" className="w-full rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none"
/> />
</div> </div>
))} ))}

2
frontend/src/components/flowpilot/ProposalDetail.tsx
View File

@@ -187,7 +187,7 @@ export function ProposalDetail({ proposal, onReview }: ProposalDetailProps) {
value={reviewNotes} value={reviewNotes}
onChange={(e) => setReviewNotes(e.target.value)} onChange={(e) => setReviewNotes(e.target.value)}
placeholder="Reviewer notes (optional)" placeholder="Reviewer notes (optional)"
className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none" className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none"
/> />
{/* Action buttons */} {/* Action buttons */}

2
frontend/src/components/flowpilot/SessionBriefing.tsx
View File

@@ -145,7 +145,7 @@ export function SessionBriefing({
value={freshContext} value={freshContext}
onChange={(e) => setFreshContext(e.target.value)} onChange={(e) => setFreshContext(e.target.value)}
placeholder="What additional information do you have, or what would you like to investigate first?" placeholder="What additional information do you have, or what would you like to investigate first?"
className="w-full rounded-lg border border-border bg-card px-4 py-3 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none resize-none" className="w-full rounded-lg border border-border bg-card px-4 py-3 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none resize-none"
rows={3} rows={3}
autoFocus autoFocus
/> />

2
frontend/src/components/layout/Sidebar.tsx
View File

@@ -288,7 +288,7 @@ export function Sidebar() {
'group relative flex items-center gap-3 rounded-lg px-3 py-2 text-[0.8125rem] font-medium transition-all duration-150', 'group relative flex items-center gap-3 rounded-lg px-3 py-2 text-[0.8125rem] font-medium transition-all duration-150',
active active
? isParentDimmed ? isParentDimmed
? 'bg-[rgba(249,115,22,0.05)] text-foreground/70' ? 'bg-[rgba(96,165,250,0.05)] text-foreground/70'
: 'bg-accent-dim text-foreground' : 'bg-accent-dim text-foreground'
: 'text-muted-foreground hover:bg-input hover:text-foreground' : 'text-muted-foreground hover:bg-input hover:text-foreground'
)} )}

6
frontend/src/components/procedural/InlineVariablePrompt.tsx
View File

@@ -60,7 +60,7 @@ export function InlineVariablePrompt({
className={cn( className={cn(
'inline-flex items-center gap-1.5 rounded-md border px-2.5 py-1 text-sm font-medium transition-all', 'inline-flex items-center gap-1.5 rounded-md border px-2.5 py-1 text-sm font-medium transition-all',
'border-orange-500/40 bg-orange-500/5 text-orange-400', 'border-orange-500/40 bg-orange-500/5 text-orange-400',
'hover:border-orange-400/60 hover:bg-orange-500/10 hover:shadow-[0_0_12px_rgba(249,115,22,0.15)]', 'hover:border-orange-400/60 hover:bg-orange-500/10 hover:shadow-[0_0_12px_rgba(96,165,250,0.15)]',
'disabled:opacity-50 disabled:cursor-not-allowed', 'disabled:opacity-50 disabled:cursor-not-allowed',
isRequired && 'ring-1 ring-orange-500/20' isRequired && 'ring-1 ring-orange-500/20'
)} )}
@@ -88,7 +88,7 @@ export function InlineVariablePrompt({
onBlur={() => { onBlur={() => {
if (!value) setIsEditing(false) if (!value) setIsEditing(false)
}} }}
className="rounded-md border border-orange-500/40 bg-orange-500/5 px-2.5 py-1 text-sm text-foreground shadow-[0_0_12px_rgba(249,115,22,0.15)] focus:border-orange-400 focus:outline-hidden focus:ring-1 focus:ring-orange-400/30" className="rounded-md border border-orange-500/40 bg-orange-500/5 px-2.5 py-1 text-sm text-foreground shadow-[0_0_12px_rgba(96,165,250,0.15)] focus:border-orange-400 focus:outline-hidden focus:ring-1 focus:ring-orange-400/30"
> >
<option value="">{placeholder}</option> <option value="">{placeholder}</option>
{options.map((opt) => ( {options.map((opt) => (
@@ -117,7 +117,7 @@ export function InlineVariablePrompt({
onBlur={handleSubmit} onBlur={handleSubmit}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}
placeholder={placeholder} placeholder={placeholder}
className="w-48 rounded-md border border-orange-500/40 bg-orange-500/5 px-2.5 py-1 text-sm text-foreground shadow-[0_0_12px_rgba(249,115,22,0.15)] placeholder:text-muted-foreground focus:border-orange-400 focus:outline-hidden focus:ring-1 focus:ring-orange-400/30" className="w-48 rounded-md border border-orange-500/40 bg-orange-500/5 px-2.5 py-1 text-sm text-foreground shadow-[0_0_12px_rgba(96,165,250,0.15)] placeholder:text-muted-foreground focus:border-orange-400 focus:outline-hidden focus:ring-1 focus:ring-orange-400/30"
/> />
{helpText && ( {helpText && (
<span className="absolute -bottom-5 left-0 text-[0.625rem] text-muted-foreground whitespace-nowrap"> <span className="absolute -bottom-5 left-0 text-[0.625rem] text-muted-foreground whitespace-nowrap">

12
frontend/src/components/procedural/PrepareSessionModal.tsx
View File

@@ -122,7 +122,7 @@ export function PrepareSessionModal({
value={ticketNumber} value={ticketNumber}
onChange={(e) => setTicketNumber(e.target.value)} onChange={(e) => setTicketNumber(e.target.value)}
placeholder="e.g. TKT-12345" placeholder="e.g. TKT-12345"
className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20" className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20"
/> />
</div> </div>
<div> <div>
@@ -132,7 +132,7 @@ export function PrepareSessionModal({
value={clientName} value={clientName}
onChange={(e) => setClientName(e.target.value)} onChange={(e) => setClientName(e.target.value)}
placeholder="e.g. Acme Corp" placeholder="e.g. Acme Corp"
className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20" className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20"
/> />
</div> </div>
</div> </div>
@@ -147,7 +147,7 @@ export function PrepareSessionModal({
<select <select
value={assignedToId} value={assignedToId}
onChange={(e) => setAssignedToId(e.target.value)} onChange={(e) => setAssignedToId(e.target.value)}
className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20" className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20"
> >
<option value="">Unassigned (visible to all)</option> <option value="">Unassigned (visible to all)</option>
{teamMembers.map(m => ( {teamMembers.map(m => (
@@ -178,7 +178,7 @@ export function PrepareSessionModal({
<select <select
value={values[field.variable_name] || ''} value={values[field.variable_name] || ''}
onChange={(e) => handleFieldChange(field.variable_name, e.target.value)} onChange={(e) => handleFieldChange(field.variable_name, e.target.value)}
className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20" className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20"
> >
<option value="">{field.placeholder || 'Select...'}</option> <option value="">{field.placeholder || 'Select...'}</option>
{field.options.map(opt => ( {field.options.map(opt => (
@@ -191,7 +191,7 @@ export function PrepareSessionModal({
onChange={(e) => handleFieldChange(field.variable_name, e.target.value)} onChange={(e) => handleFieldChange(field.variable_name, e.target.value)}
placeholder={field.placeholder} placeholder={field.placeholder}
rows={3} rows={3}
className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20" className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20"
/> />
) : ( ) : (
<input <input
@@ -199,7 +199,7 @@ export function PrepareSessionModal({
value={values[field.variable_name] || ''} value={values[field.variable_name] || ''}
onChange={(e) => handleFieldChange(field.variable_name, e.target.value)} onChange={(e) => handleFieldChange(field.variable_name, e.target.value)}
placeholder={field.placeholder} placeholder={field.placeholder}
className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20" className="w-full rounded-md border border-border bg-card px-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20"
/> />
)} )}
{field.help_text && ( {field.help_text && (

6
frontend/src/components/script-builder/ScriptBuilderChat.tsx
View File

@@ -56,7 +56,7 @@ export function ScriptBuilderChat({
)} )}
> >
{msg.role === 'assistant' && ( {msg.role === 'assistant' && (
<div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(249,115,22,0.1)] flex items-center justify-center mt-0.5"> <div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(96,165,250,0.1)] flex items-center justify-center mt-0.5">
<Bot size={16} className="text-orange-400" /> <Bot size={16} className="text-orange-400" />
</div> </div>
)} )}
@@ -65,7 +65,7 @@ export function ScriptBuilderChat({
className={cn( className={cn(
"max-w-[85%] rounded-xl px-4 py-3 text-sm", "max-w-[85%] rounded-xl px-4 py-3 text-sm",
msg.role === 'user' msg.role === 'user'
? "bg-[rgba(249,115,22,0.08)] border border-[rgba(249,115,22,0.15)] text-foreground" ? "bg-[rgba(96,165,250,0.08)] border border-[rgba(96,165,250,0.15)] text-foreground"
: "card-flat" : "card-flat"
)} )}
> >
@@ -98,7 +98,7 @@ export function ScriptBuilderChat({
{isLoading && ( {isLoading && (
<div className="flex gap-3 justify-start"> <div className="flex gap-3 justify-start">
<div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(249,115,22,0.1)] flex items-center justify-center"> <div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(96,165,250,0.1)] flex items-center justify-center">
<Bot size={16} className="text-orange-400" /> <Bot size={16} className="text-orange-400" />
</div> </div>
<div className="card-flat rounded-xl px-4 py-3 text-sm flex items-center gap-2"> <div className="card-flat rounded-xl px-4 py-3 text-sm flex items-center gap-2">

2
frontend/src/components/script-builder/ScriptBuilderInput.tsx
View File

@@ -56,7 +56,7 @@ export function ScriptBuilderInput({
className={cn( className={cn(
"flex-1 resize-none rounded-xl px-4 py-2.5 text-sm", "flex-1 resize-none rounded-xl px-4 py-2.5 text-sm",
"bg-card border border-border text-foreground placeholder:text-muted-foreground", "bg-card border border-border text-foreground placeholder:text-muted-foreground",
"focus:outline-none focus:border-[rgba(249,115,22,0.3)] transition-colors", "focus:outline-none focus:border-[rgba(96,165,250,0.3)] transition-colors",
"disabled:opacity-50" "disabled:opacity-50"
)} )}
style={{ maxHeight: 120 }} style={{ maxHeight: 120 }}

2
frontend/src/components/script-editor/ParameterCard.tsx
View File

@@ -104,7 +104,7 @@ export function ParameterCard({
value={param.type} value={param.type}
onChange={e => update({ type: e.target.value as ScriptParameter['type'] })} onChange={e => update({ type: e.target.value as ScriptParameter['type'] })}
disabled={disabled} disabled={disabled}
className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(249,115,22,0.3)] disabled:cursor-not-allowed disabled:opacity-50" className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(96,165,250,0.3)] disabled:cursor-not-allowed disabled:opacity-50"
> >
{PARAM_TYPES.map(t => ( {PARAM_TYPES.map(t => (
<option key={t.value} value={t.value}>{t.label}</option> <option key={t.value} value={t.value}>{t.label}</option>

2
frontend/src/components/script-editor/ParameterDetectorStepper.tsx
View File

@@ -174,7 +174,7 @@ export function ParameterDetectorStepper({
<select <select
value={type} value={type}
onChange={e => setType(e.target.value as ScriptParameter['type'])} onChange={e => setType(e.target.value as ScriptParameter['type'])}
className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(249,115,22,0.3)]" className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(96,165,250,0.3)]"
> >
{PARAM_TYPES.map(t => ( {PARAM_TYPES.map(t => (
<option key={t.value} value={t.value}>{t.label}</option> <option key={t.value} value={t.value}>{t.label}</option>

2
frontend/src/components/script-editor/ParameterSchemaBuilder.tsx
View File

@@ -159,7 +159,7 @@ export function ParameterSchemaBuilder({ schema, onChange, disabled }: Props) {
onChange={e => { setJsonText(e.target.value); setJsonError(null) }} onChange={e => { setJsonText(e.target.value); setJsonError(null) }}
disabled={disabled} disabled={disabled}
spellCheck={false} spellCheck={false}
className="w-full min-h-[300px] resize-y font-sans text-xs text-sm bg-card border border-border rounded-xl p-4 text-foreground focus:outline-none focus:border-[rgba(249,115,22,0.3)] disabled:cursor-not-allowed disabled:opacity-50" className="w-full min-h-[300px] resize-y font-sans text-xs text-sm bg-card border border-border rounded-xl p-4 text-foreground focus:outline-none focus:border-[rgba(96,165,250,0.3)] disabled:cursor-not-allowed disabled:opacity-50"
placeholder='{ "parameters": [...] }' placeholder='{ "parameters": [...] }'
/> />
{jsonError && ( {jsonError && (

4
frontend/src/components/script-editor/ScriptTemplateEditor.tsx
View File

@@ -360,7 +360,7 @@ export function ScriptTemplateEditor({ templateId, onBack, onSaved }: Props) {
<select <select
value={form.category_id} value={form.category_id}
onChange={e => updateField('category_id', e.target.value)} onChange={e => updateField('category_id', e.target.value)}
className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(249,115,22,0.3)]" className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(96,165,250,0.3)]"
> >
<option value="">Select category…</option> <option value="">Select category…</option>
{categories.map(c => ( {categories.map(c => (
@@ -373,7 +373,7 @@ export function ScriptTemplateEditor({ templateId, onBack, onSaved }: Props) {
<select <select
value={form.complexity} value={form.complexity}
onChange={e => updateField('complexity', e.target.value as FormState['complexity'])} onChange={e => updateField('complexity', e.target.value as FormState['complexity'])}
className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(249,115,22,0.3)]" className="w-full rounded-lg border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(96,165,250,0.3)]"
> >
<option value="beginner">Beginner</option> <option value="beginner">Beginner</option>
<option value="intermediate">Intermediate</option> <option value="intermediate">Intermediate</option>

2
frontend/src/components/script-editor/ScriptTemplateListView.tsx
View File

@@ -105,7 +105,7 @@ export function ScriptTemplateListView({ onEdit, onCreate }: Props) {
value={searchQuery} value={searchQuery}
onChange={e => setSearchQuery(e.target.value)} onChange={e => setSearchQuery(e.target.value)}
placeholder="Search templates…" placeholder="Search templates…"
className="w-full pl-8 pr-3 py-1.5 text-sm rounded-md border border-border bg-card text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-[rgba(249,115,22,0.3)] focus:ring-1 focus:ring-[rgba(249,115,22,0.2)]" className="w-full pl-8 pr-3 py-1.5 text-sm rounded-md border border-border bg-card text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-[rgba(96,165,250,0.3)] focus:ring-1 focus:ring-[rgba(96,165,250,0.2)]"
/> />
</div> </div>

2
frontend/src/components/scripts/ScriptParameterField.tsx
View File

@@ -93,7 +93,7 @@ export function ScriptParameterField({ param, value, error, disabled }: Props) {
value={value} value={value}
onChange={handleChange} onChange={handleChange}
disabled={disabled} disabled={disabled}
className="w-full rounded-[10px] border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(249,115,22,0.3)] disabled:cursor-not-allowed disabled:opacity-50" className="w-full rounded-[10px] border border-border bg-card text-foreground px-3 py-2 text-sm focus:outline-none focus:border-[rgba(96,165,250,0.3)] disabled:cursor-not-allowed disabled:opacity-50"
> >
<option value="">Select…</option> <option value="">Select…</option>
{(param.options ?? []).map(opt => ( {(param.options ?? []).map(opt => (

4
frontend/src/components/session/AddSupportingDataModal.tsx
View File

@@ -166,7 +166,7 @@ export function AddSupportingDataModal({ isOpen, onClose, sessionId, onAdded }:
className={cn( className={cn(
'w-full rounded-md border border-border bg-card px-3 py-2 text-sm', 'w-full rounded-md border border-border bg-card px-3 py-2 text-sm',
'text-foreground placeholder:text-muted-foreground', 'text-foreground placeholder:text-muted-foreground',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20' 'focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20'
)} )}
/> />
</div> </div>
@@ -186,7 +186,7 @@ export function AddSupportingDataModal({ isOpen, onClose, sessionId, onAdded }:
className={cn( className={cn(
'w-full resize-y rounded-md border border-border bg-card px-3 py-2 text-sm', 'w-full resize-y rounded-md border border-border bg-card px-3 py-2 text-sm',
'font-mono text-foreground placeholder:text-muted-foreground', 'font-mono text-foreground placeholder:text-muted-foreground',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20' 'focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20'
)} )}
/> />
</div> </div>

2
frontend/src/components/session/TicketContextPanel.tsx
View File

@@ -62,7 +62,7 @@ export function TicketContextPanel({ context, loading, error, onRefresh }: Ticke
return ( return (
<div className="card-flat overflow-hidden rounded-lg"> <div className="card-flat overflow-hidden rounded-lg">
{/* Header */} {/* Header */}
<div className="flex items-center gap-2 bg-[rgba(249,115,22,0.05)] px-3 py-2.5"> <div className="flex items-center gap-2 bg-[rgba(96,165,250,0.05)] px-3 py-2.5">
<Ticket className="h-3.5 w-3.5 text-primary" /> <Ticket className="h-3.5 w-3.5 text-primary" />
<span className="flex-1 font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-primary"> <span className="flex-1 font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-primary">
Ticket Context Ticket Context

2
frontend/src/components/settings/BrandingSettings.tsx
View File

@@ -154,7 +154,7 @@ export function BrandingSettings({ teamId }: BrandingSettingsProps) {
className={cn( className={cn(
'mt-2 w-full max-w-md rounded-md border border-border bg-card px-3 py-2 text-sm', 'mt-2 w-full max-w-md rounded-md border border-border bg-card px-3 py-2 text-sm',
'text-foreground placeholder:text-muted-foreground', 'text-foreground placeholder:text-muted-foreground',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20' 'focus:border-[rgba(96,165,250,0.3)] focus:outline-hidden focus:ring-1 focus:ring-primary/20'
)} )}
/> />
</div> </div>

4
frontend/src/pages/AssistantChatPage.tsx
View File

@@ -664,7 +664,7 @@ export default function AssistantChatPage() {
'relative rounded-xl border transition-all', 'relative rounded-xl border transition-all',
loading ? 'border-border/50 opacity-50' : loading ? 'border-border/50 opacity-50' :
isDragOver ? 'border-primary/50 bg-primary/5' : isDragOver ? 'border-primary/50 bg-primary/5' :
'border-border focus-within:border-[rgba(249,115,22,0.3)] focus-within:ring-1 focus-within:ring-primary/20' 'border-border focus-within:border-[rgba(96,165,250,0.3)] focus-within:ring-1 focus-within:ring-primary/20'
)} style={{ background: 'var(--color-bg-card)' }}> )} style={{ background: 'var(--color-bg-card)' }}>
{/* Drag overlay */} {/* Drag overlay */}
{isDragOver && ( {isDragOver && (
@@ -734,7 +734,7 @@ export default function AssistantChatPage() {
onChange={(e) => setLogContent(e.target.value)} onChange={(e) => setLogContent(e.target.value)}
placeholder="Paste event viewer logs, error messages, PowerShell output..." placeholder="Paste event viewer logs, error messages, PowerShell output..."
rows={3} rows={3}
className="w-full resize-none rounded-lg border border-border bg-background p-2 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none" className="w-full resize-none rounded-lg border border-border bg-background p-2 font-mono text-xs text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none"
/> />
</div> </div>
)} )}

2
frontend/src/pages/FlowPilotSessionPage.tsx
View File

@@ -414,7 +414,7 @@ export default function FlowPilotSessionPage() {
value={resolutionSummary} value={resolutionSummary}
onChange={(e) => setResolutionSummary(e.target.value)} onChange={(e) => setResolutionSummary(e.target.value)}
placeholder="What resolved the issue?" placeholder="What resolved the issue?"
className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none resize-none" className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none resize-none"
rows={4} rows={4}
autoFocus autoFocus
/> />

4
frontend/src/pages/PublicTemplatesPage.tsx
View File

@@ -161,7 +161,7 @@ export default function PublicTemplatesPage() {
<div <div
className="fixed top-[-20%] right-[-10%] w-[600px] h-[600px] rounded-full pointer-events-none" className="fixed top-[-20%] right-[-10%] w-[600px] h-[600px] rounded-full pointer-events-none"
style={{ style={{
background: 'radial-gradient(circle, rgba(249,115,22,0.05) 0%, transparent 70%)', background: 'radial-gradient(circle, rgba(96,165,250,0.05) 0%, transparent 70%)',
}} }}
/> />
@@ -211,7 +211,7 @@ export default function PublicTemplatesPage() {
placeholder="Search templates..." placeholder="Search templates..."
value={searchQuery} value={searchQuery}
onChange={(e) => handleSearchChange(e.target.value)} onChange={(e) => handleSearchChange(e.target.value)}
className="w-full pl-12 pr-4 py-3.5 rounded-2xl text-sm bg-card border border-border text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-[rgba(249,115,22,0.3)] transition-colors" className="w-full pl-12 pr-4 py-3.5 rounded-2xl text-sm bg-card border border-border text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-[rgba(96,165,250,0.3)] transition-colors"
/> />
</div> </div>
</div> </div>

12
frontend/src/pages/SessionHistoryPage.tsx
View File

@@ -329,7 +329,7 @@ export function SessionHistoryPage() {
value={aiSearchInput} value={aiSearchInput}
onChange={(e) => setAiSearchInput(e.target.value)} onChange={(e) => setAiSearchInput(e.target.value)}
placeholder="Search sessions..." placeholder="Search sessions..."
className="w-full rounded-lg border border-border bg-card pl-8 pr-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none" className="w-full rounded-lg border border-border bg-card pl-8 pr-3 py-1.5 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none"
/> />
</div> </div>
@@ -356,7 +356,7 @@ export function SessionHistoryPage() {
value={aiFilters.problem_domain} value={aiFilters.problem_domain}
onChange={(e) => setAiFilters((f) => ({ ...f, problem_domain: e.target.value }))} onChange={(e) => setAiFilters((f) => ({ ...f, problem_domain: e.target.value }))}
title="Filter by problem domain" title="Filter by problem domain"
className="rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none [&>option]:bg-card [&>option]:text-foreground" className="rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none [&>option]:bg-card [&>option]:text-foreground"
> >
<option value="">All domains</option> <option value="">All domains</option>
<option value="Active Directory">Active Directory</option> <option value="Active Directory">Active Directory</option>
@@ -396,7 +396,7 @@ export function SessionHistoryPage() {
value={aiFilters.date_from} value={aiFilters.date_from}
onChange={(e) => setAiFilters((f) => ({ ...f, date_from: e.target.value }))} onChange={(e) => setAiFilters((f) => ({ ...f, date_from: e.target.value }))}
title="From date" title="From date"
className="rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none [color-scheme:dark]" className="rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none [color-scheme:dark]"
/> />
<span className="text-xs text-muted-foreground">to</span> <span className="text-xs text-muted-foreground">to</span>
<input <input
@@ -404,7 +404,7 @@ export function SessionHistoryPage() {
value={aiFilters.date_to} value={aiFilters.date_to}
onChange={(e) => setAiFilters((f) => ({ ...f, date_to: e.target.value }))} onChange={(e) => setAiFilters((f) => ({ ...f, date_to: e.target.value }))}
title="To date" title="To date"
className="rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none [color-scheme:dark]" className="rounded-lg border border-border bg-card px-3 py-1.5 text-sm text-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none [color-scheme:dark]"
/> />
</div> </div>
@@ -647,7 +647,7 @@ export function SessionHistoryPage() {
value={closeOutcome} value={closeOutcome}
onChange={(e) => setCloseOutcome(e.target.value as SessionOutcome)} onChange={(e) => setCloseOutcome(e.target.value as SessionOutcome)}
title="Session outcome" title="Session outcome"
className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none mb-3" className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none mb-3"
> >
<option value="">Select outcome...</option> <option value="">Select outcome...</option>
<option value="resolved">Resolved</option> <option value="resolved">Resolved</option>
@@ -664,7 +664,7 @@ export function SessionHistoryPage() {
onChange={(e) => setCloseNotes(e.target.value)} onChange={(e) => setCloseNotes(e.target.value)}
rows={2} rows={2}
placeholder="Add closure notes..." placeholder="Add closure notes..."
className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none resize-none mb-3" className="w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none resize-none mb-3"
/> />
<div className="flex items-center justify-end gap-2"> <div className="flex items-center justify-end gap-2">

14
frontend/src/pages/SurveyPage.tsx
View File

@@ -279,7 +279,7 @@ export default function SurveyPage() {
</div> </div>
<div className="relative z-10 mx-auto max-w-[680px] px-4 sm:px-5"> <div className="relative z-10 mx-auto max-w-[680px] px-4 sm:px-5">
<div className="text-center pt-20 sm:pt-32 animate-fade-in-up"> <div className="text-center pt-20 sm:pt-32 animate-fade-in-up">
<div className="w-16 h-16 mx-auto mb-5 rounded-full flex items-center justify-center" style={{ background: 'rgba(249, 115, 22, 0.10)' }}> <div className="w-16 h-16 mx-auto mb-5 rounded-full flex items-center justify-center" style={{ background: 'rgba(96, 165, 250, 0.10)' }}>
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="var(--color-primary)" strokeWidth="2.5"><path d="M20 6L9 17l-5-5"/></svg> <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="var(--color-primary)" strokeWidth="2.5"><path d="M20 6L9 17l-5-5"/></svg>
</div> </div>
<h2 className="font-heading text-2xl font-bold mb-2.5">Already Submitted</h2> <h2 className="font-heading text-2xl font-bold mb-2.5">Already Submitted</h2>
@@ -329,7 +329,7 @@ export default function SurveyPage() {
{/* Hero — visible only on first slide */} {/* Hero — visible only on first slide */}
{currentSlide === 0 && !isComplete && ( {currentSlide === 0 && !isComplete && (
<div className="text-center pt-10 pb-8 sm:pt-[72px] sm:pb-10 animate-fade-in-up"> <div className="text-center pt-10 pb-8 sm:pt-[72px] sm:pb-10 animate-fade-in-up">
<div className="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full text-[10px] sm:text-[11px] font-semibold font-sans text-xs uppercase tracking-widest mb-4 sm:mb-5" style={{ background: 'rgba(249, 115, 22, 0.10)', border: '1px solid rgba(249, 115, 22, 0.15)', color: 'var(--color-primary)' }}> <div className="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full text-[10px] sm:text-[11px] font-semibold font-sans text-xs uppercase tracking-widest mb-4 sm:mb-5" style={{ background: 'rgba(96, 165, 250, 0.10)', border: '1px solid rgba(96, 165, 250, 0.15)', color: 'var(--color-primary)' }}>
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M12 2L2 7l10 5 10-5-10-5z"/><path d="M2 17l10 5 10-5"/><path d="M2 12l10 5 10-5"/></svg> <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M12 2L2 7l10 5 10-5-10-5z"/><path d="M2 17l10 5 10-5"/><path d="M2 12l10 5 10-5"/></svg>
FlowPilot Research FlowPilot Research
</div> </div>
@@ -507,7 +507,7 @@ export default function SurveyPage() {
function ScenarioBox({ scenario }: { scenario: { title: string; symptom: string; details: string } }) { function ScenarioBox({ scenario }: { scenario: { title: string; symptom: string; details: string } }) {
return ( return (
<div className="rounded-lg p-3.5 px-4 sm:p-4 sm:px-5 mb-4 text-[13px]" style={{ background: 'rgba(249, 115, 22, 0.04)', border: '1px solid color-mix(in srgb, var(--color-primary) 12%, transparent)' }}> <div className="rounded-lg p-3.5 px-4 sm:p-4 sm:px-5 mb-4 text-[13px]" style={{ background: 'rgba(96, 165, 250, 0.04)', border: '1px solid color-mix(in srgb, var(--color-primary) 12%, transparent)' }}>
<div className="font-sans text-xs text-[10px] uppercase tracking-widest mb-2 font-semibold" style={{ color: 'var(--color-primary)' }}>{scenario.title}</div> <div className="font-sans text-xs text-[10px] uppercase tracking-widest mb-2 font-semibold" style={{ color: 'var(--color-primary)' }}>{scenario.title}</div>
<div className="sm:flex gap-2 mb-1"> <div className="sm:flex gap-2 mb-1">
<span className="text-muted-foreground font-medium whitespace-nowrap">Symptom:</span> <span className="text-muted-foreground font-medium whitespace-nowrap">Symptom:</span>
@@ -537,7 +537,7 @@ function QuestionCard({ question: q, answer, setAnswer }: { question: SurveyQues
onClick={() => setAnswer(q.id, opt)} onClick={() => setAnswer(q.id, opt)}
className="flex items-start gap-3 px-3.5 py-3 sm:px-4 rounded-[9px] text-left text-[13px] sm:text-sm transition-all duration-150 select-none" className="flex items-start gap-3 px-3.5 py-3 sm:px-4 rounded-[9px] text-left text-[13px] sm:text-sm transition-all duration-150 select-none"
style={{ style={{
background: answer === opt ? 'rgba(249, 115, 22, 0.10)' : 'rgba(16, 17, 20, 0.6)', background: answer === opt ? 'rgba(96, 165, 250, 0.10)' : 'rgba(16, 17, 20, 0.6)',
border: `1px solid ${answer === opt ? 'var(--color-primary)' : 'var(--color-border-default)'}`, border: `1px solid ${answer === opt ? 'var(--color-primary)' : 'var(--color-border-default)'}`,
color: answer === opt ? 'var(--color-foreground)' : 'var(--color-muted-foreground)', color: answer === opt ? 'var(--color-foreground)' : 'var(--color-muted-foreground)',
}} }}
@@ -564,7 +564,7 @@ function QuestionCard({ question: q, answer, setAnswer }: { question: SurveyQues
}} }}
className="flex items-start gap-3 px-3.5 py-3 sm:px-4 rounded-[9px] text-left text-[13px] sm:text-sm transition-all duration-150 select-none" className="flex items-start gap-3 px-3.5 py-3 sm:px-4 rounded-[9px] text-left text-[13px] sm:text-sm transition-all duration-150 select-none"
style={{ style={{
background: selected ? 'rgba(249, 115, 22, 0.10)' : 'rgba(16, 17, 20, 0.6)', background: selected ? 'rgba(96, 165, 250, 0.10)' : 'rgba(16, 17, 20, 0.6)',
border: `1px solid ${selected ? 'var(--color-primary)' : 'var(--color-border-default)'}`, border: `1px solid ${selected ? 'var(--color-primary)' : 'var(--color-border-default)'}`,
color: selected ? 'var(--color-foreground)' : 'var(--color-muted-foreground)', color: selected ? 'var(--color-foreground)' : 'var(--color-muted-foreground)',
}} }}
@@ -593,7 +593,7 @@ function QuestionCard({ question: q, answer, setAnswer }: { question: SurveyQues
background: 'rgba(16, 17, 20, 0.6)', background: 'rgba(16, 17, 20, 0.6)',
border: '1px solid var(--color-border-default)', border: '1px solid var(--color-border-default)',
}} }}
onFocus={e => { e.currentTarget.style.borderColor = 'var(--color-primary)'; e.currentTarget.style.boxShadow = '0 0 0 3px rgba(249, 115, 22, 0.10)' }} onFocus={e => { e.currentTarget.style.borderColor = 'var(--color-primary)'; e.currentTarget.style.boxShadow = '0 0 0 3px rgba(96, 165, 250, 0.10)' }}
onBlur={e => { e.currentTarget.style.borderColor = 'var(--color-border-default)'; e.currentTarget.style.boxShadow = 'none' }} onBlur={e => { e.currentTarget.style.borderColor = 'var(--color-border-default)'; e.currentTarget.style.boxShadow = 'none' }}
/> />
)} )}
@@ -717,7 +717,7 @@ function DragRank({ items, onChange }: { items: string[]; onChange: (items: stri
onTouchStart={() => handleTouchStart(idx)} onTouchStart={() => handleTouchStart(idx)}
className="flex items-center gap-2.5 sm:gap-3 px-3 py-3 sm:px-4 sm:py-2.5 rounded-[9px] text-[13px] sm:text-sm transition-all duration-150 select-none" className="flex items-center gap-2.5 sm:gap-3 px-3 py-3 sm:px-4 sm:py-2.5 rounded-[9px] text-[13px] sm:text-sm transition-all duration-150 select-none"
style={{ style={{
background: overIdx === idx ? 'rgba(249, 115, 22, 0.10)' : 'rgba(16, 17, 20, 0.6)', background: overIdx === idx ? 'rgba(96, 165, 250, 0.10)' : 'rgba(16, 17, 20, 0.6)',
border: `1px solid ${overIdx === idx || draggingIdx === idx ? 'var(--color-primary)' : 'var(--color-border-default)'}`, border: `1px solid ${overIdx === idx || draggingIdx === idx ? 'var(--color-primary)' : 'var(--color-border-default)'}`,
opacity: draggingIdx === idx ? 0.5 : 1, opacity: draggingIdx === idx ? 0.5 : 1,
cursor: 'grab', cursor: 'grab',

6
frontend/src/pages/account/BrandingSettingsPage.tsx
View File

@@ -137,7 +137,7 @@ export function BrandingSettingsPage() {
className={cn( className={cn(
'mt-1 w-full rounded-lg border border-border bg-card px-3 py-2 text-sm', 'mt-1 w-full rounded-lg border border-border bg-card px-3 py-2 text-sm',
'text-foreground placeholder:text-muted-foreground', 'text-foreground placeholder:text-muted-foreground',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-none focus:ring-1 focus:ring-primary/20' 'focus:border-[rgba(96,165,250,0.3)] focus:outline-none focus:ring-1 focus:ring-primary/20'
)} )}
/> />
<p className="mt-1 text-xs text-muted-foreground"> <p className="mt-1 text-xs text-muted-foreground">
@@ -163,7 +163,7 @@ export function BrandingSettingsPage() {
className={cn( className={cn(
'mt-1 w-full rounded-lg border border-border bg-card px-3 py-2 text-sm', 'mt-1 w-full rounded-lg border border-border bg-card px-3 py-2 text-sm',
'text-foreground placeholder:text-muted-foreground font-mono', 'text-foreground placeholder:text-muted-foreground font-mono',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-none focus:ring-1 focus:ring-primary/20' 'focus:border-[rgba(96,165,250,0.3)] focus:outline-none focus:ring-1 focus:ring-primary/20'
)} )}
/> />
<p className="mt-1 text-xs text-muted-foreground"> <p className="mt-1 text-xs text-muted-foreground">
@@ -212,7 +212,7 @@ export function BrandingSettingsPage() {
className={cn( className={cn(
'w-32 rounded-lg border border-border bg-card px-3 py-2 text-sm', 'w-32 rounded-lg border border-border bg-card px-3 py-2 text-sm',
'text-foreground placeholder:text-muted-foreground font-mono', 'text-foreground placeholder:text-muted-foreground font-mono',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-none focus:ring-1 focus:ring-primary/20' 'focus:border-[rgba(96,165,250,0.3)] focus:outline-none focus:ring-1 focus:ring-primary/20'
)} )}
/> />
<button <button

4
frontend/src/pages/account/IntegrationsPage.tsx
View File

@@ -813,7 +813,7 @@ function MemberMappingTab({ connection }: { connection: PsaConnectionResponse |
onChange={(e) => handleMemberChange(user.user_id, e.target.value)} onChange={(e) => handleMemberChange(user.user_id, e.target.value)}
className={cn( className={cn(
'w-full rounded-lg border bg-card px-3 py-1.5 text-sm text-foreground', 'w-full rounded-lg border bg-card px-3 py-1.5 text-sm text-foreground',
'border-border focus:border-[rgba(249,115,22,0.3)] focus:outline-none', 'border-border focus:border-[rgba(96,165,250,0.3)] focus:outline-none',
!currentMapping && 'text-muted-foreground' !currentMapping && 'text-muted-foreground'
)} )}
> >
@@ -1084,7 +1084,7 @@ function SettingSelect({
value={value} value={value}
onChange={(e) => onChange(e.target.value)} onChange={(e) => onChange(e.target.value)}
disabled={disabled} disabled={disabled}
className="w-full max-w-xs rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground focus:border-[rgba(249,115,22,0.3)] focus:outline-none disabled:opacity-50" className="w-full max-w-xs rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground focus:border-[rgba(96,165,250,0.3)] focus:outline-none disabled:opacity-50"
> >
{options.map((opt) => ( {options.map((opt) => (
<option key={opt.value} value={opt.value}>{opt.label}</option> <option key={opt.value} value={opt.value}>{opt.label}</option>

4
frontend/src/pages/admin/GalleryManagementPage.tsx
View File

@@ -90,7 +90,7 @@ function SortOrderInput({
}} }}
className={cn( className={cn(
'w-20 rounded-[8px] border border-border bg-card px-2 py-1 text-sm text-foreground', 'w-20 rounded-[8px] border border-border bg-card px-2 py-1 text-sm text-foreground',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-none', 'focus:border-[rgba(96,165,250,0.3)] focus:outline-none',
disabled && 'cursor-not-allowed opacity-50', disabled && 'cursor-not-allowed opacity-50',
)} )}
/> />
@@ -125,7 +125,7 @@ function FilterBar({
onChange={e => onSearchChange(e.target.value)} onChange={e => onSearchChange(e.target.value)}
className={cn( className={cn(
'w-full rounded-lg border border-border bg-card pl-9 pr-3 py-2 text-sm text-foreground placeholder:text-muted-foreground', 'w-full rounded-lg border border-border bg-card pl-9 pr-3 py-2 text-sm text-foreground placeholder:text-muted-foreground',
'focus:border-[rgba(249,115,22,0.3)] focus:outline-none', 'focus:border-[rgba(96,165,250,0.3)] focus:outline-none',
)} )}
/> />
</div> </div>

4
frontend/src/pages/admin/SurveyResponsesPage.tsx
View File

@@ -91,7 +91,7 @@ function ExpandedDetail({ response }: { response: SurveyResponseDetail }) {
className="px-6 py-5" className="px-6 py-5"
style={{ style={{
background: 'rgba(0, 0, 0, 0.15)', background: 'rgba(0, 0, 0, 0.15)',
borderTop: '1px solid rgba(249, 115, 22, 0.1)', borderTop: '1px solid rgba(96, 165, 250, 0.1)',
}} }}
> >
<div className="grid grid-cols-1 gap-3 md:grid-cols-2"> <div className="grid grid-cols-1 gap-3 md:grid-cols-2">
@@ -500,7 +500,7 @@ export default function SurveyResponsesPage() {
{selectedIds.size > 0 && ( {selectedIds.size > 0 && (
<div <div
className="flex items-center gap-3 rounded-xl px-4 py-2.5" className="flex items-center gap-3 rounded-xl px-4 py-2.5"
style={{ background: 'rgba(249, 115, 22, 0.08)', border: '1px solid rgba(249, 115, 22, 0.15)' }} style={{ background: 'rgba(96, 165, 250, 0.08)', border: '1px solid rgba(96, 165, 250, 0.15)' }}
> >
<span className="text-sm text-primary font-medium"> <span className="text-sm text-primary font-medium">
{selectedIds.size} selected {selectedIds.size} selected

22
frontend/src/styles/landing.css
View File

@@ -22,7 +22,7 @@
pointer-events: none; pointer-events: none;
z-index: 0; z-index: 0;
overflow: hidden; overflow: hidden;
background: radial-gradient(circle at 50% 0%, rgba(249, 115, 22, 0.12) 0%, transparent 60%); background: radial-gradient(circle at 50% 0%, rgba(96, 165, 250, 0.12) 0%, transparent 60%);
} }
.landing-ambient-glow::before, .landing-ambient-glow::before,
@@ -482,7 +482,7 @@
} }
.landing-preview-sidebar-item.active { .landing-preview-sidebar-item.active {
background: rgba(249, 115, 22, 0.08); background: rgba(96, 165, 250, 0.08);
color: var(--color-accent-text); color: var(--color-accent-text);
border-left: 3px solid var(--color-accent); border-left: 3px solid var(--color-accent);
} }
@@ -535,7 +535,7 @@
.landing-tree-connector { .landing-tree-connector {
width: 2px; width: 2px;
height: 24px; height: 24px;
background: rgba(249, 115, 22, 0.2); background: rgba(96, 165, 250, 0.2);
} }
.landing-tree-branch { .landing-tree-branch {
@@ -552,7 +552,7 @@
width: calc(100% - 100px); width: calc(100% - 100px);
transform: translateX(-50%); transform: translateX(-50%);
height: 2px; height: 2px;
background: rgba(249, 115, 22, 0.15); background: rgba(96, 165, 250, 0.15);
} }
.landing-tree-branch-arm { .landing-tree-branch-arm {
@@ -756,7 +756,7 @@
} }
.landing-step-card:hover { .landing-step-card:hover {
border-color: rgba(249, 115, 22, 0.2); border-color: rgba(96, 165, 250, 0.2);
} }
.landing-step-card::before { .landing-step-card::before {
@@ -814,9 +814,9 @@
} }
.landing-mock-node.start { .landing-mock-node.start {
background: rgba(249, 115, 22, 0.15); background: rgba(96, 165, 250, 0.15);
color: var(--color-accent-text); color: var(--color-accent-text);
border: 1px solid rgba(249, 115, 22, 0.2); border: 1px solid rgba(96, 165, 250, 0.2);
} }
.landing-mock-node.step { .landing-mock-node.step {
@@ -920,7 +920,7 @@
} }
.landing-feature-card:hover { .landing-feature-card:hover {
border-color: rgba(249, 115, 22, 0.2); border-color: rgba(96, 165, 250, 0.2);
transform: translateY(-3px); transform: translateY(-3px);
} }
@@ -928,7 +928,7 @@
width: 40px; width: 40px;
height: 40px; height: 40px;
border-radius: 10px; border-radius: 10px;
background: rgba(249, 115, 22, 0.08); background: rgba(96, 165, 250, 0.08);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -951,7 +951,7 @@
} }
.landing-feature-card.highlight { .landing-feature-card.highlight {
border-color: rgba(249, 115, 22, 0.15); border-color: rgba(96, 165, 250, 0.15);
background: var(--color-bg-card); background: var(--color-bg-card);
grid-column: span 2; grid-column: span 2;
} }
@@ -1228,7 +1228,7 @@
.landing-cta-email-input:focus { .landing-cta-email-input:focus {
border-color: #f97316; border-color: #f97316;
box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.1); box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1);
} }
.landing-cta-fine-print { .landing-cta-fine-print {