feat: 添加 PipexERP 企业统一品牌资源

- 创建品牌资源目录 brand/ - Logo SVG（主Logo、深色模式、图标、favicon） - 各子系统专用 Logo（AI-Proj、Gitea、Jenkins、Metabase、DBeaver） - CSS 变量文件 pipexerp-variables.css - 品牌条样式 pipexerp-brand-bar.css - 品牌 Header 模板 - 更新导航页 nav-home.html - 企业区域配色改为企业绿 #52c41a - 更新标题和 Logo 为 PipexERP - 添加 favicon 引用 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-03 15:36:29 +10:30
parent 6a4be4ca4c
commit 6b9607a19b
13 changed files with 491 additions and 6 deletions
--- a/brand/css/pipexerp-variables.css
+++ b/brand/css/pipexerp-variables.css
@@ -0,0 +1,130 @@
+/**
+ * PipexERP Brand CSS Variables
+ * 企业统一品牌色彩系统
+ */
+
+:root {
+  /* === Primary Colors (Enterprise Green) === */
+  --pipex-primary: #52c41a;
+  --pipex-primary-hover: #389e0d;
+  --pipex-primary-active: #237804;
+  --pipex-primary-light: #b7eb8f;
+  --pipex-primary-lighter: #d9f7be;
+  --pipex-primary-dark: #135200;
+  --pipex-primary-bg: rgba(82, 196, 26, 0.1);
+
+  /* === Functional Colors === */
+  --pipex-success: #52c41a;
+  --pipex-info: #1890ff;
+  --pipex-warning: #faad14;
+  --pipex-error: #ff4d4f;
+
+  /* === Light Mode Colors === */
+  --pipex-bg-primary: #ffffff;
+  --pipex-bg-secondary: #fafafa;
+  --pipex-bg-tertiary: #f5f5f5;
+  --pipex-text-primary: #333333;
+  --pipex-text-secondary: #666666;
+  --pipex-text-tertiary: #999999;
+  --pipex-border: #d9d9d9;
+  --pipex-border-light: #e8e8e8;
+  --pipex-shadow: rgba(0, 0, 0, 0.08);
+  --pipex-shadow-hover: rgba(0, 0, 0, 0.12);
+
+  /* === Component Specific === */
+  --pipex-header-height: 56px;
+  --pipex-sidebar-width: 240px;
+  --pipex-border-radius: 8px;
+  --pipex-border-radius-sm: 4px;
+  --pipex-border-radius-lg: 12px;
+  --pipex-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+
+  /* === Typography === */
+  --pipex-font-family: 'Segoe UI', 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Noto Sans SC', sans-serif;
+  --pipex-font-size-xs: 12px;
+  --pipex-font-size-sm: 14px;
+  --pipex-font-size-base: 16px;
+  --pipex-font-size-lg: 18px;
+  --pipex-font-size-xl: 20px;
+  --pipex-font-size-2xl: 24px;
+  --pipex-font-weight-normal: 400;
+  --pipex-font-weight-medium: 500;
+  --pipex-font-weight-semibold: 600;
+  --pipex-font-weight-bold: 700;
+
+  /* === Spacing === */
+  --pipex-spacing-xs: 4px;
+  --pipex-spacing-sm: 8px;
+  --pipex-spacing-md: 16px;
+  --pipex-spacing-lg: 24px;
+  --pipex-spacing-xl: 32px;
+  --pipex-spacing-2xl: 48px;
+}
+
+/* === Dark Mode Colors === */
+[data-theme="dark"],
+.dark,
+.pipex-dark {
+  --pipex-primary: #73d13d;
+  --pipex-primary-hover: #95de64;
+  --pipex-primary-active: #52c41a;
+  --pipex-primary-light: #237804;
+  --pipex-primary-lighter: #135200;
+  --pipex-primary-dark: #b7eb8f;
+  --pipex-primary-bg: rgba(115, 209, 61, 0.15);
+
+  --pipex-bg-primary: #0d1117;
+  --pipex-bg-secondary: #161b22;
+  --pipex-bg-tertiary: #21262d;
+  --pipex-text-primary: #e6edf3;
+  --pipex-text-secondary: #8b949e;
+  --pipex-text-tertiary: #6e7681;
+  --pipex-border: #30363d;
+  --pipex-border-light: #21262d;
+  --pipex-shadow: rgba(0, 0, 0, 0.3);
+  --pipex-shadow-hover: rgba(0, 0, 0, 0.4);
+}
+
+/* === Utility Classes === */
+.pipex-text-primary {
+  color: var(--pipex-primary) !important;
+}
+
+.pipex-bg-primary {
+  background-color: var(--pipex-primary) !important;
+}
+
+.pipex-border-primary {
+  border-color: var(--pipex-primary) !important;
+}
+
+.pipex-btn-primary {
+  background: linear-gradient(135deg, var(--pipex-primary), var(--pipex-primary-hover));
+  color: white;
+  border: none;
+  padding: var(--pipex-spacing-sm) var(--pipex-spacing-md);
+  border-radius: var(--pipex-border-radius);
+  cursor: pointer;
+  transition: var(--pipex-transition);
+  font-weight: var(--pipex-font-weight-medium);
+}
+
+.pipex-btn-primary:hover {
+  background: linear-gradient(135deg, var(--pipex-primary-hover), var(--pipex-primary-active));
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(82, 196, 26, 0.3);
+}
+
+.pipex-card {
+  background: var(--pipex-bg-primary);
+  border: 1px solid var(--pipex-border);
+  border-radius: var(--pipex-border-radius-lg);
+  padding: var(--pipex-spacing-lg);
+  box-shadow: 0 2px 8px var(--pipex-shadow);
+  transition: var(--pipex-transition);
+}
+
+.pipex-card:hover {
+  box-shadow: 0 4px 16px var(--pipex-shadow-hover);
+  border-color: var(--pipex-primary);
+}