feat: replace all hardcoded orange rgba with blue rgba
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:
@@ -95,7 +95,7 @@ export default function PsaMetricsPanel({ data }: PsaMetricsPanelProps) {
|
||||
<Bar
|
||||
yAxisId="entries"
|
||||
dataKey="entries"
|
||||
fill="rgba(249,115,22,0.3)"
|
||||
fill="rgba(96,165,250,0.3)"
|
||||
radius={[4, 4, 0, 0]}
|
||||
/>
|
||||
<Area
|
||||
|
||||
@@ -8,19 +8,19 @@ export function FlowIllustration() {
|
||||
return (
|
||||
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
{/* 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 */}
|
||||
<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" />
|
||||
{/* 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 */}
|
||||
<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 */}
|
||||
<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" />
|
||||
<circle cx="12" cy="54" r="3" fill="rgba(249,115,22,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="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(96,165,250,0.15)" stroke="#f97316" strokeWidth="1" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
@@ -29,10 +29,10 @@ export function AnalyticsIllustration() {
|
||||
return (
|
||||
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
{/* 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="26" y="28" width="10" height="26" rx="2" fill="rgba(249,115,22,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="54" y="10" width="10" height="44" rx="2" fill="rgba(249,115,22,0.15)" stroke="#f97316" 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(96,165,250,0.15)" stroke="#f97316" 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(96,165,250,0.15)" stroke="#f97316" strokeWidth="1.5" />
|
||||
{/* Baseline */}
|
||||
<line x1="8" y1="56" x2="72" y2="56" stroke="#ea580c" strokeWidth="1" opacity="0.5" />
|
||||
</svg>
|
||||
@@ -43,15 +43,15 @@ export function SessionIllustration() {
|
||||
return (
|
||||
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
{/* 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" />
|
||||
<line x1="28" y1="14" x2="56" y2="14" stroke="#ea580c" strokeWidth="1" opacity="0.5" />
|
||||
{/* 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" />
|
||||
<line x1="28" y1="30" x2="52" y2="30" stroke="#f97316" strokeWidth="1" opacity="0.5" />
|
||||
{/* 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" />
|
||||
<line x1="28" y1="46" x2="48" y2="46" stroke="#ea580c" strokeWidth="1" opacity="0.5" />
|
||||
</svg>
|
||||
@@ -62,11 +62,11 @@ export function IntegrationIllustration() {
|
||||
return (
|
||||
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
{/* 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="30" x2="20" y2="30" stroke="#ea580c" strokeWidth="1" opacity="0.4" />
|
||||
{/* 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="30" x2="66" y2="30" stroke="#f97316" strokeWidth="1" opacity="0.4" />
|
||||
{/* Dashed arrows */}
|
||||
@@ -83,13 +83,13 @@ export function StepLibraryIllustration() {
|
||||
return (
|
||||
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
{/* 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" />
|
||||
<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" />
|
||||
<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" />
|
||||
<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" />
|
||||
</svg>
|
||||
)
|
||||
@@ -99,7 +99,7 @@ export function ScriptIllustration() {
|
||||
return (
|
||||
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
{/* 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 */}
|
||||
<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" />
|
||||
@@ -117,11 +117,11 @@ export function ShareIllustration() {
|
||||
return (
|
||||
<svg width="80" height="60" viewBox="0 0 80 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
{/* 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 */}
|
||||
<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 */}
|
||||
<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 */}
|
||||
<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" />
|
||||
|
||||
@@ -234,7 +234,7 @@ export function RichTextInput({
|
||||
disabled={disabled}
|
||||
className={cn(
|
||||
'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',
|
||||
disabled && 'opacity-50 cursor-not-allowed'
|
||||
)}
|
||||
|
||||
@@ -16,9 +16,9 @@ interface RecentActivityProps {
|
||||
|
||||
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: '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: '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' },
|
||||
]
|
||||
|
||||
|
||||
@@ -200,7 +200,7 @@ export function StartSessionInput() {
|
||||
<div className={cn(
|
||||
'relative rounded-2xl border bg-card transition-all',
|
||||
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 */}
|
||||
{isDragOver && (
|
||||
@@ -278,7 +278,7 @@ export function StartSessionInput() {
|
||||
onChange={(e) => setLogContent(e.target.value)}
|
||||
placeholder="Paste event viewer logs, error messages, PowerShell output..."
|
||||
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>
|
||||
)}
|
||||
|
||||
@@ -152,7 +152,7 @@ export function FlowPilotActionBar({
|
||||
value={resolutionSummary}
|
||||
onChange={(e) => setResolutionSummary(e.target.value)}
|
||||
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}
|
||||
autoFocus
|
||||
/>
|
||||
|
||||
@@ -166,7 +166,7 @@ export function FlowPilotIntake({ onSubmit, isLoading, defaultProblem }: FlowPil
|
||||
value={additionalContext}
|
||||
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'"
|
||||
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}
|
||||
/>
|
||||
</div>
|
||||
@@ -229,7 +229,7 @@ export function FlowPilotIntake({ onSubmit, isLoading, defaultProblem }: FlowPil
|
||||
value={logContent}
|
||||
onChange={(e) => setLogContent(e.target.value)}
|
||||
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}
|
||||
/>
|
||||
)}
|
||||
|
||||
@@ -194,7 +194,7 @@ export function FlowPilotMessageBar({ onRespond, disabled = false, isProcessing
|
||||
? 'border-border/50 opacity-50'
|
||||
: 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)' }}
|
||||
>
|
||||
@@ -275,7 +275,7 @@ export function FlowPilotMessageBar({ onRespond, disabled = false, isProcessing
|
||||
onChange={(e) => setLogContent(e.target.value)}
|
||||
placeholder="Paste event viewer logs, error messages, PowerShell output..."
|
||||
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>
|
||||
)}
|
||||
|
||||
@@ -29,7 +29,7 @@ export function FlowPilotOptions({ options, onSelect, disabled }: FlowPilotOptio
|
||||
disabled={disabled}
|
||||
className={cn(
|
||||
'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',
|
||||
isSelected
|
||||
? 'border-primary/40 bg-accent-dim'
|
||||
|
||||
@@ -96,7 +96,7 @@ export function InSessionScriptGenerator({
|
||||
<input
|
||||
value={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>
|
||||
))}
|
||||
|
||||
@@ -187,7 +187,7 @@ export function ProposalDetail({ proposal, onReview }: ProposalDetailProps) {
|
||||
value={reviewNotes}
|
||||
onChange={(e) => setReviewNotes(e.target.value)}
|
||||
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 */}
|
||||
|
||||
@@ -145,7 +145,7 @@ export function SessionBriefing({
|
||||
value={freshContext}
|
||||
onChange={(e) => setFreshContext(e.target.value)}
|
||||
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}
|
||||
autoFocus
|
||||
/>
|
||||
|
||||
@@ -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',
|
||||
active
|
||||
? 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'
|
||||
: 'text-muted-foreground hover:bg-input hover:text-foreground'
|
||||
)}
|
||||
|
||||
@@ -60,7 +60,7 @@ export function InlineVariablePrompt({
|
||||
className={cn(
|
||||
'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',
|
||||
'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',
|
||||
isRequired && 'ring-1 ring-orange-500/20'
|
||||
)}
|
||||
@@ -88,7 +88,7 @@ export function InlineVariablePrompt({
|
||||
onBlur={() => {
|
||||
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>
|
||||
{options.map((opt) => (
|
||||
@@ -117,7 +117,7 @@ export function InlineVariablePrompt({
|
||||
onBlur={handleSubmit}
|
||||
onKeyDown={handleKeyDown}
|
||||
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 && (
|
||||
<span className="absolute -bottom-5 left-0 text-[0.625rem] text-muted-foreground whitespace-nowrap">
|
||||
|
||||
@@ -122,7 +122,7 @@ export function PrepareSessionModal({
|
||||
value={ticketNumber}
|
||||
onChange={(e) => setTicketNumber(e.target.value)}
|
||||
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>
|
||||
@@ -132,7 +132,7 @@ export function PrepareSessionModal({
|
||||
value={clientName}
|
||||
onChange={(e) => setClientName(e.target.value)}
|
||||
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>
|
||||
@@ -147,7 +147,7 @@ export function PrepareSessionModal({
|
||||
<select
|
||||
value={assignedToId}
|
||||
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>
|
||||
{teamMembers.map(m => (
|
||||
@@ -178,7 +178,7 @@ export function PrepareSessionModal({
|
||||
<select
|
||||
value={values[field.variable_name] || ''}
|
||||
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>
|
||||
{field.options.map(opt => (
|
||||
@@ -191,7 +191,7 @@ export function PrepareSessionModal({
|
||||
onChange={(e) => handleFieldChange(field.variable_name, e.target.value)}
|
||||
placeholder={field.placeholder}
|
||||
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
|
||||
@@ -199,7 +199,7 @@ export function PrepareSessionModal({
|
||||
value={values[field.variable_name] || ''}
|
||||
onChange={(e) => handleFieldChange(field.variable_name, e.target.value)}
|
||||
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 && (
|
||||
|
||||
@@ -56,7 +56,7 @@ export function ScriptBuilderChat({
|
||||
)}
|
||||
>
|
||||
{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" />
|
||||
</div>
|
||||
)}
|
||||
@@ -65,7 +65,7 @@ export function ScriptBuilderChat({
|
||||
className={cn(
|
||||
"max-w-[85%] rounded-xl px-4 py-3 text-sm",
|
||||
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"
|
||||
)}
|
||||
>
|
||||
@@ -98,7 +98,7 @@ export function ScriptBuilderChat({
|
||||
|
||||
{isLoading && (
|
||||
<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" />
|
||||
</div>
|
||||
<div className="card-flat rounded-xl px-4 py-3 text-sm flex items-center gap-2">
|
||||
|
||||
@@ -56,7 +56,7 @@ export function ScriptBuilderInput({
|
||||
className={cn(
|
||||
"flex-1 resize-none rounded-xl px-4 py-2.5 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",
|
||||
"focus:outline-none focus:border-[rgba(96,165,250,0.3)] transition-colors",
|
||||
"disabled:opacity-50"
|
||||
)}
|
||||
style={{ maxHeight: 120 }}
|
||||
|
||||
@@ -104,7 +104,7 @@ export function ParameterCard({
|
||||
value={param.type}
|
||||
onChange={e => update({ type: e.target.value as ScriptParameter['type'] })}
|
||||
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 => (
|
||||
<option key={t.value} value={t.value}>{t.label}</option>
|
||||
|
||||
@@ -174,7 +174,7 @@ export function ParameterDetectorStepper({
|
||||
<select
|
||||
value={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 => (
|
||||
<option key={t.value} value={t.value}>{t.label}</option>
|
||||
|
||||
@@ -159,7 +159,7 @@ export function ParameterSchemaBuilder({ schema, onChange, disabled }: Props) {
|
||||
onChange={e => { setJsonText(e.target.value); setJsonError(null) }}
|
||||
disabled={disabled}
|
||||
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": [...] }'
|
||||
/>
|
||||
{jsonError && (
|
||||
|
||||
@@ -360,7 +360,7 @@ export function ScriptTemplateEditor({ templateId, onBack, onSaved }: Props) {
|
||||
<select
|
||||
value={form.category_id}
|
||||
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>
|
||||
{categories.map(c => (
|
||||
@@ -373,7 +373,7 @@ export function ScriptTemplateEditor({ templateId, onBack, onSaved }: Props) {
|
||||
<select
|
||||
value={form.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="intermediate">Intermediate</option>
|
||||
|
||||
@@ -105,7 +105,7 @@ export function ScriptTemplateListView({ onEdit, onCreate }: Props) {
|
||||
value={searchQuery}
|
||||
onChange={e => setSearchQuery(e.target.value)}
|
||||
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>
|
||||
|
||||
|
||||
@@ -93,7 +93,7 @@ export function ScriptParameterField({ param, value, error, disabled }: Props) {
|
||||
value={value}
|
||||
onChange={handleChange}
|
||||
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>
|
||||
{(param.options ?? []).map(opt => (
|
||||
|
||||
@@ -166,7 +166,7 @@ export function AddSupportingDataModal({ isOpen, onClose, sessionId, onAdded }:
|
||||
className={cn(
|
||||
'w-full rounded-md 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-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>
|
||||
@@ -186,7 +186,7 @@ export function AddSupportingDataModal({ isOpen, onClose, sessionId, onAdded }:
|
||||
className={cn(
|
||||
'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',
|
||||
'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>
|
||||
|
||||
@@ -62,7 +62,7 @@ export function TicketContextPanel({ context, loading, error, onRefresh }: Ticke
|
||||
return (
|
||||
<div className="card-flat overflow-hidden rounded-lg">
|
||||
{/* 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" />
|
||||
<span className="flex-1 font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-primary">
|
||||
Ticket Context
|
||||
|
||||
@@ -154,7 +154,7 @@ export function BrandingSettings({ teamId }: BrandingSettingsProps) {
|
||||
className={cn(
|
||||
'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',
|
||||
'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>
|
||||
|
||||
@@ -664,7 +664,7 @@ export default function AssistantChatPage() {
|
||||
'relative rounded-xl border transition-all',
|
||||
loading ? 'border-border/50 opacity-50' :
|
||||
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)' }}>
|
||||
{/* Drag overlay */}
|
||||
{isDragOver && (
|
||||
@@ -734,7 +734,7 @@ export default function AssistantChatPage() {
|
||||
onChange={(e) => setLogContent(e.target.value)}
|
||||
placeholder="Paste event viewer logs, error messages, PowerShell output..."
|
||||
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>
|
||||
)}
|
||||
|
||||
@@ -414,7 +414,7 @@ export default function FlowPilotSessionPage() {
|
||||
value={resolutionSummary}
|
||||
onChange={(e) => setResolutionSummary(e.target.value)}
|
||||
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}
|
||||
autoFocus
|
||||
/>
|
||||
|
||||
@@ -161,7 +161,7 @@ export default function PublicTemplatesPage() {
|
||||
<div
|
||||
className="fixed top-[-20%] right-[-10%] w-[600px] h-[600px] rounded-full pointer-events-none"
|
||||
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..."
|
||||
value={searchQuery}
|
||||
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>
|
||||
|
||||
@@ -329,7 +329,7 @@ export function SessionHistoryPage() {
|
||||
value={aiSearchInput}
|
||||
onChange={(e) => setAiSearchInput(e.target.value)}
|
||||
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>
|
||||
|
||||
@@ -356,7 +356,7 @@ export function SessionHistoryPage() {
|
||||
value={aiFilters.problem_domain}
|
||||
onChange={(e) => setAiFilters((f) => ({ ...f, problem_domain: e.target.value }))}
|
||||
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="Active Directory">Active Directory</option>
|
||||
@@ -396,7 +396,7 @@ export function SessionHistoryPage() {
|
||||
value={aiFilters.date_from}
|
||||
onChange={(e) => setAiFilters((f) => ({ ...f, date_from: e.target.value }))}
|
||||
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>
|
||||
<input
|
||||
@@ -404,7 +404,7 @@ export function SessionHistoryPage() {
|
||||
value={aiFilters.date_to}
|
||||
onChange={(e) => setAiFilters((f) => ({ ...f, date_to: e.target.value }))}
|
||||
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>
|
||||
|
||||
@@ -647,7 +647,7 @@ export function SessionHistoryPage() {
|
||||
value={closeOutcome}
|
||||
onChange={(e) => setCloseOutcome(e.target.value as SessionOutcome)}
|
||||
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="resolved">Resolved</option>
|
||||
@@ -664,7 +664,7 @@ export function SessionHistoryPage() {
|
||||
onChange={(e) => setCloseNotes(e.target.value)}
|
||||
rows={2}
|
||||
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">
|
||||
|
||||
@@ -279,7 +279,7 @@ export default function SurveyPage() {
|
||||
</div>
|
||||
<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="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>
|
||||
</div>
|
||||
<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 */}
|
||||
{currentSlide === 0 && !isComplete && (
|
||||
<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>
|
||||
FlowPilot Research
|
||||
</div>
|
||||
@@ -507,7 +507,7 @@ export default function SurveyPage() {
|
||||
|
||||
function ScenarioBox({ scenario }: { scenario: { title: string; symptom: string; details: string } }) {
|
||||
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="sm:flex gap-2 mb-1">
|
||||
<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)}
|
||||
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={{
|
||||
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)'}`,
|
||||
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"
|
||||
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)'}`,
|
||||
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)',
|
||||
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' }}
|
||||
/>
|
||||
)}
|
||||
@@ -717,7 +717,7 @@ function DragRank({ items, onChange }: { items: string[]; onChange: (items: stri
|
||||
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"
|
||||
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)'}`,
|
||||
opacity: draggingIdx === idx ? 0.5 : 1,
|
||||
cursor: 'grab',
|
||||
|
||||
@@ -137,7 +137,7 @@ export function BrandingSettingsPage() {
|
||||
className={cn(
|
||||
'mt-1 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 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">
|
||||
@@ -163,7 +163,7 @@ export function BrandingSettingsPage() {
|
||||
className={cn(
|
||||
'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',
|
||||
'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">
|
||||
@@ -212,7 +212,7 @@ export function BrandingSettingsPage() {
|
||||
className={cn(
|
||||
'w-32 rounded-lg border border-border bg-card px-3 py-2 text-sm',
|
||||
'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
|
||||
|
||||
@@ -813,7 +813,7 @@ function MemberMappingTab({ connection }: { connection: PsaConnectionResponse |
|
||||
onChange={(e) => handleMemberChange(user.user_id, e.target.value)}
|
||||
className={cn(
|
||||
'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'
|
||||
)}
|
||||
>
|
||||
@@ -1084,7 +1084,7 @@ function SettingSelect({
|
||||
value={value}
|
||||
onChange={(e) => onChange(e.target.value)}
|
||||
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) => (
|
||||
<option key={opt.value} value={opt.value}>{opt.label}</option>
|
||||
|
||||
@@ -90,7 +90,7 @@ function SortOrderInput({
|
||||
}}
|
||||
className={cn(
|
||||
'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',
|
||||
)}
|
||||
/>
|
||||
@@ -125,7 +125,7 @@ function FilterBar({
|
||||
onChange={e => onSearchChange(e.target.value)}
|
||||
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',
|
||||
'focus:border-[rgba(249,115,22,0.3)] focus:outline-none',
|
||||
'focus:border-[rgba(96,165,250,0.3)] focus:outline-none',
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -91,7 +91,7 @@ function ExpandedDetail({ response }: { response: SurveyResponseDetail }) {
|
||||
className="px-6 py-5"
|
||||
style={{
|
||||
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">
|
||||
@@ -500,7 +500,7 @@ export default function SurveyResponsesPage() {
|
||||
{selectedIds.size > 0 && (
|
||||
<div
|
||||
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">
|
||||
{selectedIds.size} selected
|
||||
|
||||
@@ -22,7 +22,7 @@
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
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,
|
||||
@@ -482,7 +482,7 @@
|
||||
}
|
||||
|
||||
.landing-preview-sidebar-item.active {
|
||||
background: rgba(249, 115, 22, 0.08);
|
||||
background: rgba(96, 165, 250, 0.08);
|
||||
color: var(--color-accent-text);
|
||||
border-left: 3px solid var(--color-accent);
|
||||
}
|
||||
@@ -535,7 +535,7 @@
|
||||
.landing-tree-connector {
|
||||
width: 2px;
|
||||
height: 24px;
|
||||
background: rgba(249, 115, 22, 0.2);
|
||||
background: rgba(96, 165, 250, 0.2);
|
||||
}
|
||||
|
||||
.landing-tree-branch {
|
||||
@@ -552,7 +552,7 @@
|
||||
width: calc(100% - 100px);
|
||||
transform: translateX(-50%);
|
||||
height: 2px;
|
||||
background: rgba(249, 115, 22, 0.15);
|
||||
background: rgba(96, 165, 250, 0.15);
|
||||
}
|
||||
|
||||
.landing-tree-branch-arm {
|
||||
@@ -756,7 +756,7 @@
|
||||
}
|
||||
|
||||
.landing-step-card:hover {
|
||||
border-color: rgba(249, 115, 22, 0.2);
|
||||
border-color: rgba(96, 165, 250, 0.2);
|
||||
}
|
||||
|
||||
.landing-step-card::before {
|
||||
@@ -814,9 +814,9 @@
|
||||
}
|
||||
|
||||
.landing-mock-node.start {
|
||||
background: rgba(249, 115, 22, 0.15);
|
||||
background: rgba(96, 165, 250, 0.15);
|
||||
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 {
|
||||
@@ -920,7 +920,7 @@
|
||||
}
|
||||
|
||||
.landing-feature-card:hover {
|
||||
border-color: rgba(249, 115, 22, 0.2);
|
||||
border-color: rgba(96, 165, 250, 0.2);
|
||||
transform: translateY(-3px);
|
||||
}
|
||||
|
||||
@@ -928,7 +928,7 @@
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 10px;
|
||||
background: rgba(249, 115, 22, 0.08);
|
||||
background: rgba(96, 165, 250, 0.08);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -951,7 +951,7 @@
|
||||
}
|
||||
|
||||
.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);
|
||||
grid-column: span 2;
|
||||
}
|
||||
@@ -1228,7 +1228,7 @@
|
||||
|
||||
.landing-cta-email-input:focus {
|
||||
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 {
|
||||
|
||||
Reference in New Issue
Block a user