feat: Go backend, enhanced search, new widgets, Docker deploy
Major changes: - Add Go backend (backend/) with microservices architecture - Enhanced master-agents-svc: reranker, content-classifier, stealth-crawler, proxy-manager, media-search, fastClassifier, language detection - New web-svc widgets: KnowledgeCard, ProductCard, ProfileCard, VideoCard, UnifiedCard, CardGallery, InlineImageGallery, SourcesPanel, RelatedQuestions - Improved discover-svc with discover-db integration - Docker deployment improvements (Caddyfile, vendor.sh, BUILD.md) - Library-svc: project_id schema migration - Remove deprecated finance-svc and travel-svc - Localization improvements across services Made-with: Cursor
This commit is contained in:
home
522
backend/webui/src/app/globals.css
Normal file
522
backend/webui/src/app/globals.css
Normal file
@@ -0,0 +1,522 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap');
|
||||
|
||||
:root {
|
||||
/* Cursor IDE 2026 Dark Theme */
|
||||
/* Base backgrounds - very dark with slight blue tint */
|
||||
--bg-base: 240 6% 4%;
|
||||
--bg-elevated: 240 6% 8%;
|
||||
--bg-surface: 240 5% 11%;
|
||||
--bg-overlay: 240 5% 14%;
|
||||
--bg-muted: 240 4% 18%;
|
||||
|
||||
/* Text colors - zinc-based for readability */
|
||||
--text-primary: 240 5% 92%;
|
||||
--text-secondary: 240 4% 68%;
|
||||
--text-muted: 240 4% 48%;
|
||||
--text-faint: 240 3% 38%;
|
||||
|
||||
/* Accent colors - indigo/purple like Cursor */
|
||||
--accent: 239 84% 67%;
|
||||
--accent-hover: 239 84% 74%;
|
||||
--accent-muted: 239 60% 55%;
|
||||
--accent-subtle: 239 40% 25%;
|
||||
|
||||
/* Secondary accent - cyan for variety */
|
||||
--accent-secondary: 187 85% 55%;
|
||||
--accent-secondary-muted: 187 60% 40%;
|
||||
|
||||
/* Semantic colors */
|
||||
--success: 142 71% 45%;
|
||||
--success-muted: 142 50% 35%;
|
||||
--warning: 38 92% 50%;
|
||||
--warning-muted: 38 70% 40%;
|
||||
--error: 0 72% 51%;
|
||||
--error-muted: 0 60% 40%;
|
||||
|
||||
/* Border colors */
|
||||
--border: 240 4% 16%;
|
||||
--border-hover: 240 4% 22%;
|
||||
--border-focus: 239 60% 50%;
|
||||
|
||||
/* Legacy mappings for compatibility */
|
||||
--background: var(--bg-base);
|
||||
--foreground: var(--text-primary);
|
||||
--card: var(--bg-elevated);
|
||||
--card-foreground: var(--text-primary);
|
||||
--popover: var(--bg-surface);
|
||||
--popover-foreground: var(--text-primary);
|
||||
--primary: var(--accent);
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: var(--bg-surface);
|
||||
--secondary-foreground: var(--text-secondary);
|
||||
--muted: var(--bg-muted);
|
||||
--muted-foreground: var(--text-muted);
|
||||
--accent-color: var(--accent);
|
||||
--accent-foreground: 0 0% 100%;
|
||||
--destructive: var(--error);
|
||||
--destructive-foreground: 0 0% 100%;
|
||||
--input: var(--bg-surface);
|
||||
--ring: var(--accent);
|
||||
--radius: 0.75rem;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
background: hsl(var(--bg-base));
|
||||
color: hsl(var(--text-primary));
|
||||
min-height: 100vh;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
/* Gradient backgrounds */
|
||||
.bg-gradient-main {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
hsl(240 6% 4%) 0%,
|
||||
hsl(240 6% 5%) 50%,
|
||||
hsl(240 5% 6%) 100%
|
||||
);
|
||||
}
|
||||
|
||||
.bg-gradient-elevated {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
hsl(240 6% 9% / 0.9) 0%,
|
||||
hsl(240 6% 7% / 0.8) 100%
|
||||
);
|
||||
}
|
||||
|
||||
.bg-gradient-card {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
hsl(240 5% 11% / 0.6) 0%,
|
||||
hsl(240 5% 9% / 0.4) 100%
|
||||
);
|
||||
}
|
||||
|
||||
/* Accent gradient for special elements */
|
||||
.bg-gradient-accent {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(239 84% 67%) 0%,
|
||||
hsl(260 84% 67%) 50%,
|
||||
hsl(239 84% 67%) 100%
|
||||
);
|
||||
}
|
||||
|
||||
/* Text gradient */
|
||||
.text-gradient {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(239 84% 74%) 0%,
|
||||
hsl(260 90% 75%) 50%,
|
||||
hsl(187 85% 65%) 100%
|
||||
);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
/* Gradient border button */
|
||||
.btn-gradient {
|
||||
position: relative;
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 0.75rem;
|
||||
padding: 0.625rem 1rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: hsl(239 84% 74%);
|
||||
transition: all 0.15s ease;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.btn-gradient::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border-radius: 0.75rem;
|
||||
padding: 1.5px;
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(239 84% 74%) 0%,
|
||||
hsl(260 90% 75%) 50%,
|
||||
hsl(187 85% 65%) 100%
|
||||
);
|
||||
-webkit-mask:
|
||||
linear-gradient(#fff 0 0) content-box,
|
||||
linear-gradient(#fff 0 0);
|
||||
-webkit-mask-composite: xor;
|
||||
mask-composite: exclude;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.btn-gradient:hover {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(239 84% 74% / 0.1) 0%,
|
||||
hsl(260 90% 75% / 0.1) 50%,
|
||||
hsl(187 85% 65% / 0.1) 100%
|
||||
);
|
||||
}
|
||||
|
||||
.btn-gradient:active {
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
/* Gradient border - larger version */
|
||||
.btn-gradient-lg {
|
||||
position: relative;
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 0.75rem;
|
||||
padding: 0.75rem 1.25rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: hsl(239 84% 74%);
|
||||
transition: all 0.15s ease;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.btn-gradient-lg::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border-radius: 0.75rem;
|
||||
padding: 2px;
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(239 84% 74%) 0%,
|
||||
hsl(260 90% 75%) 50%,
|
||||
hsl(187 85% 65%) 100%
|
||||
);
|
||||
-webkit-mask:
|
||||
linear-gradient(#fff 0 0) content-box,
|
||||
linear-gradient(#fff 0 0);
|
||||
-webkit-mask-composite: xor;
|
||||
mask-composite: exclude;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.btn-gradient-lg:hover {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(239 84% 74% / 0.1) 0%,
|
||||
hsl(260 90% 75% / 0.1) 50%,
|
||||
hsl(187 85% 65% / 0.1) 100%
|
||||
);
|
||||
}
|
||||
|
||||
/* Gradient text for buttons */
|
||||
.btn-gradient-text {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(239 84% 74%) 0%,
|
||||
hsl(260 90% 75%) 50%,
|
||||
hsl(187 85% 65%) 100%
|
||||
);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
/* Modern thin scrollbars */
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: hsl(240 4% 20%);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: hsl(240 4% 28%);
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: hsl(239 84% 67% / 0.3);
|
||||
}
|
||||
|
||||
/* Code font */
|
||||
.font-mono {
|
||||
font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, monospace;
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border;
|
||||
}
|
||||
}
|
||||
|
||||
@layer components {
|
||||
/* Glass morphism card */
|
||||
.glass-card {
|
||||
@apply bg-surface/60 backdrop-blur-xl border border-border rounded-2xl;
|
||||
}
|
||||
|
||||
/* Surface card with hover */
|
||||
.surface-card {
|
||||
@apply bg-elevated/40 backdrop-blur-sm border border-border/50 rounded-xl;
|
||||
@apply transition-all duration-200;
|
||||
}
|
||||
|
||||
.surface-card:hover {
|
||||
@apply border-border-hover bg-elevated/60;
|
||||
}
|
||||
|
||||
/* Input styles */
|
||||
.input-cursor {
|
||||
@apply bg-surface/50 border border-border rounded-xl px-4 py-3;
|
||||
@apply text-primary placeholder:text-muted;
|
||||
@apply focus:outline-none focus:border-accent/50 focus:ring-1 focus:ring-accent/20;
|
||||
@apply transition-all duration-200;
|
||||
}
|
||||
|
||||
/* Primary button - gradient accent */
|
||||
.btn-primary {
|
||||
@apply bg-accent/10 text-accent-foreground border border-accent/30;
|
||||
@apply rounded-xl px-4 py-2.5 text-sm font-medium;
|
||||
@apply hover:bg-accent/20 hover:border-accent/50;
|
||||
@apply active:bg-accent/25;
|
||||
@apply transition-all duration-150;
|
||||
}
|
||||
|
||||
.btn-primary-solid {
|
||||
@apply bg-accent text-white border-none;
|
||||
@apply rounded-xl px-4 py-2.5 text-sm font-medium;
|
||||
@apply hover:bg-accent-hover;
|
||||
@apply active:scale-[0.98];
|
||||
@apply transition-all duration-150;
|
||||
}
|
||||
|
||||
/* Secondary button */
|
||||
.btn-secondary {
|
||||
@apply bg-surface/50 text-secondary border border-border;
|
||||
@apply rounded-xl px-4 py-2.5 text-sm font-medium;
|
||||
@apply hover:bg-muted/50 hover:text-primary hover:border-border-hover;
|
||||
@apply transition-all duration-150;
|
||||
}
|
||||
|
||||
/* Ghost button */
|
||||
.btn-ghost {
|
||||
@apply text-secondary hover:text-primary;
|
||||
@apply hover:bg-surface/50 rounded-xl px-3 py-2;
|
||||
@apply transition-all duration-150;
|
||||
}
|
||||
|
||||
/* Icon button */
|
||||
.btn-icon {
|
||||
@apply w-9 h-9 flex items-center justify-center rounded-xl;
|
||||
@apply text-muted hover:text-secondary hover:bg-surface/50;
|
||||
@apply transition-all duration-150;
|
||||
}
|
||||
|
||||
.btn-icon-active {
|
||||
@apply bg-accent/15 text-accent;
|
||||
}
|
||||
|
||||
/* Navigation item */
|
||||
.nav-item {
|
||||
@apply flex items-center gap-3 px-3 py-2.5 rounded-xl;
|
||||
@apply text-secondary hover:text-primary;
|
||||
@apply hover:bg-surface/40 transition-all duration-150;
|
||||
}
|
||||
|
||||
.nav-item-active {
|
||||
@apply bg-accent/10 text-primary;
|
||||
@apply border-l-2 border-accent;
|
||||
}
|
||||
|
||||
/* Card styles */
|
||||
.card {
|
||||
@apply bg-elevated/40 backdrop-blur-sm;
|
||||
@apply border border-border/50 rounded-2xl;
|
||||
@apply transition-all duration-200;
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
@apply border-border bg-elevated/60;
|
||||
}
|
||||
|
||||
.card-interactive {
|
||||
@apply cursor-pointer;
|
||||
}
|
||||
|
||||
.card-interactive:hover {
|
||||
@apply border-accent/30 shadow-lg shadow-accent/5;
|
||||
}
|
||||
|
||||
/* Section headers */
|
||||
.section-header {
|
||||
@apply text-xs font-semibold uppercase tracking-wider text-muted;
|
||||
}
|
||||
|
||||
/* Badges */
|
||||
.badge {
|
||||
@apply inline-flex items-center px-2 py-0.5 rounded-lg text-xs font-medium;
|
||||
@apply bg-surface text-secondary border border-border/50;
|
||||
}
|
||||
|
||||
.badge-accent {
|
||||
@apply bg-accent/15 text-accent border-accent/30;
|
||||
}
|
||||
|
||||
.badge-success {
|
||||
@apply bg-success/15 text-success border-success/30;
|
||||
}
|
||||
|
||||
.badge-warning {
|
||||
@apply bg-warning/15 text-warning border-warning/30;
|
||||
}
|
||||
|
||||
.badge-error {
|
||||
@apply bg-error/15 text-error border-error/30;
|
||||
}
|
||||
|
||||
/* Divider */
|
||||
.divider {
|
||||
@apply border-t border-border/50;
|
||||
}
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
.text-balance {
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
/* Glow effects */
|
||||
.glow-accent {
|
||||
box-shadow: 0 0 20px hsl(239 84% 67% / 0.15),
|
||||
0 0 40px hsl(239 84% 67% / 0.1);
|
||||
}
|
||||
|
||||
.glow-accent-strong {
|
||||
box-shadow: 0 0 30px hsl(239 84% 67% / 0.25),
|
||||
0 0 60px hsl(239 84% 67% / 0.15);
|
||||
}
|
||||
|
||||
.glow-subtle {
|
||||
box-shadow: 0 4px 20px hsl(240 6% 4% / 0.5);
|
||||
}
|
||||
|
||||
/* Focus ring */
|
||||
.focus-ring {
|
||||
@apply focus:outline-none focus:ring-2 focus:ring-accent/50 focus:ring-offset-2 focus:ring-offset-base;
|
||||
}
|
||||
|
||||
/* Animation delays */
|
||||
.animate-delay-75 { animation-delay: 75ms; }
|
||||
.animate-delay-100 { animation-delay: 100ms; }
|
||||
.animate-delay-150 { animation-delay: 150ms; }
|
||||
.animate-delay-200 { animation-delay: 200ms; }
|
||||
.animate-delay-300 { animation-delay: 300ms; }
|
||||
.animate-delay-400 { animation-delay: 400ms; }
|
||||
.animate-delay-500 { animation-delay: 500ms; }
|
||||
}
|
||||
|
||||
/* Smooth animations */
|
||||
@keyframes fade-in {
|
||||
0% { opacity: 0; transform: translateY(4px); }
|
||||
100% { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
@keyframes fade-in-up {
|
||||
0% { opacity: 0; transform: translateY(12px); }
|
||||
100% { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
@keyframes slide-in-right {
|
||||
0% { opacity: 0; transform: translateX(-12px); }
|
||||
100% { opacity: 1; transform: translateX(0); }
|
||||
}
|
||||
|
||||
@keyframes slide-in-left {
|
||||
0% { opacity: 0; transform: translateX(12px); }
|
||||
100% { opacity: 1; transform: translateX(0); }
|
||||
}
|
||||
|
||||
@keyframes scale-in {
|
||||
0% { opacity: 0; transform: scale(0.95); }
|
||||
100% { opacity: 1; transform: scale(1); }
|
||||
}
|
||||
|
||||
@keyframes pulse-soft {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.7; }
|
||||
}
|
||||
|
||||
@keyframes shimmer {
|
||||
0% { background-position: -200% 0; }
|
||||
100% { background-position: 200% 0; }
|
||||
}
|
||||
|
||||
@keyframes glow-pulse {
|
||||
0%, 100% {
|
||||
box-shadow: 0 0 20px hsl(239 84% 67% / 0.15);
|
||||
}
|
||||
50% {
|
||||
box-shadow: 0 0 30px hsl(239 84% 67% / 0.25);
|
||||
}
|
||||
}
|
||||
|
||||
.animate-fade-in {
|
||||
animation: fade-in 0.2s ease-out forwards;
|
||||
}
|
||||
|
||||
.animate-fade-in-up {
|
||||
animation: fade-in-up 0.3s ease-out forwards;
|
||||
}
|
||||
|
||||
.animate-slide-in-right {
|
||||
animation: slide-in-right 0.25s ease-out forwards;
|
||||
}
|
||||
|
||||
.animate-slide-in-left {
|
||||
animation: slide-in-left 0.25s ease-out forwards;
|
||||
}
|
||||
|
||||
.animate-scale-in {
|
||||
animation: scale-in 0.2s ease-out forwards;
|
||||
}
|
||||
|
||||
.animate-pulse-soft {
|
||||
animation: pulse-soft 2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.animate-shimmer {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
hsl(240 5% 11%) 0%,
|
||||
hsl(240 5% 16%) 50%,
|
||||
hsl(240 5% 11%) 100%
|
||||
);
|
||||
background-size: 200% 100%;
|
||||
animation: shimmer 1.5s linear infinite;
|
||||
}
|
||||
|
||||
.animate-glow-pulse {
|
||||
animation: glow-pulse 2s ease-in-out infinite;
|
||||
}
|
||||
Reference in New Issue
Block a user