Skip to content

Commit b6f75ce

Browse files
committed
2
1 parent 2af43fd commit b6f75ce

2 files changed

Lines changed: 125 additions & 27 deletions

File tree

src/components/why-doris-next/BenchmarkNext.scss

Lines changed: 99 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,25 @@
102102
&:hover { background: var(--bn-yellow-bright); }
103103
}
104104

105+
.b-btn-primary {
106+
background: var(--bn-cream-light);
107+
color: var(--bn-green-darker);
108+
border-color: var(--bn-cream-light);
109+
110+
&:hover { background: var(--bn-paper); }
111+
}
112+
113+
.b-btn:disabled,
114+
.b-btn[aria-disabled='true'] {
115+
cursor: not-allowed;
116+
opacity: 0.55;
117+
118+
&:hover {
119+
transform: none;
120+
background: var(--bn-cream-light);
121+
}
122+
}
123+
105124
.b-shape {
106125
position: absolute;
107126
pointer-events: none;
@@ -1163,9 +1182,11 @@
11631182
.b-accent { color: var(--bn-yellow); }
11641183
}
11651184

1166-
.b-cta-btn {
1167-
padding: 1.25rem 2.4rem;
1168-
font-size: 15px;
1185+
.b-cta-actions {
1186+
display: inline-flex;
1187+
gap: 14px;
1188+
flex-wrap: wrap;
1189+
justify-content: center;
11691190
}
11701191

11711192
// ─────────────────────────────────────────────────────────────────────────
@@ -1188,13 +1209,82 @@
11881209
.b-cmp,
11891210
.b-repro,
11901211
.b-cta { padding: 56px 0; }
1191-
.b-tab { padding: 14px 16px; font-size: 11.5px; }
1192-
.b-bar { grid-template-columns: 90px 1fr 64px; gap: 10px; font-size: 11.5px; }
1193-
.b-chart-body { height: 200px; }
1194-
.b-cluster-bars { height: 170px; }
1195-
.b-cluster-bar { width: 6px; }
1196-
.b-detail { padding: 22px 18px 20px; }
1212+
1213+
.b-hero-title { font-size: clamp(32px, 8.6vw, 44px); }
1214+
.b-hero-sub { font-size: 14px; margin-top: 16px; }
1215+
1216+
.b-cmp-head { margin-bottom: 32px; }
1217+
.b-cmp-title { font-size: clamp(28px, 7.4vw, 40px); margin-bottom: 16px; }
1218+
.b-cmp-sub { font-size: 14px; }
1219+
1220+
.b-tabs {
1221+
overflow-x: auto;
1222+
flex-wrap: nowrap;
1223+
margin-bottom: 24px;
1224+
-webkit-overflow-scrolling: touch;
1225+
scrollbar-width: none;
1226+
1227+
&::-webkit-scrollbar { display: none; }
1228+
}
1229+
.b-tab {
1230+
padding: 14px 16px;
1231+
font-size: 11.5px;
1232+
flex: 0 0 auto;
1233+
1234+
.b-tab-tip { display: none; }
1235+
}
1236+
1237+
// Section 2 (Comparison): on small screens, cards are informational only —
1238+
// the per-query breakdown is hidden to keep the page readable.
1239+
.b-card {
1240+
cursor: default;
1241+
padding: 24px 20px 22px;
1242+
1243+
&:hover {
1244+
transform: none;
1245+
border-color: rgba(15, 26, 20, 0.12);
1246+
box-shadow: 0 8px 22px -16px rgba(15, 26, 20, 0.18);
1247+
}
1248+
1249+
&.is-active {
1250+
background: var(--bn-paper);
1251+
border-color: rgba(15, 26, 20, 0.12);
1252+
box-shadow: none;
1253+
1254+
&::after { display: none; }
1255+
}
1256+
}
1257+
.b-card-head { gap: 10px; }
1258+
.b-card-title { font-size: 19px; }
1259+
.b-card-tip { display: none; }
1260+
.b-detail { display: none; }
1261+
1262+
.b-bar { grid-template-columns: 80px 1fr 56px; gap: 10px; font-size: 11.5px; }
1263+
11971264
.b-method { padding: 22px 18px 18px; }
11981265
.b-method-grid { grid-template-columns: 1fr; gap: 18px; }
1266+
1267+
.b-repro-title { font-size: clamp(28px, 7.4vw, 40px); }
1268+
.b-cta-title { font-size: clamp(28px, 7.4vw, 40px); margin-bottom: 32px; }
1269+
}
1270+
1271+
@media (max-width: 480px) {
1272+
.b-card { padding: 22px 16px 18px; }
1273+
.b-card-head {
1274+
flex-direction: column;
1275+
align-items: flex-start;
1276+
gap: 4px;
1277+
}
1278+
.b-card-title { font-size: 17px; }
1279+
.b-card-tag { padding-top: 0; }
1280+
.b-bars { gap: 9px; }
1281+
.b-bar {
1282+
grid-template-columns: 68px 1fr 48px;
1283+
gap: 8px;
1284+
font-size: 11px;
1285+
}
1286+
.b-bar-label { letter-spacing: 0; }
1287+
.b-card-desc { font-size: 12.5px; padding-top: 12px; }
1288+
.b-card-note { font-size: 11.5px; }
11991289
}
12001290
}

src/components/why-doris-next/BenchmarkNext.tsx

Lines changed: 26 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -760,25 +760,33 @@ function CTA(): JSX.Element {
760760
<h2 className="b-cta-title" data-reveal data-reveal-delay="1">
761761
Try Apache <span className="b-accent">Doris</span> on<br />your own data.
762762
</h2>
763-
<Link
764-
className="b-btn b-btn-yellow b-cta-btn"
765-
to="/docs-next/dev/getting-started/quick-start"
766-
data-reveal
767-
data-reveal-delay="2"
768-
>
769-
<svg
770-
width="14"
771-
height="14"
772-
viewBox="0 0 24 24"
773-
fill="none"
774-
stroke="currentColor"
775-
strokeWidth="2.5"
776-
aria-hidden="true"
763+
<div className="b-cta-actions" data-reveal data-reveal-delay="2">
764+
<Link
765+
className="b-btn b-btn-yellow"
766+
to="/docs-next/dev/getting-started/quick-start"
767+
>
768+
<svg
769+
width="14"
770+
height="14"
771+
viewBox="0 0 24 24"
772+
fill="none"
773+
stroke="currentColor"
774+
strokeWidth="2.5"
775+
aria-hidden="true"
776+
>
777+
<path d="M12 4v12m0 0l-5-5m5 5l5-5M4 20h16" />
778+
</svg>
779+
Get Started
780+
</Link>
781+
<button
782+
type="button"
783+
className="b-btn b-btn-primary"
784+
disabled
785+
aria-disabled="true"
777786
>
778-
<path d="M12 4v12m0 0l-5-5m5 5l5-5M4 20h16" />
779-
</svg>
780-
Get Started
781-
</Link>
787+
See Report (Coming Soon)
788+
</button>
789+
</div>
782790
</div>
783791
</section>
784792
);

0 commit comments

Comments
 (0)