feat: redesign documentation landing page with custom theme and updated site navigation

2026-06-24 14:18:43 +07:00
parent f05e1c6d05
commit 8e56e05d1b
4 changed files with 163 additions and 38 deletions
@@ -0,0 +1,87 @@
+/**
+ * VitePress Custom Theme CSS
+ * Applying brand color #652ed9 and its variants
+ */
+
+:root {
+  /* Brand color #652ed9 */
+  --vp-c-brand-1: #652ed9;
+  --vp-c-brand-2: #804aea;
+  --vp-c-brand-3: #9b6ff8;
+  --vp-c-brand-soft: rgba(101, 46, 217, 0.16);
+
+  /* Hover states */
+  --vp-button-brand-hover-bg: var(--vp-c-brand-2);
+  --vp-button-brand-hover-text: var(--vp-c-white);
+  --vp-button-brand-active-bg: var(--vp-c-brand-1);
+
+  /* Focus states */
+  --vp-custom-block-brand-border: var(--vp-c-brand-1);
+}
+
+.dark {
+  /* Slightly adjusted variants for dark mode, keeping the primary brand color consistent */
+  --vp-c-brand-1: #8a57f3;
+  --vp-c-brand-2: #7a42ec;
+  --vp-c-brand-3: #652ed9;
+  --vp-c-brand-soft: rgba(101, 46, 217, 0.25);
+}
+
+/* Custom Enterprise Section Styles */
+.enterprise-section {
+  max-width: 1152px;
+  margin: 0 auto;
+  padding: 64px 24px;
+}
+.enterprise-section h2 {
+  font-size: 2.2em;
+  font-weight: 700;
+  margin-bottom: 0.5em;
+  letter-spacing: -0.02em;
+  line-height: 1.2;
+}
+.enterprise-section > p {
+  font-size: 1.2em;
+  color: var(--vp-c-text-2);
+  margin-bottom: 2.5em;
+  max-width: 700px;
+}
+.enterprise-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  gap: 24px;
+}
+.enterprise-card {
+  padding: 32px 24px;
+  border-radius: 12px;
+  background-color: var(--vp-c-bg-soft);
+  border: 1px solid var(--vp-c-divider);
+  transition: border-color 0.25s, background-color 0.25s, transform 0.25s;
+}
+.enterprise-card:hover {
+  border-color: var(--vp-c-brand-1);
+  transform: translateY(-2px);
+}
+.enterprise-card h3 {
+  font-size: 1.25em;
+  font-weight: 600;
+  margin-bottom: 0.75em;
+  color: var(--vp-c-text-1);
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.enterprise-card h3::before {
+  content: '';
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background-color: var(--vp-c-brand-1);
+}
+.enterprise-card p {
+  font-size: 1em;
+  color: var(--vp-c-text-2);
+  line-height: 1.6;
+  margin: 0;
+}