gsadmin/flowfish
1
0
Fork 0
mirror of https://github.com/taylanbakircioglu/flowfish.git synced 2026-09-24 03:16:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: dark mode compatibility for Change Detection and Login pages

Browse Source 
- Anomalies card: dark-aware gradient background
- Compare Runs summary cards: dark-aware background colors
- Login page: dark mode CSS for inputs, background, and card shadow
- Login version: use dynamic APP_VERSION instead of hardcoded 1.0.0
- Config: clean up comment in dns_search_domains field

Made-with: Cursor
This commit is contained in:
taylanbakircioglu
2026-04-02 15:16:24 +03:00
parent 99f44f854c
commit 01c69fc8cd
4 changed files with 50 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/pages/ChangeDetection.tsx
+9 -5
View File
@@ -1374,7 +1374,11 @@ const ChangeDetection: React.FC = () => {
onClick={() => handleStatCardClick('anomalies')}
style={{
cursor: 'pointer',
background: anomalyCount > 0 ? 'linear-gradient(135deg, #fff2e8 0%, #fff7e6 100%)' : undefined,
background: anomalyCount > 0
? isDark
? 'linear-gradient(135deg, rgba(212, 117, 106, 0.18) 0%, rgba(212, 117, 106, 0.08) 100%)'
: 'linear-gradient(135deg, #fff2e8 0%, #fff7e6 100%)'
: undefined,
borderLeft: anomalyCount > 0 ? '3px solid #d4756a' : undefined,
border: activeStatFilter === 'anomalies' ? '2px solid #d4756a' : undefined,
}}
@@ -2064,7 +2068,7 @@ const ChangeDetection: React.FC = () => {
{/* Comparison Summary Cards */}
<Row gutter={16} style={{ marginBottom: 16 }}>
<Col span={6}>
<Card bordered={false} style={{ background: '#e6f7ff', borderLeft: '3px solid #0891b2' }}>
<Card bordered={false} style={{ background: isDark ? 'rgba(8, 145, 178, 0.15)' : '#e6f7ff', borderLeft: '3px solid #0891b2' }}>
<Statistic
title={<><SyncOutlined style={{ color: '#0891b2' }} /> Run #{runA}</>}
value={runComparisonData.comparison.total_in_run_a}
@@ -2077,7 +2081,7 @@ const ChangeDetection: React.FC = () => {
</Card>
</Col>
<Col span={6}>
<Card bordered={false} style={{ background: '#f6ffed', borderLeft: '3px solid #4d9f7c' }}>
<Card bordered={false} style={{ background: isDark ? 'rgba(77, 159, 124, 0.15)' : '#f6ffed', borderLeft: '3px solid #4d9f7c' }}>
<Statistic
title={<><SyncOutlined style={{ color: '#4d9f7c' }} /> Run #{runB}</>}
value={runComparisonData.comparison.total_in_run_b}
@@ -2090,7 +2094,7 @@ const ChangeDetection: React.FC = () => {
</Card>
</Col>
<Col span={6}>
<Card bordered={false} style={{ background: '#fff2e8', borderLeft: '3px solid #b89b5d' }}>
<Card bordered={false} style={{ background: isDark ? 'rgba(184, 155, 93, 0.15)' : '#fff2e8', borderLeft: '3px solid #b89b5d' }}>
<Statistic
title={<><PlusCircleOutlined style={{ color: '#b89b5d' }} /> New in Run #{runB}</>}
value={runComparisonData.comparison.only_in_run_b}
@@ -2103,7 +2107,7 @@ const ChangeDetection: React.FC = () => {
</Card>
</Col>
<Col span={6}>
<Card bordered={false} style={{ background: '#fff1f0', borderLeft: '3px solid #c75450' }}>
<Card bordered={false} style={{ background: isDark ? 'rgba(199, 84, 80, 0.15)' : '#fff1f0', borderLeft: '3px solid #c75450' }}>
<Statistic
title={<><MinusCircleOutlined style={{ color: '#c75450' }} /> Gone from #{runA}</>}
value={runComparisonData.comparison.only_in_run_a}
frontend/src/pages/Login.css
+38 -2
View File
@@ -194,6 +194,42 @@
}
}
/* Light theme is default - no dark mode for login page */
/* Keep the ocean theme bright and inviting */
/* Dark mode overrides */
.dark-theme .login-container {
background: linear-gradient(135deg, #0c4a6e 0%, #164e63 50%, #1e293b 100%);
}
.dark-theme .login-container::before {
background:
radial-gradient(circle at 20% 50%, rgba(8, 145, 178, 0.15) 0%, transparent 50%),
radial-gradient(circle at 80% 80%, rgba(6, 182, 212, 0.1) 0%, transparent 50%);
}
.dark-theme .login-card {
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.dark-theme .login-form .ant-input-affix-wrapper,
.dark-theme .login-form .ant-input-password {
background: #141414 !important;
border-color: #374151 !important;
}
.dark-theme .login-form .ant-input-affix-wrapper .ant-input,
.dark-theme .login-form .ant-input-password .ant-input {
background: #141414 !important;
color: #e5e7eb !important;
}
.dark-theme .login-form .ant-input-affix-wrapper:hover,
.dark-theme .login-form .ant-input-affix-wrapper-focused,
.dark-theme .login-form .ant-input-password:hover {
border-color: #0891b2 !important;
box-shadow: 0 0 0 2px rgba(8, 145, 178, 0.2) !important;
}
.dark-theme .login-form .ant-input-affix-wrapper .ant-input::placeholder,
.dark-theme .login-form .ant-input-password .ant-input::placeholder {
color: rgba(255, 255, 255, 0.3) !important;
}
frontend/src/pages/Login.tsx
+2 -1
View File
@@ -7,6 +7,7 @@ import { RootState } from '../store';
import { loginStart, loginSuccess, loginFailure } from '../store/slices/authSlice';
import { apiClient } from '../utils/api';
import FlowfishLogo from '../components/FlowfishLogo';
import { APP_VERSION } from '../version';
import './Login.css';
const { useToken } = theme;
@@ -317,7 +318,7 @@ const Login: React.FC = () => {
}}
>
<Text className="login-footer-text" style={{ color: themeStyles.footer.textColor }}>
Secure Enterprise Platform · Version 1.0.0
Secure Enterprise Platform · Version {APP_VERSION}
</Text>
</div>
</Card>
services/graph-writer/app/config.py
+1 -1
View File
@@ -54,7 +54,7 @@ class Settings(BaseSettings):
# DNS search domain normalization — comma-separated list of custom search
# domains to strip from DNS names before creating graph nodes.
# Typically matches the search list from /etc/resolv.conf on cluster nodes.
# Example: DNS_SEARCH_DOMAINS=mycompany.local,internal.mycompany.local
# Comma-separated list, typically matching /etc/resolv.conf search entries
dns_search_domains: str = Field(default="", description="From DNS_SEARCH_DOMAINS env var")
# Kubernetes (for workload discovery)