1249 lines
40 KiB
CSS
1249 lines
40 KiB
CSS
/**
|
|
* Hindsight custom theme - Modern, clean style
|
|
*/
|
|
|
|
/* Primary colors - Blue to Teal gradient theme */
|
|
:root {
|
|
/* Primary gradient */
|
|
--hindsight-gradient: linear-gradient(135deg, #0074d9 0%, #009296 100%);
|
|
--hindsight-gradient-start: #0074d9;
|
|
--hindsight-gradient-end: #009296;
|
|
|
|
/* Fallback solid colors (midpoint of gradient) */
|
|
--ifm-color-primary: #0074d9;
|
|
--ifm-color-primary-dark: #0068c3;
|
|
--ifm-color-primary-darker: #005db0;
|
|
--ifm-color-primary-darkest: #004d91;
|
|
--ifm-color-primary-light: #1a85e0;
|
|
--ifm-color-primary-lighter: #3396e8;
|
|
--ifm-color-primary-lightest: #e6f3ff;
|
|
|
|
--ifm-code-font-size: 90%;
|
|
--docusaurus-highlighted-code-line-bg: rgba(0, 116, 217, 0.1);
|
|
|
|
/* Typography */
|
|
--ifm-font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
--ifm-heading-font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
--ifm-font-family-monospace: 'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Cascadia Code', Consolas, monospace;
|
|
--ifm-font-weight-semibold: 600;
|
|
--ifm-font-size-base: 96%;
|
|
|
|
/* Spacing */
|
|
--ifm-spacing-horizontal: 1.5rem;
|
|
--ifm-navbar-height: 4.5rem;
|
|
|
|
/* Borders */
|
|
--ifm-global-radius: 0.5rem;
|
|
}
|
|
|
|
[data-theme='dark'] {
|
|
--ifm-color-primary: #3396e8;
|
|
--ifm-color-primary-dark: #1a85e0;
|
|
--ifm-color-primary-darker: #0074d9;
|
|
--ifm-color-primary-darkest: #0068c3;
|
|
--ifm-color-primary-light: #66b3f0;
|
|
--ifm-color-primary-lighter: #99cff5;
|
|
--ifm-color-primary-lightest: rgba(51, 150, 232, 0.15);
|
|
--docusaurus-highlighted-code-line-bg: rgba(51, 150, 232, 0.15);
|
|
|
|
--ifm-background-color: #09090b;
|
|
--ifm-background-surface-color: #18181b;
|
|
--ifm-navbar-background-color: #09090b;
|
|
--ifm-footer-background-color: #09090b;
|
|
--ifm-toc-border-color: #27272a;
|
|
}
|
|
|
|
/* Gradient text utility */
|
|
.gradient-text {
|
|
background: var(--hindsight-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
/* Navbar styling */
|
|
.navbar {
|
|
box-shadow: none;
|
|
border-bottom: 1px solid var(--ifm-toc-border-color);
|
|
padding: 0 1rem;
|
|
}
|
|
|
|
.navbar__logo {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.navbar__title {
|
|
font-weight: 700;
|
|
font-size: 1.125rem;
|
|
background: var(--hindsight-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
.navbar__items {
|
|
gap: 0.25rem;
|
|
}
|
|
|
|
.navbar__link {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
font-weight: 700;
|
|
font-size: 0.9rem;
|
|
padding: 0.625rem 1rem;
|
|
border-radius: 0.375rem;
|
|
transition: background-color 0.15s ease;
|
|
}
|
|
|
|
/* Navbar icons (desktop only) */
|
|
@media (min-width: 1400px) {
|
|
.navbar-item-developer::before,
|
|
.navbar-item-sdks::before,
|
|
.navbar-item-api::before,
|
|
.navbar-item-cookbook::before,
|
|
.navbar-item-changelog::before {
|
|
display: inline-block;
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-right: 6px;
|
|
vertical-align: middle;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
content: '';
|
|
}
|
|
|
|
.navbar-item-developer::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23666' d='M71.68 97.22 34.74 128l36.94 30.78a12 12 0 1 1-15.36 18.44l-48-40a12 12 0 0 1 0-18.44l48-40a12 12 0 0 1 15.36 18.44Zm176 21.56-48-40a12 12 0 1 0-15.36 18.44L221.26 128l-36.94 30.78a12 12 0 1 0 15.36 18.44l48-40a12 12 0 0 0 0-18.44ZM164.1 28.72a12 12 0 0 0-15.38 7.18l-64 176a12 12 0 0 0 7.18 15.37 11.79 11.79 0 0 0 4.1.73 12 12 0 0 0 11.28-7.9l64-176a12 12 0 0 0-7.18-15.38Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
.navbar-item-sdks::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23666' d='m225.6 62.64-88-48.17a19.91 19.91 0 0 0-19.2 0l-88 48.17A20 20 0 0 0 20 80.19v95.62a20 20 0 0 0 10.4 17.55l88 48.17a19.89 19.89 0 0 0 19.2 0l88-48.17a20 20 0 0 0 10.4-17.55V80.19a20 20 0 0 0-10.4-17.55ZM128 36.57 200 76l-72 39.42L56 76ZM44 96.82l72 39.43v76.89l-72-39.42Zm96 116.32v-76.89l72-39.43v76.89Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
.navbar-item-api::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23666' d='M180.49 143.51a12 12 0 0 1 0 17l-24 24a12 12 0 0 1-17-17L155 152l-15.52-15.51a12 12 0 0 1 17-17ZM112.49 120.49a12 12 0 0 0-17 0l-24 24a12 12 0 0 0 0 17l24 24a12 12 0 0 0 17-17L97 153l15.52-15.51a12 12 0 0 0-.03-17ZM220 88v24a12 12 0 0 1-24 0v-16h-44a12 12 0 0 1-12-12V40H60v68a12 12 0 0 1-24 0V40a20 20 0 0 1 20-20h96a12 12 0 0 1 8.49 3.52l56 56A12 12 0 0 1 220 88Zm-60-8h23L160 57Zm-4 132H60v-12a12 12 0 0 0-24 0v12a20 20 0 0 0 20 20h100a12 12 0 0 0 0-24Zm64-44a12 12 0 0 0-12 12v36h-44a12 12 0 0 0 0 24h44a20 20 0 0 0 20-20v-40a12 12 0 0 0-8-12Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
.navbar-item-cookbook::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23666' d='M224 44H160a43.86 43.86 0 0 0-32 13.85A43.86 43.86 0 0 0 96 44H32a20 20 0 0 0-20 20v128a20 20 0 0 0 20 20h64a20 20 0 0 1 20 20 12 12 0 0 0 24 0 20 20 0 0 1 20-20h64a20 20 0 0 0 20-20V64a20 20 0 0 0-20-20ZM96 188H36V68h60a20 20 0 0 1 20 20v108.69A43.74 43.74 0 0 0 96 188Zm124 0h-60a43.74 43.74 0 0 0-20 8.69V88a20 20 0 0 1 20-20h60Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
.navbar-item-changelog::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23666' d='M140 80v41.21l34.17 20.5a12 12 0 1 1-12.34 20.58l-40-24A12 12 0 0 1 116 128V80a12 12 0 0 1 24 0Zm-12-52a99.38 99.38 0 0 0-70.76 29.34c-4.69 4.74-9 9.37-13.24 14V64a12 12 0 0 0-24 0v40a12 12 0 0 0 12 12h40a12 12 0 0 0 0-24H53.41c4.24-5.95 8.53-11.93 13.49-16.95A76 76 0 1 1 52 128a12 12 0 0 0-24 0 100 100 0 1 0 100-100Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
/* Dark mode icons */
|
|
[data-theme='dark'] .navbar-item-developer::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23ccc' d='M71.68 97.22 34.74 128l36.94 30.78a12 12 0 1 1-15.36 18.44l-48-40a12 12 0 0 1 0-18.44l48-40a12 12 0 0 1 15.36 18.44Zm176 21.56-48-40a12 12 0 1 0-15.36 18.44L221.26 128l-36.94 30.78a12 12 0 1 0 15.36 18.44l48-40a12 12 0 0 0 0-18.44ZM164.1 28.72a12 12 0 0 0-15.38 7.18l-64 176a12 12 0 0 0 7.18 15.37 11.79 11.79 0 0 0 4.1.73 12 12 0 0 0 11.28-7.9l64-176a12 12 0 0 0-7.18-15.38Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-item-sdks::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23ccc' d='m225.6 62.64-88-48.17a19.91 19.91 0 0 0-19.2 0l-88 48.17A20 20 0 0 0 20 80.19v95.62a20 20 0 0 0 10.4 17.55l88 48.17a19.89 19.89 0 0 0 19.2 0l88-48.17a20 20 0 0 0 10.4-17.55V80.19a20 20 0 0 0-10.4-17.55ZM128 36.57 200 76l-72 39.42L56 76ZM44 96.82l72 39.43v76.89l-72-39.42Zm96 116.32v-76.89l72-39.43v76.89Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-item-api::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23ccc' d='M180.49 143.51a12 12 0 0 1 0 17l-24 24a12 12 0 0 1-17-17L155 152l-15.52-15.51a12 12 0 0 1 17-17ZM112.49 120.49a12 12 0 0 0-17 0l-24 24a12 12 0 0 0 0 17l24 24a12 12 0 0 0 17-17L97 153l15.52-15.51a12 12 0 0 0-.03-17ZM220 88v24a12 12 0 0 1-24 0v-16h-44a12 12 0 0 1-12-12V40H60v68a12 12 0 0 1-24 0V40a20 20 0 0 1 20-20h96a12 12 0 0 1 8.49 3.52l56 56A12 12 0 0 1 220 88Zm-60-8h23L160 57Zm-4 132H60v-12a12 12 0 0 0-24 0v12a20 20 0 0 0 20 20h100a12 12 0 0 0 0-24Zm64-44a12 12 0 0 0-12 12v36h-44a12 12 0 0 0 0 24h44a20 20 0 0 0 20-20v-40a12 12 0 0 0-8-12Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-item-cookbook::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23ccc' d='M224 44H160a43.86 43.86 0 0 0-32 13.85A43.86 43.86 0 0 0 96 44H32a20 20 0 0 0-20 20v128a20 20 0 0 0 20 20h64a20 20 0 0 1 20 20 12 12 0 0 0 24 0 20 20 0 0 1 20-20h64a20 20 0 0 0 20-20V64a20 20 0 0 0-20-20ZM96 188H36V68h60a20 20 0 0 1 20 20v108.69A43.74 43.74 0 0 0 96 188Zm124 0h-60a43.74 43.74 0 0 0-20 8.69V88a20 20 0 0 1 20-20h60Z'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-item-changelog::before {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23ccc' d='M140 80v41.21l34.17 20.5a12 12 0 1 1-12.34 20.58l-40-24A12 12 0 0 1 116 128V80a12 12 0 0 1 24 0Zm-12-52a99.38 99.38 0 0 0-70.76 29.34c-4.69 4.74-9 9.37-13.24 14V64a12 12 0 0 0-24 0v40a12 12 0 0 0 12 12h40a12 12 0 0 0 0-24H53.41c4.24-5.95 8.53-11.93 13.49-16.95A76 76 0 1 1 52 128a12 12 0 0 0-24 0 100 100 0 1 0 100-100Z'/%3E%3C/svg%3E");
|
|
}
|
|
}
|
|
|
|
/* GitHub icon link */
|
|
.header-github-link::before {
|
|
content: '';
|
|
width: 24px;
|
|
height: 24px;
|
|
display: flex;
|
|
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23666' d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E") no-repeat;
|
|
}
|
|
|
|
[data-theme='dark'] .header-github-link::before {
|
|
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E") no-repeat;
|
|
}
|
|
|
|
.header-github-link:hover {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.navbar__link:hover {
|
|
background-color: var(--ifm-background-surface-color);
|
|
}
|
|
|
|
.navbar__link--active {
|
|
background: var(--hindsight-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
[data-theme='dark'] .navbar__link:hover {
|
|
background-color: #27272a;
|
|
}
|
|
|
|
/* Desktop navbar - hide hamburger toggle at >= 1400px */
|
|
@media (min-width: 1400px) {
|
|
.navbar__toggle {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
/* Mobile navbar - show hamburger, hide desktop items at < 1400px */
|
|
@media (max-width: 1399px) {
|
|
:root {
|
|
--ifm-navbar-height: 3.5rem;
|
|
}
|
|
|
|
.navbar {
|
|
padding: 0 0.75rem;
|
|
}
|
|
|
|
.navbar__logo {
|
|
margin-bottom: 0;
|
|
height: 24px !important;
|
|
}
|
|
|
|
.navbar__logo img {
|
|
height: 24px !important;
|
|
}
|
|
|
|
/* Hide all desktop navbar items except logo and toggle */
|
|
.navbar__items--right > .navbar__item {
|
|
display: none !important;
|
|
}
|
|
|
|
.navbar__items--left > .navbar__link {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Show hamburger toggle */
|
|
.navbar__toggle {
|
|
display: flex !important;
|
|
color: var(--ifm-color-primary);
|
|
}
|
|
|
|
/* Mobile sidebar */
|
|
.navbar-sidebar {
|
|
background: #ffffff !important;
|
|
}
|
|
|
|
.navbar-sidebar__brand {
|
|
padding: 1rem;
|
|
border-bottom: 1px solid var(--ifm-toc-border-color);
|
|
background: #ffffff !important;
|
|
}
|
|
|
|
.navbar-sidebar__items {
|
|
padding: 1rem 0;
|
|
background: #ffffff !important;
|
|
}
|
|
|
|
.navbar-sidebar .menu__link {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
font-weight: 600;
|
|
font-size: 1rem;
|
|
padding: 0.75rem 1.25rem;
|
|
color: #1e293b !important;
|
|
}
|
|
|
|
.navbar-sidebar .menu__link--active {
|
|
background: var(--hindsight-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
/* Close button */
|
|
.navbar-sidebar__close {
|
|
color: #1e293b !important;
|
|
}
|
|
|
|
/* Backdrop overlay */
|
|
.navbar-sidebar__backdrop {
|
|
background: rgba(0, 0, 0, 0.5) !important;
|
|
}
|
|
}
|
|
|
|
/* Dark mode mobile sidebar */
|
|
@media (max-width: 1399px) {
|
|
[data-theme='dark'] .navbar-sidebar {
|
|
background: #09090b !important;
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-sidebar__brand {
|
|
background: #09090b !important;
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-sidebar__items {
|
|
background: #09090b !important;
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-sidebar .menu__link {
|
|
color: #e2e8f0 !important;
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-sidebar .menu__link--active,
|
|
[data-theme='dark'] .navbar-sidebar .menu__link--active:hover {
|
|
color: transparent !important;
|
|
background: var(--hindsight-gradient) !important;
|
|
-webkit-background-clip: text !important;
|
|
-webkit-text-fill-color: transparent !important;
|
|
background-clip: text !important;
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-sidebar__close {
|
|
color: #e2e8f0 !important;
|
|
}
|
|
}
|
|
|
|
/* Mobile sidebar - show right navbar items */
|
|
@media (max-width: 1399px) {
|
|
/* Ensure right-side items are visible in mobile sidebar */
|
|
.navbar-sidebar .navbar__item {
|
|
display: block !important;
|
|
}
|
|
|
|
/* GitHub icon - add text label in mobile */
|
|
.navbar-sidebar .header-github-link::before {
|
|
display: none;
|
|
}
|
|
|
|
.navbar-sidebar .header-github-link::after {
|
|
content: 'GitHub';
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
font-weight: 600;
|
|
font-size: 1rem;
|
|
color: #1e293b;
|
|
}
|
|
|
|
[data-theme='dark'] .navbar-sidebar .header-github-link::after {
|
|
color: #e2e8f0;
|
|
}
|
|
}
|
|
|
|
/* Hero section */
|
|
.hero {
|
|
padding: 4rem 0;
|
|
}
|
|
|
|
.hero--primary {
|
|
background: linear-gradient(135deg, var(--hindsight-gradient-start) 0%, var(--hindsight-gradient-end) 100%);
|
|
}
|
|
|
|
[data-theme='dark'] .hero--primary {
|
|
background: linear-gradient(135deg, #0f1419 0%, #0d1117 100%);
|
|
}
|
|
|
|
.hero__title {
|
|
font-size: 3rem;
|
|
font-weight: 800;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.hero__subtitle {
|
|
font-size: 1.125rem;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
/* Buttons */
|
|
.button {
|
|
border-radius: 0.5rem;
|
|
font-weight: 600;
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.button--primary {
|
|
background: var(--hindsight-gradient);
|
|
border: none;
|
|
color: white;
|
|
}
|
|
|
|
.button--primary:hover {
|
|
background: linear-gradient(135deg, #005db0 0%, #007a7d 100%);
|
|
color: white;
|
|
}
|
|
|
|
.button--secondary {
|
|
background: transparent;
|
|
border: 2px solid var(--hindsight-gradient-start);
|
|
color: var(--ifm-color-primary);
|
|
}
|
|
|
|
.button--secondary:hover {
|
|
background: var(--hindsight-gradient);
|
|
border-color: transparent;
|
|
color: white;
|
|
}
|
|
|
|
/* Sidebar */
|
|
.menu__link {
|
|
border-radius: 0.375rem;
|
|
font-weight: 500;
|
|
font-size: 0.8125rem;
|
|
}
|
|
|
|
.menu__link--active {
|
|
background: linear-gradient(135deg, rgba(0, 116, 217, 0.1) 0%, rgba(0, 146, 150, 0.1) 100%);
|
|
}
|
|
|
|
.menu__link--active .menu__link {
|
|
background: var(--hindsight-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
[data-theme='dark'] .menu__link--active {
|
|
background: linear-gradient(135deg, rgba(0, 116, 217, 0.15) 0%, rgba(0, 146, 150, 0.15) 100%);
|
|
}
|
|
|
|
/* Non-collapsible category styling */
|
|
.menu__list-item-collapsible {
|
|
font-weight: 600;
|
|
font-size: 0.6875rem;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.05em;
|
|
color: var(--ifm-color-emphasis-600);
|
|
margin-top: 1rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
|
|
.menu__list-item-collapsible:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.menu__list-item-collapsible .menu__link {
|
|
padding: 0.25rem 0.75rem;
|
|
}
|
|
|
|
.menu__list-item-collapsible .menu__link:hover {
|
|
background: transparent;
|
|
}
|
|
|
|
[data-theme='dark'] .menu__list-item-collapsible {
|
|
color: var(--ifm-color-emphasis-500);
|
|
}
|
|
|
|
/* Code blocks */
|
|
pre,
|
|
pre code,
|
|
.prism-code {
|
|
font-family: 'JetBrains Mono', var(--ifm-font-family-monospace) !important;
|
|
}
|
|
|
|
.prism-code {
|
|
border-radius: 0.5rem;
|
|
font-size: 0.875rem;
|
|
line-height: 1.6;
|
|
padding: 1rem !important;
|
|
}
|
|
|
|
/* Inline code */
|
|
code {
|
|
border-radius: 0.375rem;
|
|
padding: 0.2rem 0.45rem;
|
|
font-size: 0.875em;
|
|
font-family: 'JetBrains Mono', var(--ifm-font-family-monospace) !important;
|
|
background-color: #f1f5f9;
|
|
color: #0f172a;
|
|
font-weight: 500;
|
|
}
|
|
|
|
[data-theme='dark'] code {
|
|
background-color: #1e293b;
|
|
color: #e2e8f0;
|
|
}
|
|
|
|
/* Don't apply inline styles to code inside pre blocks */
|
|
pre code {
|
|
background-color: transparent !important;
|
|
border: none;
|
|
padding: 0;
|
|
font-size: inherit;
|
|
color: inherit;
|
|
font-weight: normal;
|
|
}
|
|
|
|
/* Code block container - single background source */
|
|
div[class*="codeBlockContainer"] {
|
|
border-radius: 0.5rem;
|
|
border: 1px solid var(--ifm-toc-border-color);
|
|
overflow: hidden;
|
|
background: #f8fafc !important;
|
|
}
|
|
|
|
[data-theme='dark'] div[class*="codeBlockContainer"] {
|
|
background: #0f172a !important;
|
|
}
|
|
|
|
div[class*="codeBlockTitle"] {
|
|
font-size: 0.75rem;
|
|
padding: 0.5rem 1rem;
|
|
border-bottom: 1px solid var(--ifm-toc-border-color);
|
|
font-family: 'JetBrains Mono', var(--ifm-font-family-monospace);
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Code block content area - transparent to show container bg */
|
|
div[class*="codeBlockContent"],
|
|
div[class*="codeBlockContent"] pre,
|
|
div[class*="codeBlockContent"] .prism-code {
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Prism token backgrounds */
|
|
.prism-code span {
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Cards/Features */
|
|
.features {
|
|
padding: 4rem 0;
|
|
}
|
|
|
|
/* Docs page */
|
|
.theme-doc-markdown {
|
|
max-width: 100%;
|
|
}
|
|
|
|
/* Page title with gradient */
|
|
article h1,
|
|
.markdown h1,
|
|
header h1,
|
|
h1[class*="title"] {
|
|
font-size: 2.25rem;
|
|
font-weight: 800;
|
|
margin-bottom: 1.25rem;
|
|
background-image: linear-gradient(90deg, #0074d9, #009296) !important;
|
|
background-size: 100% !important;
|
|
-webkit-background-clip: text !important;
|
|
background-clip: text !important;
|
|
-webkit-text-fill-color: transparent !important;
|
|
color: transparent !important;
|
|
display: inline-block;
|
|
}
|
|
|
|
article h2 {
|
|
font-size: 1.5rem;
|
|
font-weight: 700;
|
|
margin-top: 2rem;
|
|
margin-bottom: 0.75rem;
|
|
padding-bottom: 0.5rem;
|
|
border-bottom: 2px solid transparent;
|
|
border-image: var(--hindsight-gradient);
|
|
border-image-slice: 1;
|
|
}
|
|
|
|
article h3 {
|
|
font-size: 1.125rem;
|
|
font-weight: 600;
|
|
margin-top: 1.25rem;
|
|
}
|
|
|
|
article p {
|
|
font-size: 0.9375rem;
|
|
line-height: 1.7;
|
|
}
|
|
|
|
/* Links with gradient */
|
|
article a:not(.button):not([class*="hash-link"]) {
|
|
background: var(--hindsight-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
text-decoration: none;
|
|
font-weight: 500;
|
|
}
|
|
|
|
/* Links containing code - the code inherits the transparent text-fill from the link */
|
|
article a code {
|
|
-webkit-text-fill-color: #3396e8 !important;
|
|
color: #3396e8 !important;
|
|
}
|
|
|
|
article a:hover code {
|
|
-webkit-text-fill-color: #0074d9 !important;
|
|
color: #0074d9 !important;
|
|
}
|
|
|
|
article a:not(.button):not([class*="hash-link"]):hover {
|
|
text-decoration: underline;
|
|
text-decoration-color: var(--hindsight-gradient-start);
|
|
}
|
|
|
|
/* Admonitions - gradient themed */
|
|
.theme-admonition,
|
|
[class*="admonition_"] {
|
|
border-radius: 0.5rem !important;
|
|
border-left: none !important;
|
|
border: none !important;
|
|
background: rgba(0, 116, 217, 0.05) !important;
|
|
position: relative !important;
|
|
overflow: hidden !important;
|
|
padding-left: 1.25rem !important;
|
|
}
|
|
|
|
/* Gradient left border using pseudo-element */
|
|
.theme-admonition::before,
|
|
[class*="admonition_"]::before {
|
|
content: '' !important;
|
|
position: absolute !important;
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
bottom: 0 !important;
|
|
width: 4px !important;
|
|
background: linear-gradient(180deg, #0074d9, #009296) !important;
|
|
border-radius: 0.5rem 0 0 0.5rem !important;
|
|
}
|
|
|
|
/* Admonition heading text - gradient */
|
|
[class*="admonitionHeading_"] {
|
|
background-image: linear-gradient(90deg, #0074d9, #009296) !important;
|
|
-webkit-background-clip: text !important;
|
|
background-clip: text !important;
|
|
-webkit-text-fill-color: transparent !important;
|
|
color: transparent !important;
|
|
display: inline-flex !important;
|
|
align-items: center !important;
|
|
}
|
|
|
|
/* Admonition icon - gradient start color */
|
|
[class*="admonitionIcon_"] svg,
|
|
[class*="admonitionIcon_"] svg path {
|
|
fill: #0074d9 !important;
|
|
}
|
|
|
|
/* Different admonition types */
|
|
.alert--info[class*="admonition_"],
|
|
.theme-admonition-info {
|
|
background: rgba(0, 116, 217, 0.05) !important;
|
|
}
|
|
|
|
.alert--success[class*="admonition_"],
|
|
.theme-admonition-tip {
|
|
background: rgba(0, 146, 150, 0.05) !important;
|
|
}
|
|
|
|
.alert--warning[class*="admonition_"],
|
|
.theme-admonition-warning {
|
|
background: rgba(0, 116, 217, 0.08) !important;
|
|
}
|
|
|
|
.alert--secondary[class*="admonition_"],
|
|
.theme-admonition-note {
|
|
background: rgba(0, 131, 154, 0.05) !important;
|
|
}
|
|
|
|
/* Dark mode admonitions */
|
|
[data-theme='dark'] .theme-admonition,
|
|
[data-theme='dark'] [class*="admonition_"] {
|
|
background: rgba(0, 131, 154, 0.1) !important;
|
|
}
|
|
|
|
[data-theme='dark'] .theme-admonition::before,
|
|
[data-theme='dark'] [class*="admonition_"]::before {
|
|
background: linear-gradient(180deg, #3396e8, #00b4b8) !important;
|
|
}
|
|
|
|
/* Tables - Compact styling */
|
|
table {
|
|
display: table;
|
|
width: 100%;
|
|
font-size: 0.8125rem;
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
th, td {
|
|
border: 1px solid var(--ifm-toc-border-color);
|
|
padding: 0.5rem 0.75rem;
|
|
}
|
|
|
|
th {
|
|
background: var(--ifm-background-surface-color);
|
|
font-weight: 600;
|
|
font-size: 0.75rem;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.025em;
|
|
}
|
|
|
|
/* Footer */
|
|
.footer {
|
|
border-top: 1px solid var(--ifm-toc-border-color);
|
|
}
|
|
|
|
.footer__title {
|
|
font-weight: 700;
|
|
}
|
|
|
|
/* Tabs styling */
|
|
.tabs-container {
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
.tabs__item {
|
|
font-size: 0.8125rem;
|
|
padding: 0.5rem 1rem;
|
|
}
|
|
|
|
.tabs__item--active {
|
|
border-bottom-color: var(--hindsight-gradient-start);
|
|
background: var(--hindsight-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
|
|
/* Redoc sidebar - expand all tags by default */
|
|
[class*="redoc-wrap"] [class*="menu-content"] ul {
|
|
display: block !important;
|
|
}
|
|
|
|
/* Hide Redoc footer/branding */
|
|
[class*="redoc-wrap"] a[href*="redocly.com"] {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Mermaid diagram styling - using high specificity selectors */
|
|
.mermaid svg[id^="mermaid"] {
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Node shapes - gradient start color (#0074d9 blue) */
|
|
.mermaid svg[id^="mermaid"] .node rect,
|
|
.mermaid svg[id^="mermaid"] .node circle,
|
|
.mermaid svg[id^="mermaid"] .node ellipse,
|
|
.mermaid svg[id^="mermaid"] .node polygon,
|
|
.mermaid svg[id^="mermaid"] .node path,
|
|
svg[id^="mermaid"] .node rect,
|
|
svg[id^="mermaid"] .node circle,
|
|
svg[id^="mermaid"] .node ellipse,
|
|
svg[id^="mermaid"] .node polygon,
|
|
svg[id^="mermaid"] .node path {
|
|
fill: #0074d9 !important;
|
|
stroke: #005db0 !important;
|
|
}
|
|
|
|
/* Node text - white on colored background, Inter font */
|
|
.mermaid svg[id^="mermaid"] .node .label,
|
|
.mermaid svg[id^="mermaid"] .nodeLabel,
|
|
.mermaid svg[id^="mermaid"] .node text,
|
|
.mermaid svg[id^="mermaid"] .node foreignObject div,
|
|
.mermaid svg[id^="mermaid"] .node foreignObject span,
|
|
.mermaid svg[id^="mermaid"] .node foreignObject p,
|
|
svg[id^="mermaid"] .node .label,
|
|
svg[id^="mermaid"] .nodeLabel,
|
|
svg[id^="mermaid"] .node text,
|
|
svg[id^="mermaid"] .node foreignObject div,
|
|
svg[id^="mermaid"] .node foreignObject span,
|
|
svg[id^="mermaid"] .node foreignObject p {
|
|
color: #ffffff !important;
|
|
fill: #ffffff !important;
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.9375rem !important;
|
|
}
|
|
|
|
/* Edge/arrow lines - gradient end color (#009296 teal) */
|
|
.mermaid svg[id^="mermaid"] .edgePath .path,
|
|
.mermaid svg[id^="mermaid"] .flowchart-link,
|
|
svg[id^="mermaid"] .edgePath .path,
|
|
svg[id^="mermaid"] .flowchart-link {
|
|
stroke: #009296 !important;
|
|
}
|
|
|
|
/* Arrow heads - gradient end color */
|
|
.mermaid svg[id^="mermaid"] .marker path,
|
|
.mermaid svg[id^="mermaid"] .arrowheadPath,
|
|
.mermaid svg[id^="mermaid"] marker path,
|
|
svg[id^="mermaid"] .marker path,
|
|
svg[id^="mermaid"] .arrowheadPath,
|
|
svg[id^="mermaid"] marker path {
|
|
fill: #009296 !important;
|
|
stroke: #009296 !important;
|
|
}
|
|
|
|
/* Edge labels - transparent background, Inter font */
|
|
.mermaid svg[id^="mermaid"] .edgeLabel,
|
|
.mermaid svg[id^="mermaid"] .edgeLabel rect,
|
|
.mermaid svg[id^="mermaid"] .edgeLabel span,
|
|
.mermaid svg[id^="mermaid"] .labelBkg,
|
|
svg[id^="mermaid"] .edgeLabel,
|
|
svg[id^="mermaid"] .edgeLabel rect,
|
|
svg[id^="mermaid"] .edgeLabel span,
|
|
svg[id^="mermaid"] .labelBkg {
|
|
background: transparent !important;
|
|
background-color: transparent !important;
|
|
fill: transparent !important;
|
|
}
|
|
|
|
.mermaid svg[id^="mermaid"] .edgeLabel text,
|
|
.mermaid svg[id^="mermaid"] .edgeLabel span,
|
|
.mermaid svg[id^="mermaid"] .edgeLabel p,
|
|
svg[id^="mermaid"] .edgeLabel text,
|
|
svg[id^="mermaid"] .edgeLabel span,
|
|
svg[id^="mermaid"] .edgeLabel p {
|
|
color: var(--ifm-font-color-base) !important;
|
|
fill: var(--ifm-font-color-base) !important;
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.875rem !important;
|
|
}
|
|
|
|
/* Cluster/subgraph boxes - gradient end color border (#009296) */
|
|
.mermaid svg[id^="mermaid"] .cluster rect,
|
|
svg[id^="mermaid"] .cluster rect {
|
|
fill: rgba(0, 146, 150, 0.08) !important;
|
|
stroke: #009296 !important;
|
|
stroke-width: 2px !important;
|
|
}
|
|
|
|
/* Cluster labels - Inter font */
|
|
.mermaid svg[id^="mermaid"] .cluster text,
|
|
.mermaid svg[id^="mermaid"] .cluster .nodeLabel,
|
|
.mermaid svg[id^="mermaid"] .cluster-label text,
|
|
.mermaid svg[id^="mermaid"] .cluster-label span,
|
|
.mermaid svg[id^="mermaid"] .cluster-label p,
|
|
svg[id^="mermaid"] .cluster text,
|
|
svg[id^="mermaid"] .cluster .nodeLabel,
|
|
svg[id^="mermaid"] .cluster-label text,
|
|
svg[id^="mermaid"] .cluster-label span,
|
|
svg[id^="mermaid"] .cluster-label p {
|
|
color: var(--ifm-font-color-base) !important;
|
|
fill: var(--ifm-font-color-base) !important;
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.9375rem !important;
|
|
}
|
|
|
|
/* All mermaid text should use Inter */
|
|
.mermaid svg[id^="mermaid"] text,
|
|
.mermaid svg[id^="mermaid"] span,
|
|
.mermaid svg[id^="mermaid"] p,
|
|
svg[id^="mermaid"] text,
|
|
svg[id^="mermaid"] span,
|
|
svg[id^="mermaid"] p {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
}
|
|
|
|
/* Dark mode adjustments */
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .edgeLabel text,
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .edgeLabel span,
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .edgeLabel p,
|
|
[data-theme='dark'] svg[id^="mermaid"] .edgeLabel text,
|
|
[data-theme='dark'] svg[id^="mermaid"] .edgeLabel span,
|
|
[data-theme='dark'] svg[id^="mermaid"] .edgeLabel p {
|
|
color: #e2e8f0 !important;
|
|
fill: #e2e8f0 !important;
|
|
}
|
|
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .cluster text,
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .cluster-label text,
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .cluster-label span,
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .cluster-label p,
|
|
[data-theme='dark'] svg[id^="mermaid"] .cluster text,
|
|
[data-theme='dark'] svg[id^="mermaid"] .cluster-label text,
|
|
[data-theme='dark'] svg[id^="mermaid"] .cluster-label span,
|
|
[data-theme='dark'] svg[id^="mermaid"] .cluster-label p {
|
|
color: #e2e8f0 !important;
|
|
fill: #e2e8f0 !important;
|
|
}
|
|
|
|
[data-theme='dark'] .mermaid svg[id^="mermaid"] .cluster rect,
|
|
[data-theme='dark'] svg[id^="mermaid"] .cluster rect {
|
|
fill: rgba(0, 146, 150, 0.15) !important;
|
|
}
|
|
|
|
/* List styling */
|
|
article ul, article ol {
|
|
font-size: 0.9375rem;
|
|
}
|
|
|
|
article li {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
|
|
/* Announcement bar */
|
|
@keyframes shimmer {
|
|
0% {
|
|
background-position: -200% center;
|
|
}
|
|
100% {
|
|
background-position: 200% center;
|
|
}
|
|
}
|
|
|
|
@keyframes gradientShift {
|
|
0%, 100% {
|
|
background-position: 0% 50%;
|
|
}
|
|
50% {
|
|
background-position: 100% 50%;
|
|
}
|
|
}
|
|
|
|
div[class*="announcementBar"] {
|
|
padding: 0.875rem 0;
|
|
font-size: 0.875rem;
|
|
font-weight: 600;
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background: linear-gradient(90deg, #0074d9 0%, #009296 100%) !important;
|
|
background-size: 100% 100% !important;
|
|
border: none !important;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
div[class*="announcementBar"]::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: linear-gradient(
|
|
90deg,
|
|
transparent 0%,
|
|
rgba(255, 255, 255, 0.15) 50%,
|
|
transparent 100%
|
|
);
|
|
background-size: 200% 100%;
|
|
animation: shimmer 4s ease-in-out infinite;
|
|
pointer-events: none;
|
|
}
|
|
|
|
div[class*="announcementBar"] > div {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
div[class*="announcementBarContent"] {
|
|
font-size: 0.875rem;
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
letter-spacing: 0.02em;
|
|
}
|
|
|
|
div[class*="announcementBar"] a {
|
|
color: #ffffff !important;
|
|
text-decoration: none;
|
|
font-weight: 700;
|
|
padding: 0.2rem 0.6rem;
|
|
margin-left: 0.5rem;
|
|
background: rgba(255, 255, 255, 0.2);
|
|
border-radius: 0.25rem;
|
|
transition: all 0.2s ease;
|
|
font-size: 0.8125rem;
|
|
}
|
|
|
|
div[class*="announcementBar"] a:hover {
|
|
background: rgba(255, 255, 255, 0.3);
|
|
}
|
|
|
|
/* ===== Local Search Plugin Styling ===== */
|
|
|
|
/* Search bar in navbar */
|
|
.navbar__search {
|
|
margin-left: auto;
|
|
}
|
|
|
|
|
|
/* Hide keyboard shortcut hints */
|
|
[class*="searchHint"],
|
|
[class*="searchHintContainer"] {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Minimal search button */
|
|
[class*="searchBarContainer"] button,
|
|
[class*="searchBar_"] {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.75rem !important;
|
|
font-weight: 500 !important;
|
|
background: transparent !important;
|
|
border: none !important;
|
|
border-bottom: 1px solid transparent !important;
|
|
border-image: linear-gradient(90deg, #0074d9, #009296) 1 !important;
|
|
border-radius: 0 !important;
|
|
padding: 0.25rem 0 !important;
|
|
color: var(--ifm-color-emphasis-600) !important;
|
|
transition: all 0.2s ease !important;
|
|
height: auto !important;
|
|
min-height: unset !important;
|
|
}
|
|
|
|
[class*="searchBarContainer"] button:hover,
|
|
[class*="searchBar_"]:hover {
|
|
color: var(--ifm-font-color-base) !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="searchBarContainer"] button,
|
|
[data-theme='dark'] [class*="searchBar_"] {
|
|
color: var(--ifm-color-emphasis-500) !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="searchBarContainer"] button:hover,
|
|
[data-theme='dark'] [class*="searchBar_"]:hover {
|
|
color: #e2e8f0 !important;
|
|
}
|
|
|
|
/* Search input field - remove ALL borders */
|
|
[class*="searchInput"],
|
|
[class*="searchQueryInput"],
|
|
[class*="searchInput"] *,
|
|
[class*="searchQueryInput"] *,
|
|
[class*="searchBarContainer"] input,
|
|
[class*="searchBarContainer"] input * {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.875rem !important;
|
|
font-weight: 500 !important;
|
|
background: transparent !important;
|
|
border: 0 !important;
|
|
border-top: 0 !important;
|
|
border-right: 0 !important;
|
|
border-bottom: 0 !important;
|
|
border-left: 0 !important;
|
|
border-radius: 0 !important;
|
|
color: var(--ifm-font-color-base) !important;
|
|
padding: 0.5rem 0 !important;
|
|
box-shadow: none !important;
|
|
outline: none !important;
|
|
}
|
|
|
|
/* Add single underline via pseudo or direct */
|
|
[class*="searchQueryInput"],
|
|
[class*="searchBarContainer"] input[type="search"] {
|
|
border-bottom: 1px solid var(--ifm-toc-border-color) !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="searchQueryInput"],
|
|
[data-theme='dark'] [class*="searchBarContainer"] input[type="search"] {
|
|
border-bottom: 1px solid #27272a !important;
|
|
}
|
|
|
|
[class*="searchQueryInput"]:focus,
|
|
[class*="searchBarContainer"] input[type="search"]:focus {
|
|
border-bottom: 1px solid #0074d9 !important;
|
|
}
|
|
|
|
[class*="searchInput"]::placeholder,
|
|
[class*="searchQueryInput"]::placeholder,
|
|
[class*="searchBarContainer"] input::placeholder {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-weight: 500 !important;
|
|
color: var(--ifm-color-emphasis-400) !important;
|
|
}
|
|
|
|
/* Minimal dropdown */
|
|
[class*="dropdownMenu"],
|
|
[class*="suggestionsContainer"],
|
|
[class*="searchResultsContainer"],
|
|
[class*="suggestions"],
|
|
ul[class*="suggestion"] {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
background: #ffffff !important;
|
|
background-color: #ffffff !important;
|
|
border: none !important;
|
|
border-radius: 0.25rem !important;
|
|
box-shadow: 0 4px 20px -4px rgba(0, 0, 0, 0.15) !important;
|
|
padding: 0.25rem !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="dropdownMenu"],
|
|
[data-theme='dark'] [class*="suggestionsContainer"],
|
|
[data-theme='dark'] [class*="searchResultsContainer"],
|
|
[data-theme='dark'] [class*="suggestions"],
|
|
[data-theme='dark'] ul[class*="suggestion"] {
|
|
background: #0f0f11 !important;
|
|
background-color: #0f0f11 !important;
|
|
box-shadow: 0 4px 20px -4px rgba(0, 0, 0, 0.5) !important;
|
|
}
|
|
|
|
/* Minimal result items */
|
|
[class*="searchResultItem"],
|
|
[class*="suggestion"] {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
background: transparent !important;
|
|
border-radius: 0.25rem !important;
|
|
padding: 0.5rem 0.75rem !important;
|
|
margin: 0 !important;
|
|
transition: background-color 0.1s ease !important;
|
|
cursor: pointer !important;
|
|
border-left: 2px solid transparent !important;
|
|
}
|
|
|
|
/* No background hover - keep transparent */
|
|
[class*="searchResultItem"]:hover,
|
|
[class*="searchResultItem"][class*="cursor"],
|
|
[class*="suggestion"]:hover,
|
|
[class*="suggestion"][class*="cursor"] {
|
|
background: transparent !important;
|
|
border-left-color: transparent !important;
|
|
}
|
|
|
|
/* Icons - default color */
|
|
[class*="hitIcon"],
|
|
[class*="hitTree"] {
|
|
color: #71717a !important;
|
|
transition: all 0.15s ease !important;
|
|
}
|
|
|
|
[class*="hitIcon"] svg path,
|
|
[class*="hitIcon"] svg,
|
|
[class*="hitTree"] svg path,
|
|
[class*="hitTree"] svg {
|
|
stroke: #71717a !important;
|
|
color: #71717a !important;
|
|
transition: all 0.15s ease !important;
|
|
}
|
|
|
|
/* Icons - hover gradient effect */
|
|
[class*="suggestion"]:hover [class*="hitIcon"] svg path,
|
|
[class*="suggestion"]:hover [class*="hitIcon"] svg,
|
|
[class*="suggestion"]:hover [class*="hitTree"] svg path,
|
|
[class*="suggestion"]:hover [class*="hitTree"] svg {
|
|
stroke: #0074d9 !important;
|
|
color: #0074d9 !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="hitIcon"] svg path,
|
|
[data-theme='dark'] [class*="hitIcon"] svg,
|
|
[data-theme='dark'] [class*="hitTree"] svg path,
|
|
[data-theme='dark'] [class*="hitTree"] svg {
|
|
stroke: #71717a !important;
|
|
color: #71717a !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="suggestion"]:hover [class*="hitIcon"] svg path,
|
|
[data-theme='dark'] [class*="suggestion"]:hover [class*="hitIcon"] svg,
|
|
[data-theme='dark'] [class*="suggestion"]:hover [class*="hitTree"] svg path,
|
|
[data-theme='dark'] [class*="suggestion"]:hover [class*="hitTree"] svg {
|
|
stroke: #3396e8 !important;
|
|
color: #3396e8 !important;
|
|
}
|
|
|
|
/* === PAGE-LEVEL RESULTS (doc icon, no tree) === */
|
|
/* Title is the page name - GRADIENT */
|
|
[class*="suggestion"]:not(:has([class*="hitTree"])) [class*="hitTitle"] {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-weight: 600 !important;
|
|
font-size: 0.9375rem !important;
|
|
background: linear-gradient(90deg, #0074d9, #009296) !important;
|
|
-webkit-background-clip: text !important;
|
|
background-clip: text !important;
|
|
-webkit-text-fill-color: transparent !important;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
/* === SECTION-LEVEL RESULTS (hashtag icon, has tree) === */
|
|
/* Title is the section name - regular gray text */
|
|
[class*="suggestion"]:has([class*="hitTree"]) [class*="hitTitle"] {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-weight: 500 !important;
|
|
font-size: 0.8125rem !important;
|
|
background: none !important;
|
|
-webkit-background-clip: unset !important;
|
|
background-clip: unset !important;
|
|
color: #3f3f46 !important;
|
|
-webkit-text-fill-color: #3f3f46 !important;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="suggestion"]:has([class*="hitTree"]) [class*="hitTitle"] {
|
|
color: #d4d4d8 !important;
|
|
-webkit-text-fill-color: #d4d4d8 !important;
|
|
}
|
|
|
|
/* Path is the page name - GRADIENT */
|
|
[class*="suggestion"]:has([class*="hitTree"]) [class*="hitPath"] {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-weight: 600 !important;
|
|
font-size: 0.75rem !important;
|
|
background: linear-gradient(90deg, #0074d9, #009296) !important;
|
|
-webkit-background-clip: text !important;
|
|
background-clip: text !important;
|
|
-webkit-text-fill-color: transparent !important;
|
|
text-transform: none !important;
|
|
letter-spacing: 0 !important;
|
|
margin-top: 0.125rem !important;
|
|
display: block !important;
|
|
}
|
|
|
|
/* === FALLBACK for browsers without :has() === */
|
|
[class*="hitPath"] {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.625rem !important;
|
|
font-weight: 400 !important;
|
|
color: #71717a !important;
|
|
-webkit-text-fill-color: #71717a !important;
|
|
text-transform: none !important;
|
|
letter-spacing: 0 !important;
|
|
}
|
|
|
|
[class*="hitTitle"] {
|
|
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-weight: 600 !important;
|
|
font-size: 0.9375rem !important;
|
|
background: linear-gradient(90deg, #0074d9, #009296) !important;
|
|
-webkit-background-clip: text !important;
|
|
background-clip: text !important;
|
|
-webkit-text-fill-color: transparent !important;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
/* Highlight matched text - must override color rules */
|
|
[class*="searchResultItem"] mark,
|
|
[class*="suggestion"] mark,
|
|
.search-result-match mark,
|
|
[class*="searchResultItem"]:hover mark,
|
|
[class*="suggestion"]:hover mark,
|
|
[class*="searchResultItem"][class*="cursor"] mark,
|
|
[class*="suggestion"][class*="cursor"] mark {
|
|
background: transparent !important;
|
|
color: #0074d9 !important;
|
|
padding: 0 !important;
|
|
border-radius: 0 !important;
|
|
font-weight: 600 !important;
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
[data-theme='dark'] [class*="searchResultItem"] mark,
|
|
[data-theme='dark'] [class*="suggestion"] mark,
|
|
[data-theme='dark'] .search-result-match mark,
|
|
[data-theme='dark'] [class*="searchResultItem"]:hover mark,
|
|
[data-theme='dark'] [class*="suggestion"]:hover mark,
|
|
[data-theme='dark'] [class*="searchResultItem"][class*="cursor"] mark,
|
|
[data-theme='dark'] [class*="suggestion"][class*="cursor"] mark {
|
|
color: #66b3f0 !important;
|
|
}
|
|
|
|
/* No results */
|
|
[class*="noResults"],
|
|
[class*="searchNoResult"] {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.75rem !important;
|
|
color: var(--ifm-color-emphasis-500) !important;
|
|
padding: 1rem !important;
|
|
text-align: center !important;
|
|
}
|
|
|
|
/* Loading */
|
|
[class*="searchIndexLoading"],
|
|
[class*="loadingRing"] {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 0.75rem !important;
|
|
color: var(--ifm-color-emphasis-400) !important;
|
|
}
|
|
|
|
/* Hide footer */
|
|
[class*="hitFooter"],
|
|
[class*="searchFooter"] {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Hide action icons */
|
|
[class*="hitAction"] {
|
|
display: none !important;
|
|
}
|
|
|