diff --git a/_site/customizations/sidebar-icons.js b/_site/customizations/sidebar-icons.js
new file mode 100644
index 000000000..b917d54a6
--- /dev/null
+++ b/_site/customizations/sidebar-icons.js
@@ -0,0 +1,50 @@
+(function () {
+ 'use strict';
+
+ var ICON_PATHS = {
+ 'Setup': 'M128,80a48,48,0,1,0,48,48A48.05,48.05,0,0,0,128,80Zm0,80a32,32,0,1,1,32-32A32,32,0,0,1,128,160Zm88-29.84q.06-2.16,0-4.32l14.92-18.64a8,8,0,0,0,1.48-7.06,107.21,107.21,0,0,0-10.88-26.25,8,8,0,0,0-6-3.93l-23.72-2.64q-1.48-1.56-3-3L186,40.54a8,8,0,0,0-3.94-6,107.71,107.71,0,0,0-26.25-10.87,8,8,0,0,0-7.06,1.49L130.16,40Q128,40,125.84,40L107.2,25.11a8,8,0,0,0-7.06-1.48A107.6,107.6,0,0,0,73.89,34.51a8,8,0,0,0-3.93,6L67.32,64.27q-1.56,1.49-3,3L40.54,70a8,8,0,0,0-6,3.94,107.71,107.71,0,0,0-10.87,26.25,8,8,0,0,0,1.49,7.06L40,125.84Q40,128,40,130.16L25.11,148.8a8,8,0,0,0-1.48,7.06,107.21,107.21,0,0,0,10.88,26.25,8,8,0,0,0,6,3.93l23.72,2.64q1.49,1.56,3,3L70,215.46a8,8,0,0,0,3.94,6,107.71,107.71,0,0,0,26.25,10.87,8,8,0,0,0,7.06-1.49L125.84,216q2.16.06,4.32,0l18.64,14.92a8,8,0,0,0,7.06,1.48,107.21,107.21,0,0,0,26.25-10.88,8,8,0,0,0,3.93-6l2.64-23.72q1.56-1.48,3-3L215.46,186a8,8,0,0,0,6-3.94,107.71,107.71,0,0,0,10.87-26.25,8,8,0,0,0-1.49-7.06Zm-16.1-6.5a73.93,73.93,0,0,1,0,8.68,8,8,0,0,0,1.74,5.48l14.19,17.73a91.57,91.57,0,0,1-6.23,15L187,173.11a8,8,0,0,0-5.1,2.64,74.11,74.11,0,0,1-6.14,6.14,8,8,0,0,0-2.64,5.1l-2.51,22.58a91.32,91.32,0,0,1-15,6.23l-17.74-14.19a8,8,0,0,0-5-1.75h-.48a73.93,73.93,0,0,1-8.68,0,8,8,0,0,0-5.48,1.74L100.45,215.8a91.57,91.57,0,0,1-15-6.23L82.89,187a8,8,0,0,0-2.64-5.1,74.11,74.11,0,0,1-6.14-6.14,8,8,0,0,0-5.1-2.64L46.43,170.6a91.32,91.32,0,0,1-6.23-15l14.19-17.74a8,8,0,0,0,1.74-5.48,73.93,73.93,0,0,1,0-8.68,8,8,0,0,0-1.74-5.48L40.2,100.45a91.57,91.57,0,0,1,6.23-15L69,82.89a8,8,0,0,0,5.1-2.64,74.11,74.11,0,0,1,6.14-6.14A8,8,0,0,0,82.89,69L85.4,46.43a91.32,91.32,0,0,1,15-6.23l17.74,14.19a8,8,0,0,0,5.48,1.74,73.93,73.93,0,0,1,8.68,0,8,8,0,0,0,5.48-1.74L155.55,40.2a91.57,91.57,0,0,1,15,6.23L173.11,69a8,8,0,0,0,2.64,5.1,74.11,74.11,0,0,1,6.14,6.14,8,8,0,0,0,5.1,2.64l22.58,2.51a91.32,91.32,0,0,1,6.23,15l-14.19,17.74A8,8,0,0,0,199.87,123.66Z',
+ 'Sample datasets': 'M128,24C74.17,24,32,48.6,32,80v96c0,31.4,42.17,56,96,56s96-24.6,96-56V80C224,48.6,181.83,24,128,24Zm80,104c0,9.62-7.88,19.43-21.61,26.92C170.93,163.35,150.19,168,128,168s-42.93-4.65-58.39-13.08C55.88,147.43,48,137.62,48,128V111.36c17.06,15,46.23,24.64,80,24.64s62.94-9.68,80-24.64ZM69.61,53.08C85.07,44.65,105.81,40,128,40s42.93,4.65,58.39,13.08C200.12,60.57,208,70.38,208,80s-7.88,19.43-21.61,26.92C170.93,115.35,150.19,120,128,120s-42.93-4.65-58.39-13.08C55.88,99.43,48,89.62,48,80S55.88,60.57,69.61,53.08ZM186.39,202.92C170.93,211.35,150.19,216,128,216s-42.93-4.65-58.39-13.08C55.88,195.43,48,185.62,48,176V159.36c17.06,15,46.23,24.64,80,24.64s62.94-9.68,80-24.64V176C208,185.62,200.12,195.43,186.39,202.92Z'
+ };
+
+ var NS = 'http://www.w3.org/2000/svg';
+
+ function makeSvg(pathD) {
+ var svg = document.createElementNS(NS, 'svg');
+ svg.setAttribute('width', '16');
+ svg.setAttribute('height', '16');
+ svg.setAttribute('fill', 'currentColor');
+ svg.setAttribute('viewBox', '0 0 256 256');
+ svg.style.cssText = 'display:inline-block;flex-shrink:0;';
+ var path = document.createElementNS(NS, 'path');
+ path.setAttribute('d', pathD);
+ svg.appendChild(path);
+ return svg;
+ }
+
+ // DOM structure for group items:
+ // li[data-title][data-group-tag] > button > div > span (text label)
+ function injectIcons() {
+ Object.keys(ICON_PATHS).forEach(function (title) {
+ var li = document.querySelector('li[data-title="' + title + '"][data-group-tag]');
+ if (!li || li.dataset.chSidebarIcon) return;
+
+ var span = li.querySelector('button > div > span');
+ if (!span) return;
+
+ var labelDiv = span.parentElement;
+ li.dataset.chSidebarIcon = '1';
+ labelDiv.style.cssText = 'display:flex;align-items:center;gap:6px;';
+ labelDiv.insertBefore(makeSvg(ICON_PATHS[title]), span);
+ });
+ }
+
+ // ── Init ─────────────────────────────────────────────────────────────────
+ var observer = new MutationObserver(injectIcons);
+ observer.observe(document.documentElement, { childList: true, subtree: true });
+
+ if (document.readyState === 'loading') {
+ document.addEventListener('DOMContentLoaded', injectIcons);
+ } else {
+ injectIcons();
+ }
+})();
diff --git a/_site/styles.css b/_site/styles.css
index 4ce11a18a..8718b4a15 100644
--- a/_site/styles.css
+++ b/_site/styles.css
@@ -2,8 +2,24 @@
locks body scroll and the scrollbar disappears. react-remove-scroll
compensates with margin-right on body, but that double-compensates when
the gutter is already reserved — zero it out. */
+/* Hero cards on the home page */
+.dark .ch-hero-card {
+ background-color: #191919 !important;
+ border-color: #2B2B2B !important;
+}
+
html {
scrollbar-gutter: stable;
+ /* Override Inkeep's default dark overlay color (rgba(136,144,150,0.5) — grey/light)
+ via CSS custom property inheritance into the shadow DOM. */
+ --ikp-color-overlay-dark: rgba(0, 0, 0, 0.8);
+}
+
+/* Belt-and-suspenders: if the Inkeep dialog overlay is portaled to document.body
+ (outside the shadow root), target it directly. */
+[data-radix-dialog-overlay],
+[data-overlay] {
+ background-color: rgba(0, 0, 0, 0.8) !important;
}
/* Override Mintlify prose link color rules for CTA buttons.
diff --git a/docs.json b/docs.json
index 7f69aa079..31f7e8e1e 100644
--- a/docs.json
+++ b/docs.json
@@ -9,7 +9,7 @@
},
"background": {
"color": {
- "dark": "#1D1D1D",
+ "dark": "#151515",
"light": "#FFFFFF"
}
},
@@ -57,6 +57,9 @@
},
{
"src": "/_site/customizations/clickhouse-sql-highlight.js"
+ },
+ {
+ "src": "/_site/customizations/sidebar-icons.js"
}
],
"navigation": {
diff --git a/get-started/navigation.json b/get-started/navigation.json
index cc9685689..df613e261 100644
--- a/get-started/navigation.json
+++ b/get-started/navigation.json
@@ -2,9 +2,10 @@
"item": "Get started",
"icon": "/images/icons/icon-get-started.svg",
"pages": [
- "index",
+ {"page": "index", "icon": "/images/menu-icon-house.svg"},
{
"group": "Get started",
+ "icon": "/images/menu-icon-lightning.svg",
"pages": [
{
"group": "FAQ",
@@ -33,6 +34,7 @@
},
{
"group": "Setup",
+ "icon": "/images/menu-icon-gear.svg",
"root": "get-started/setup/install",
"expanded": true,
"pages": [
@@ -134,6 +136,7 @@
},
{
"group": "Sample datasets",
+ "icon": "/images/menu-icon-database.svg",
"expanded": true,
"root": "get-started/sample-datasets/index",
"pages": [
diff --git a/get-started/sample-datasets/index.mdx b/get-started/sample-datasets/index.mdx
index 7e65f005e..0774c8cc2 100644
--- a/get-started/sample-datasets/index.mdx
+++ b/get-started/sample-datasets/index.mdx
@@ -2,6 +2,7 @@
description: 'Get started with ClickHouse using our tutorials and example datasets'
keywords: ['clickhouse', 'install', 'tutorial', 'sample', 'datasets']
sidebarTitle: 'Overview'
+icon: '/images/menu-icon-database.svg'
slug: /getting-started/example-datasets/
title: 'Tutorials and example datasets'
doc_type: 'landing-page'
diff --git a/get-started/setup/install.mdx b/get-started/setup/install.mdx
index 0901fe353..7c772879d 100644
--- a/get-started/setup/install.mdx
+++ b/get-started/setup/install.mdx
@@ -2,6 +2,7 @@
slug: /install
title: 'Install ClickHouse'
sidebarTitle: 'Install'
+icon: '/images/menu-icon-gear.svg'
description: 'Choose how to install ClickHouse — Cloud, a platform-specific package, Docker, or a migration from another database.'
keywords: ['clickhouse', 'install', 'getting started', 'quick start']
doc_type: 'landing-page'
diff --git a/images/menu-icon-database.svg b/images/menu-icon-database.svg
new file mode 100644
index 000000000..4877c3fd3
--- /dev/null
+++ b/images/menu-icon-database.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/images/menu-icon-gear.svg b/images/menu-icon-gear.svg
new file mode 100644
index 000000000..85bfb1138
--- /dev/null
+++ b/images/menu-icon-gear.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/images/menu-icon-house.svg b/images/menu-icon-house.svg
new file mode 100644
index 000000000..82bf9065d
--- /dev/null
+++ b/images/menu-icon-house.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/images/menu-icon-lightning.svg b/images/menu-icon-lightning.svg
new file mode 100644
index 000000000..6cb83a374
--- /dev/null
+++ b/images/menu-icon-lightning.svg
@@ -0,0 +1 @@
+
\ No newline at end of file