(bifromq-sites) branch clean-rebuild updated: fix landing page deployment section docker tag

[visoar]

This is an automated email from the ASF dual-hosted git repository.

visoar pushed a commit to branch clean-rebuild
in repository https://gitbox.apache.org/repos/asf/bifromq-sites.git


The following commit(s) were added to refs/heads/clean-rebuild by this push:
     new e7f0c71b fix landing page deployment section docker tag
e7f0c71b is described below

commit e7f0c71b172a2e9f9a579424060abcfc23272785
Author: Visoar <visoa...@gmail.com>
AuthorDate: Mon Jan 12 16:04:38 2026 +0800

    fix landing page deployment section docker tag
---
 src/pages/index.module.css | 60 +++++++++++++++++++++++++++++++++++++++++-----
 src/pages/index.tsx        | 12 ++++++++--
 2 files changed, 64 insertions(+), 8 deletions(-)

diff --git a/src/pages/index.module.css b/src/pages/index.module.css
index da4d0538..2bd596c4 100644
--- a/src/pages/index.module.css
+++ b/src/pages/index.module.css
@@ -221,6 +221,7 @@
   background: var(--color-bg);
   color: var(--color-text-primary);
   transform: translateY(-2px);
+  text-decoration: none !important;
 }
 
 .heroCtaSecondary {
@@ -240,7 +241,9 @@
 
 .heroCtaSecondary:hover {
   border-color: var(--color-text-primary);
+  color: var(--color-text-primary);
   transform: translateY(-2px);
+  text-decoration: none !important;
 }
 
 .heroVisual {
@@ -481,18 +484,62 @@ html[data-theme='dark'] .bifrostCard:hover {
 
 /* --- TERMINAL --- */
 .quickstart {
-  background: #000;
-  padding: var(--space-lg);
+  background: #0d1117;
+  padding: 0;
   position: relative;
   overflow: hidden;
-  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.4);
+  border-radius: 8px;
+  border: 1px solid #30363d;
+}
+
+.terminalHeader {
+  background: #161b22;
+  padding: 12px 16px;
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid #30363d;
+}
+
+.terminalDots {
+  display: flex;
+  gap: 8px;
+}
+
+.terminalDots span {
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+}
+
+.terminalDots span:nth-child(1) {
+  background: #ff5f56;
+}
+
+.terminalDots span:nth-child(2) {
+  background: #ffbd2e;
+}
+
+.terminalDots span:nth-child(3) {
+  background: #27c93f;
+}
+
+.terminalTitle {
+  flex: 1;
+  text-align: center;
+  font-family: var(--font-mono);
+  font-size: 12px;
+  color: #8b949e;
+  margin-right: 48px;
+  /* Offset for dots to center title */
 }
 
 .terminalOutput {
+  padding: 24px;
   font-family: var(--font-mono);
-  font-size: 1.125rem;
+  font-size: 1rem;
   line-height: 1.8;
-  color: #fff;
+  color: #e6edf3;
 }
 
 .prompt {
@@ -537,7 +584,7 @@ html[data-theme='dark'] .bifrostCard:hover {
   font-size: clamp(2.5rem, 8vw, 5rem);
   font-weight: 900;
   letter-spacing: -0.06em;
-  line-height: 1;
+  line-height: 1.2;
   margin-bottom: var(--space-lg);
   color: var(--color-text-primary);
   z-index: 10;
@@ -566,6 +613,7 @@ html[data-theme='dark'] .bifrostCard:hover {
   background: var(--color-bg);
   color: var(--color-text-primary);
   transform: translateY(-4px);
+  text-decoration: none !important;
 }
 
 /* --- RESPONSIVE --- */
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 21c96dc0..3b23e847 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,6 +1,7 @@
 import React, { type ReactNode, useEffect } from 'react';
 import Link from '@docusaurus/Link';
 import Layout from '@theme/Layout';
+import { releaseVersion } from '../../releaseInfo';
 import styles from './index.module.css';
 
 /**
@@ -122,9 +123,16 @@ export default function Home(): ReactNode {
             <h2 className={styles.sectionTitle}>Launch in Seconds</h2>
           </div>
           <div className={styles.quickstart}>
+            <div className={styles.terminalHeader}>
+              <div className={styles.terminalDots}>
+                <span />
+                <span />
+                <span />
+              </div>
+              <div className={styles.terminalTitle}>bash — 80×24</div>
+            </div>
             <div className={styles.terminalOutput}>
-              <div><span className={styles.prompt}>$</span> docker pull 
apache/bifromq:latest</div>
-              <div><span className={styles.prompt}>$</span> docker run -d 
--name bifromq -p 1883:1883 apache/bifromq:latest</div>
+              <div><span className={styles.prompt}>$</span> docker run -d 
--name bifromq -p 1883:1883 apache/bifromq:{releaseVersion}</div>
               <div style={{ opacity: 0.6, marginTop: '20px' }}># BifroMQ node 
starting up...</div>
               <div style={{ opacity: 0.6 }}># Cluster established. Ready for 
massive connectivity.</div>
               <div><span className={styles.prompt}>$</span> <span 
className={styles.cursor} /></div>