0447b69b82
4 banner inline style 중복 (warning 황색 / error 적색 / info 청색) → <Banner severity="warning|error|info"> wrapper. THEMES map 단일 source. - ExpiryBanner: warning - OllamaBanner: warning - FailedBanner: error - RecallBanner: info OllamaSettingsModal 은 modal 형식이라 banner 와 분리 (별개 inline style 유지). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
28 lines
752 B
TypeScript
28 lines
752 B
TypeScript
import React from 'react';
|
|
|
|
/**
|
|
* v0.2.6 #24+#41 — 4 banner 의 inline style 중복 제거. severity 별 theme map.
|
|
*/
|
|
const THEMES = {
|
|
warning: { bg: '#fff7e6', border: '#d99500', text: '#946100' },
|
|
error: { bg: '#fce4e4', border: '#a33', text: '#a33' },
|
|
info: { bg: '#e8f0fe', border: '#4a7ec0', text: '#234' }
|
|
} as const;
|
|
|
|
interface Props {
|
|
severity: 'warning' | 'error' | 'info';
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export function Banner({ severity, children }: Props): React.ReactElement {
|
|
const t = THEMES[severity];
|
|
return (
|
|
<div style={{
|
|
background: t.bg, border: `1px solid ${t.border}`, color: t.text,
|
|
borderRadius: 6, padding: '8px 12px', margin: '8px 0', fontSize: 13
|
|
}}>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|