diff --git a/site/src/css/custom.css b/site/src/css/custom.css index acbc4fda330..4ed717ffd12 100644 --- a/site/src/css/custom.css +++ b/site/src/css/custom.css @@ -6,13 +6,14 @@ /* You can override the default Infima variables here. */ :root { - --ifm-color-primary: #25c2a0; - --ifm-color-primary-dark: rgb(33, 175, 144); - --ifm-color-primary-darker: rgb(31, 165, 136); - --ifm-color-primary-darkest: rgb(26, 136, 112); - --ifm-color-primary-light: rgb(70, 203, 174); - --ifm-color-primary-lighter: rgb(102, 212, 189); - --ifm-color-primary-lightest: rgb(146, 224, 208); + --ifm-color-primary: #5072EB; + --ifm-color-primary-dark: #3A5CD4; + --ifm-color-primary-darker: #47506D; + --ifm-color-primary-darkest: #04192B; + --ifm-color-primary-light: #A4B6F4; + --ifm-color-primary-lighter: #EEF1FD; + --ifm-color-primary-lightest: #F6F8FE; + --ifm-navbar-logo-height: 1.5rem; --ifm-code-font-size: 95%; } @@ -27,6 +28,33 @@ html[data-theme='dark'] .docusaurus-highlight-code-line { background-color: rgba(0, 0, 0, 0.3); } +html[data-theme='dark'] { + --custom-dark-bg: #0e2443; + --custom-dark-bg-hover: #1a3460; +} + +html[data-theme='dark'] .button-link { + background-color: var(--custom-dark-bg); + color: white; +} + +html[data-theme='dark'] .button-link:hover { + background-color: var(--custom-dark-bg-hover); +} + +html[data-theme='dark'] .navbar__link--active { + color: var(--ifm-color-primary-light); + background-color: var(--custom-dark-bg); +} + +html[data-theme='dark'] .navbar__link--active:hover { + background-color: var(--ifm-color-primary-darkest); +} + +html[data-theme='dark'] .docs-section-link:hover { + background-color: var(--custom-dark-bg); +} + .navbar__search { padding-left: var(--ifm-navbar-padding-horizontal) !important; } @@ -39,27 +67,26 @@ body.running-in-iframe .theme-doc-breadcrumbs { .button-link { display: inline-block; padding: 10px 20px; - /* Adjusts the padding around the text */ background-color: rgb(233, 238, 237); - /* Blue background */ - color: white; - /* White text */ text-align: center; border-radius: 30px; - /* Rounded corners */ text-decoration: none; - /* Removes underline */ transition: background-color 0.3s; - /* Smooth transition for background color */ margin-left: 2px; margin-right: 4px; } .button-link:hover { background-color: rgb(211, 214, 213); - /* Darker blue background on hover */ cursor: pointer; - /* Changes cursor to pointer to indicate it's clickable */ +} + +/* Override Infima link styles inside button-link pills */ +.button-link a, +.button-link a:hover { + background: none !important; + text-decoration: none !important; + padding: 0 !important; } .docs-section-link { @@ -68,7 +95,7 @@ body.running-in-iframe .theme-doc-breadcrumbs { } .docs-section-link:hover { - text-decoration: underline; + text-decoration: none; background-color: rgb(233, 238, 237); } diff --git a/site/static/img/estuary-new.png b/site/static/img/estuary-new.png index 60a65182b0f..8fab42b6c87 100644 Binary files a/site/static/img/estuary-new.png and b/site/static/img/estuary-new.png differ