mirror of
https://github.com/taylanbakircioglu/haproxy-openmanager.git
synced 2026-09-11 21:38:55 +00:00
feat: rebrand to HAProxy OpenManager, remove demo accounts from login
- Replace login icon with ClusterOutlined, title "HAProxy OpenManager" - Add subtitle "Multi-Cluster Load Balancer Management" on login page - Remove demo account list from login page - Update sidebar logo: emoji → ClusterOutlined icon - Update header and browser tab title - Clean up unused demo-account CSS styles Made-with: Cursor
This commit is contained in:
@@ -7,9 +7,9 @@
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="HAProxy Load Balancer Management UI"
|
||||
content="HAProxy Multi-Cluster Load Balancer Management"
|
||||
/>
|
||||
<title>HAProxy Management UI</title>
|
||||
<title>HAProxy OpenManager</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
|
||||
+11
-14
@@ -17,7 +17,8 @@ import {
|
||||
PlayCircleOutlined,
|
||||
CloudUploadOutlined,
|
||||
ApiOutlined,
|
||||
SearchOutlined
|
||||
SearchOutlined,
|
||||
ClusterOutlined
|
||||
} from '@ant-design/icons';
|
||||
|
||||
import Dashboard from './components/DashboardV2';
|
||||
@@ -232,28 +233,24 @@ function AppContent() {
|
||||
overflow: 'hidden'
|
||||
}}>
|
||||
{collapsed ? (
|
||||
<div style={{
|
||||
fontSize: '20px',
|
||||
<ClusterOutlined style={{
|
||||
fontSize: '22px',
|
||||
color: '#1890ff',
|
||||
textShadow: '0 0 10px rgba(24, 144, 255, 0.5)'
|
||||
}}>
|
||||
H
|
||||
</div>
|
||||
}} />
|
||||
) : (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
fontSize: '16px'
|
||||
fontSize: '14px'
|
||||
}}>
|
||||
<div style={{
|
||||
fontSize: '24px',
|
||||
<ClusterOutlined style={{
|
||||
fontSize: '22px',
|
||||
color: '#1890ff',
|
||||
textShadow: '0 0 10px rgba(24, 144, 255, 0.5)'
|
||||
}}>
|
||||
⚡
|
||||
</div>
|
||||
<span>HAProxy Management</span>
|
||||
}} />
|
||||
<span>HAProxy OpenManager</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -293,7 +290,7 @@ function AppContent() {
|
||||
marginLeft: '8px',
|
||||
whiteSpace: 'nowrap'
|
||||
}}>
|
||||
HAProxy Load Balancer Management
|
||||
HAProxy OpenManager
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ flex: 1, display: 'flex', justifyContent: 'center', padding: '0 16px', minWidth: 0 }}>
|
||||
|
||||
@@ -19,7 +19,7 @@ const APIDocumentation = () => {
|
||||
|
||||
<Alert
|
||||
message="Interactive API Documentation Available"
|
||||
description="HAProxy Open Manager provides comprehensive, interactive API documentation via Swagger UI and ReDoc. You can test API endpoints directly from the documentation interface."
|
||||
description="HAProxy OpenManager provides comprehensive, interactive API documentation via Swagger UI and ReDoc. You can test API endpoints directly from the documentation interface."
|
||||
type="info"
|
||||
showIcon
|
||||
style={{ marginBottom: 24 }}
|
||||
@@ -206,7 +206,7 @@ curl -X POST "${baseUrl}/api/backends" \\
|
||||
>
|
||||
<Title level={4}>Agent-Pull Architecture</Title>
|
||||
<Paragraph>
|
||||
HAProxy Open Manager uses an <Text strong>agent-pull architecture</Text>:
|
||||
HAProxy OpenManager uses an <Text strong>agent-pull architecture</Text>:
|
||||
</Paragraph>
|
||||
<ol>
|
||||
<li>
|
||||
|
||||
@@ -55,9 +55,9 @@
|
||||
}
|
||||
|
||||
.login-icon {
|
||||
font-size: 48px;
|
||||
font-size: 52px;
|
||||
color: #1890ff;
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: 12px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -149,36 +149,11 @@
|
||||
}
|
||||
|
||||
.login-footer {
|
||||
margin-top: 30px;
|
||||
padding-top: 20px;
|
||||
margin-top: 24px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.demo-accounts {
|
||||
background: #fafafa;
|
||||
border-radius: 8px;
|
||||
padding: 16px;
|
||||
border: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.demo-account-list {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.demo-account {
|
||||
padding: 4px 0;
|
||||
font-size: 14px;
|
||||
color: #595959;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.demo-account .ant-typography {
|
||||
color: #1890ff;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Error alert customization */
|
||||
.ant-alert-error {
|
||||
border-radius: 8px;
|
||||
@@ -232,17 +207,6 @@
|
||||
font-size: 42px;
|
||||
}
|
||||
|
||||
.demo-account {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.demo-accounts {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.ant-input-affix-wrapper,
|
||||
.ant-input {
|
||||
height: 32px;
|
||||
@@ -284,13 +248,6 @@
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.demo-accounts {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.demo-account-list .ant-typography {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 360px) {
|
||||
@@ -333,9 +290,6 @@
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.demo-accounts {
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
/* High DPI displays */
|
||||
|
||||
@@ -14,7 +14,7 @@ import {
|
||||
import {
|
||||
UserOutlined,
|
||||
LockOutlined,
|
||||
SecurityScanOutlined
|
||||
ClusterOutlined
|
||||
} from '@ant-design/icons';
|
||||
import axios from 'axios';
|
||||
import { useAuth } from '../contexts/AuthContext';
|
||||
@@ -97,12 +97,12 @@ const Login = () => {
|
||||
>
|
||||
<Card className="login-card">
|
||||
<div className="login-header">
|
||||
<SecurityScanOutlined className="login-icon" />
|
||||
<ClusterOutlined className="login-icon" />
|
||||
<Title level={2} className="login-title">
|
||||
HAProxy Management
|
||||
HAProxy OpenManager
|
||||
</Title>
|
||||
<Text type="secondary" className="login-subtitle">
|
||||
Sign in to your account
|
||||
Multi-Cluster Load Balancer Management
|
||||
</Text>
|
||||
</div>
|
||||
|
||||
@@ -166,25 +166,9 @@ const Login = () => {
|
||||
</Form>
|
||||
|
||||
<div className="login-footer">
|
||||
<div className="demo-accounts">
|
||||
<Title level={5} style={{ color: '#666', marginBottom: 8 }}>
|
||||
Demo Accounts:
|
||||
</Title>
|
||||
<div className="demo-account-list">
|
||||
<div className="demo-account">
|
||||
<Text strong>admin</Text> - Super Administrator
|
||||
</div>
|
||||
<div className="demo-account">
|
||||
<Text strong>operator1</Text> - Daily Operations
|
||||
</div>
|
||||
<div className="demo-account">
|
||||
<Text strong>security1</Text> - Security Management
|
||||
</div>
|
||||
<div className="demo-account">
|
||||
<Text strong>viewer1</Text> - Read-only Access
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Text type="secondary" style={{ fontSize: 12, display: 'block', textAlign: 'center' }}>
|
||||
Centralized management for multiple HAProxy clusters
|
||||
</Text>
|
||||
</div>
|
||||
</Card>
|
||||
</Col>
|
||||
|
||||
Reference in New Issue
Block a user