From 2ec1d03eccda9caf30f1b0ecd07ad5d864b72796 Mon Sep 17 00:00:00 2001 From: Ashley Henry Date: Fri, 10 May 2024 20:54:07 -0400 Subject: [PATCH] New version of posit theme installed --- _environment | 1 - .../posit-dev/posit-docs/_extension.yml | 9 +- .../posit-dev/posit-docs/_posit-colors.scss | 37 ++ .../assets/images/exclamation-circle-dm.svg | 4 + .../assets/images/exclamation-circle.svg | 4 + .../assets/images/exclamation-triangle-dm.svg | 4 + .../assets/images/exclamation-triangle.svg | 4 + .../assets/images/info-circle-dm.svg | 4 + .../posit-docs/assets/images/info-circle.svg | 4 + .../assets/images/posit-logo-black-TM.svg | 2 +- .../posit-dev/posit-docs/theme-dark.scss | 342 ++++++++++++++++++ _extensions/posit-dev/posit-docs/theme.scss | 327 +++++++++++++---- _quarto.yml | 16 +- 13 files changed, 666 insertions(+), 92 deletions(-) create mode 100644 _extensions/posit-dev/posit-docs/_posit-colors.scss create mode 100644 _extensions/posit-dev/posit-docs/assets/images/exclamation-circle-dm.svg create mode 100644 _extensions/posit-dev/posit-docs/assets/images/exclamation-circle.svg create mode 100644 _extensions/posit-dev/posit-docs/assets/images/exclamation-triangle-dm.svg create mode 100644 _extensions/posit-dev/posit-docs/assets/images/exclamation-triangle.svg create mode 100644 _extensions/posit-dev/posit-docs/assets/images/info-circle-dm.svg create mode 100644 _extensions/posit-dev/posit-docs/assets/images/info-circle.svg create mode 100644 _extensions/posit-dev/posit-docs/theme-dark.scss diff --git a/_environment b/_environment index 3f26336d..0521a9f7 100644 --- a/_environment +++ b/_environment @@ -1,2 +1 @@ CURRENT_YEAR=2024 -PRODUCT_VERSION=2024.x diff --git a/_extensions/posit-dev/posit-docs/_extension.yml b/_extensions/posit-dev/posit-docs/_extension.yml index 5e7f0b4d..9f03f0f2 100644 --- a/_extensions/posit-dev/posit-docs/_extension.yml +++ b/_extensions/posit-dev/posit-docs/_extension.yml @@ -1,6 +1,6 @@ title: posit-docs author: Ashley Henry, David Aja, Aron Atkins -version: 3.0.0 +version: 4.0.1 quarto-required: ">=1.3.340" contributes: project: @@ -12,9 +12,10 @@ contributes: navbar: pinned: true logo: "assets/images/posit-icon-fullcolor.svg" - logo-alt: "Posit Documentation" + logo-alt: "Posit Documentation" right: - icon: "list" + aria-label: 'Drop-down menu for additional Posit resources' menu: - text: "docs.posit.co" href: "https://docs.posit.co" @@ -25,7 +26,9 @@ contributes: show-item-context: true format: html: - theme: [theme.scss] + theme: + light: [theme.scss] + dark: [theme-dark.scss] link-external-icon: true link-external-newwindow: true toc: true diff --git a/_extensions/posit-dev/posit-docs/_posit-colors.scss b/_extensions/posit-dev/posit-docs/_posit-colors.scss new file mode 100644 index 00000000..e4bf13a3 --- /dev/null +++ b/_extensions/posit-dev/posit-docs/_posit-colors.scss @@ -0,0 +1,37 @@ +/* Posit Color definitions */ +$posit-blue: #447099; +$posit-light-blue-1: #d1dbe5; +$posit-light-blue-2: #a2b8cb; +$posit-light-blue-3: #7494b1; +$posit-dark-blue-1: #305775; +$posit-dark-blue-2: #213d4f; + +$posit-orange: #ee6331; +$posit-light-orange-1: #edccbf; +$posit-light-orange-2: #eba38c; +$posit-dark-orange-1: #ab4d26; +$posit-dark-orange-2: #80361c; +$posit-dark-orange-3: #451f12; + +$posit-gray: #404041; +$posit-light-gray-1: #c2c2c4; +$posit-light-gray-2: #949494; +$posit-dark-gray-1: #333333; + +$posit-teal: #419599; +$posit-light-teal-1: #c2d9d9; +$posit-light-teal-2: #94bdbf; +$posit-light-teal-3: #70a3a6; +$posit-dark-teal-1: #297075; +$posit-dark-teal-2: #1f4f4f; +$posit-dark-teal-3: #122b2b; + +$posit-green: #72994e; + +$posit-burgundy: #9a4665; +$posit-light-burgundy-1: #d9c4cc; +$posit-light-burgundy-2: #bf96a3; +$posit-light-burgundy-3: #a67380; +$posit-dark-burgundy-1: #78384f; +$posit-dark-burgundy-2: #542938; +$posit-dark-burgundy-3: #2e171f; diff --git a/_extensions/posit-dev/posit-docs/assets/images/exclamation-circle-dm.svg b/_extensions/posit-dev/posit-docs/assets/images/exclamation-circle-dm.svg new file mode 100644 index 00000000..fbdfd203 --- /dev/null +++ b/_extensions/posit-dev/posit-docs/assets/images/exclamation-circle-dm.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/_extensions/posit-dev/posit-docs/assets/images/exclamation-circle.svg b/_extensions/posit-dev/posit-docs/assets/images/exclamation-circle.svg new file mode 100644 index 00000000..6098c8b2 --- /dev/null +++ b/_extensions/posit-dev/posit-docs/assets/images/exclamation-circle.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/_extensions/posit-dev/posit-docs/assets/images/exclamation-triangle-dm.svg b/_extensions/posit-dev/posit-docs/assets/images/exclamation-triangle-dm.svg new file mode 100644 index 00000000..63db9932 --- /dev/null +++ b/_extensions/posit-dev/posit-docs/assets/images/exclamation-triangle-dm.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/_extensions/posit-dev/posit-docs/assets/images/exclamation-triangle.svg b/_extensions/posit-dev/posit-docs/assets/images/exclamation-triangle.svg new file mode 100644 index 00000000..65d947c9 --- /dev/null +++ b/_extensions/posit-dev/posit-docs/assets/images/exclamation-triangle.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/_extensions/posit-dev/posit-docs/assets/images/info-circle-dm.svg b/_extensions/posit-dev/posit-docs/assets/images/info-circle-dm.svg new file mode 100644 index 00000000..6a5c164d --- /dev/null +++ b/_extensions/posit-dev/posit-docs/assets/images/info-circle-dm.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/_extensions/posit-dev/posit-docs/assets/images/info-circle.svg b/_extensions/posit-dev/posit-docs/assets/images/info-circle.svg new file mode 100644 index 00000000..f4f803ad --- /dev/null +++ b/_extensions/posit-dev/posit-docs/assets/images/info-circle.svg @@ -0,0 +1,4 @@ + + + + diff --git a/_extensions/posit-dev/posit-docs/assets/images/posit-logo-black-TM.svg b/_extensions/posit-dev/posit-docs/assets/images/posit-logo-black-TM.svg index 3b159987..90331515 100644 --- a/_extensions/posit-dev/posit-docs/assets/images/posit-logo-black-TM.svg +++ b/_extensions/posit-dev/posit-docs/assets/images/posit-logo-black-TM.svg @@ -1 +1 @@ - \ No newline at end of file + diff --git a/_extensions/posit-dev/posit-docs/theme-dark.scss b/_extensions/posit-dev/posit-docs/theme-dark.scss new file mode 100644 index 00000000..ec1e26d4 --- /dev/null +++ b/_extensions/posit-dev/posit-docs/theme-dark.scss @@ -0,0 +1,342 @@ +/*-- scss:defaults --*/ + +// import font +@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap"); + +// import shared colors +@import '_posit-colors'; + +/*-- scss:variables --*/ +$primary: $posit-teal; +$dark-md-body: $posit-light-gray-1; +$dark-md-background: #0c1721; + +// Feature preview heading colors +$preview-header: $posit-orange; /* posit orange, contrast: 8.45 */ +$preview-header-border: darken($preview-header, 5%); + +// scss-docs-end color-variables + +// Typography +// Font, line-height, and color for body text, headings, and more. + +//scss-font-start font-variables +$font-family-sans-serif: "Open Sans", "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, + sans-serif, system-ui; +$font-family-monospace: "Source Code Pro", monospace; +$font-family-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; +$font-size-base: 1rem; +// scss-docs-end font-variables + +//font and body color + +$body-color: $dark-md-body; +$popover-bg: $posit-green !default; + +// scss-docs-start font-sizes - seems that I have to keep these in the style sheet? +$h1-font-size: 44px; +$h2-font-size: 28px; +x h1 { + size: $h1-font-size; +} +h2 { + size: $h2-font-size; +} +// scss-docs-end font-sizes + +// Headings +// scss-docs-start headings-variables +$headings-color: #ffffff; +// scss-docs-end headings-variables + +// Customize the navbar +$navbar-bg: lighten($dark-md-background, 5%); +$navbar-fg: #ffffff; + +// CSS overrides + +// Body +// +// Settings for the `` element. + +//$body-color: $posit-green !default; +$body-bg: $dark-md-background !default; // dark mode change + +// Nav and footer + +/* Nav bar */ + +.navbar-title { + color: #ffffff; // dark theme change +} + +.nav-link { + font-family: $font-family-monospace; + text-transform: uppercase; + letter-spacing: 0.03em; + font-size: 14px !important; + font-weight: 500 !important; + color: #fff !important; +} + +.navbar-nav .nav-link.active, +.navbar-nav .nav-link.show { + color: $posit-teal !important; + font-weight: 700 !important; +} + +/* Nav bar right hamburger menu */ + +.dropdown-item:hover, +.dropdown-item:focus { + color: var(--bs-dropdown-link-hover-color); + background-color: #0f1c29 !important; +} + +/* Footer */ + +.nav-footer { + color: #ffffff !important; + border-top: solid $posit-gray 1px; +} + +/* Footer icons */ +.nav-footer a { + color: #ffffff !important; +} + +// Footnotes + +.footnote-back { + color: $posit-light-teal-2; +} + +// Breadcrumbs + +.quarto-title-breadcrumbs .breadcrumb li:last-of-type a { + color: $posit-light-gray-1 !important; +} + +// Page navigation + +.nav-page .nav-page-text { + color: $posit-light-gray-1; +} + +/* Inline code */ +p code:not(.sourceCode), +li code:not(.sourceCode), +td code:not(.sourceCode) { + background-color: #6e768166 !important; + color: #ffffff; +} + +// Code blocks + +/* Code block title*/ + +.quarto-dark .code-with-filename .code-with-filename-file { + background-color: #000000 !important; + border: none; +} + +.code-with-filename strong { + color: #6e9ac3; +} + +/* Code block background */ +$code-block-bg: lighten($dark-md-background, 10%); + +/* Copy button */ + +$btn-code-copy-color: $posit-light-blue-2; +$btn-code-copy-color-active: #ffffff; +$callout-icon-scale: 70%; + +// Tabs and pills + +/* Tabs */ + +.nav-tabs .nav-link.active { + color: $posit-teal !important; +} + +.nav-tabs .nav-link { + text-transform: none !important; + font-family: $font-family-sans-serif; + color: #ffffff !important; +} + +.nav-tabs .nav-link:hover, +.nav-link:focus { + color: $posit-teal !important; +} + +/* Pills */ + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + background-color: $posit-dark-teal-1 !important; +} + +.nav-pills .nav-link:hover, +.nav-link:focus { + isolation: isolate; + // color: $posit-teal !important; + border: none !important; +} + +.nav-pills .nav-link.active, +.nav-link:hover { + color: #ffffff !important; +} + +// Sidebar and toc + +/* Left nav - letter spacing */ +.sidebar-navigation li a { + color: #ffffff; +} + +.sidebar-navigation li a:hover { + color: inherit; +} + +.sidebar-item-container .active, +div.sidebar-item-container .show > .nav-link, +div.sidebar-item-container .sidebar-link > code { + color: $posit-teal !important; +} + +// Lists + +/* List disc colors */ +li::marker { + color: $posit-teal; +} + +// Callouts + +.callout.callout-style-default:not(.no-icon) div.callout-title-container { + color: #ffffff !important; +} + +div.callout.callout-style-default > div.callout-header { + opacity: none; +} + +/* Note */ + +div.callout-note.callout { + border-left-color: $posit-dark-blue-2 !important; + border-right: 1px solid $posit-dark-blue-2 !important; + border-top: 1px solid $posit-dark-blue-2 !important; + border-bottom: 1px solid $posit-dark-blue-2 !important; +} + +div.callout-note .callout-icon::before { + // base64 -i _extensions/posit-docs/assets/images/info-circle-dm.svg + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iIzAwMDAwMCIgY2xhc3M9ImJpIGJpLWluZm8tY2lyY2xlIiB2aWV3Qm94PSIwIDAgMTYgMTYiPgogIDxwYXRoIGQ9Ik04IDE1QTcgNyAwIDEgMSA4IDFhNyA3IDAgMCAxIDAgMTRtMCAxQTggOCAwIDEgMCA4IDBhOCA4IDAgMCAwIDAgMTYiLz4KICA8cGF0aCBkPSJtOC45MyA2LjU4OC0yLjI5LjI4Ny0uMDgyLjM4LjQ1LjA4M2MuMjk0LjA3LjM1Mi4xNzYuMjg4LjQ2OWwtLjczOCAzLjQ2OGMtLjE5NC44OTcuMTA1IDEuMzE5LjgwOCAxLjMxOS41NDUgMCAxLjE3OC0uMjUyIDEuNDY1LS41OThsLjA4OC0uNDE2Yy0uMi4xNzYtLjQ5Mi4yNDYtLjY4Ni4yNDYtLjI3NSAwLS4zNzUtLjE5My0uMzA0LS41MzN6TTkgNC41YTEgMSAwIDEgMS0yIDAgMSAxIDAgMCAxIDIgMCIvPgo8L3N2Zz4=") !important; +} + +div.callout-note.callout-style-default > .callout-header { + background-color: $posit-blue !important; +} + +/* Warning */ + +div.callout-warning.callout { + border-left-color: $posit-dark-orange-2 !important; + border-right: 1px solid $posit-dark-orange-2 !important; + border-top: 1px solid $posit-dark-orange-2 !important; + border-bottom: 1px solid $posit-dark-orange-2 !important; +} + +div.callout-warning .callout-icon::before { + // base64 -i _extensions/posit-docs/assets/images/exclamation-triangle-dm.svg + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iIzAwMDAwMCIgY2xhc3M9ImJpIGJpLWV4Y2xhbWF0aW9uLXRyaWFuZ2xlIiB2aWV3Qm94PSIwIDAgMTYgMTYiPgogIDxwYXRoIGQ9Ik03LjkzOCAyLjAxNkEuMTMuMTMgMCAwIDEgOC4wMDIgMmEuMTMuMTMgMCAwIDEgLjA2My4wMTYuMTUuMTUgMCAwIDEgLjA1NC4wNTdsNi44NTcgMTEuNjY3Yy4wMzYuMDYuMDM1LjEyNC4wMDIuMTgzYS4yLjIgMCAwIDEtLjA1NC4wNi4xLjEgMCAwIDEtLjA2Ni4wMTdIMS4xNDZhLjEuMSAwIDAgMS0uMDY2LS4wMTcuMi4yIDAgMCAxLS4wNTQtLjA2LjE4LjE4IDAgMCAxIC4wMDItLjE4M0w3Ljg4NCAyLjA3M2EuMTUuMTUgMCAwIDEgLjA1NC0uMDU3bTEuMDQ0LS40NWExLjEzIDEuMTMgMCAwIDAtMS45NiAwTC4xNjUgMTMuMjMzYy0uNDU3Ljc3OC4wOTEgMS43NjcuOTggMS43NjdoMTMuNzEzYy44ODkgMCAxLjQzOC0uOTkuOTgtMS43Njd6Ii8+CiAgPHBhdGggZD0iTTcuMDAyIDEyYTEgMSAwIDEgMSAyIDAgMSAxIDAgMCAxLTIgME03LjEgNS45OTVhLjkwNS45MDUgMCAxIDEgMS44IDBsLS4zNSAzLjUwN2EuNTUyLjU1MiAwIDAgMS0xLjEgMHoiLz4KPC9zdmc+") !important; +} + +div.callout-warning.callout-style-default > .callout-header { + background-color: $posit-dark-orange-1 !important; +} + +/* Important */ + +div.callout-important.callout { + border-left-color: $posit-dark-burgundy-2 !important; + border-right: 1px solid $posit-dark-burgundy-2 !important; + border-top: 1px solid $posit-dark-burgundy-2 !important; + border-bottom: 1px solid $posit-dark-burgundy-2 !important; +} + +div.callout-important .callout-icon::before { + // base64 -i _extensions/posit-docs/assets/images/exclamation-circle-dm.svg + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iIzAwMDAwMCIgY2xhc3M9ImJpIGJpLWV4Y2xhbWF0aW9uLWNpcmNsZSIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICA8cGF0aCBkPSJNOCAxNUE3IDcgMCAxIDEgOCAxYTcgNyAwIDAgMSAwIDE0bTAgMUE4IDggMCAxIDAgOCAwYTggOCAwIDAgMCAwIDE2Ii8+CiAgPHBhdGggZD0iTTcuMDAyIDExYTEgMSAwIDEgMSAyIDAgMSAxIDAgMCAxLTIgME03LjEgNC45OTVhLjkwNS45MDUgMCAxIDEgMS44IDBsLS4zNSAzLjUwN2EuNTUyLjU1MiAwIDAgMS0xLjEgMHoiLz4KPC9zdmc+") !important; +} + +div.callout-important.callout-style-default > .callout-header { + background-color: $posit-burgundy !important; +} + +// Tables + +.table > :not(caption) > * > * { + border-top: 2px solid #101e2b; +} + +/* Striped table styles */ + +.table-striped > tbody > tr:nth-of-type(odd) > * { + //--bs-table-bg-type: #001C2B !important; + --bs-table-bg-type: #101e2b !important; +} + +/* Striped table hover */ + +.table-hover > tbody > tr:hover > * { + //--bs-table-color-state: var(--bs-table-hover-color); + --bs-table-bg-state: #001c2b !important; +} + +// Table caption + +.panel-caption, +.figure-caption, +.subfigure-caption, +.table-caption, +figcaption, +caption { + font-size: 1rem; + color: $body-color !important; +} + +// Specialty headers + +/* the feature PREVIEW header */ +.preview-header > h1:after, +.preview-header > h2:after, +.preview-header > h3:after, +.preview-header > h4:after, +header h1 .preview-header, +div span.preview-feature { + background-color: $preview-header; + color: #ffffff; + border: 1px solid $preview-header-border; + font-weight: 600; + font-size: 9pt !important; + padding: 0rem 0.4rem; +} + +div span.preview-feature { + margin-left: 1em; + text-transform: uppercase; +} + +// Specialty lists +// Groovy list - dark mode change + +ol.groovyAlpha li > p:before { + content: counter(list-counter, lower-alpha); + font-weight: 600; +} diff --git a/_extensions/posit-dev/posit-docs/theme.scss b/_extensions/posit-dev/posit-docs/theme.scss index 418bd8b4..0a4e222a 100644 --- a/_extensions/posit-dev/posit-docs/theme.scss +++ b/_extensions/posit-dev/posit-docs/theme.scss @@ -1,26 +1,16 @@ /*-- scss:defaults --*/ // import font -@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap'); +@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap"); -/*-- scss:variables --*/ - -// scss-docs-start color-variables -$posit-blue: #447099; -$posit-dark-blue-1: #305775; -$posit-dark-blue-2: #213D4F; -$posit-orange: #EE6331; -$posit-gray: #404041; -$posit-teal: #419599; -$posit-green: #72994E; -$posit-burgundy:#9A4665; -$posit-burgundy-1:#78384F; -$posit-burgundy-2:#542938; +// import shared colors +@import '_posit-colors'; +/*-- scss:variables --*/ $primary: $posit-blue; // Feature preview heading colors -$preview-header: #EE6331; /* posit orange, contrast: 8.45 */ +$preview-header: #ee6331; /* posit orange, contrast: 8.45 */ $preview-header-border: darken($preview-header, 5%); // scss-docs-end color-variables @@ -29,17 +19,19 @@ $preview-header-border: darken($preview-header, 5%); // Font, line-height, and color for body text, headings, and more. //scss-font-start font-variables -$font-family-sans-serif: "Open Sans", "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, system-ui; +$font-family-sans-serif: "Open Sans", "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, + sans-serif, system-ui; $font-family-monospace: "Source Code Pro", monospace; $font-family-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; $font-size-base: 1rem; // scss-docs-end font-variables +//font and body color $body-color: $posit-gray; // scss-docs-start font-sizes -$h1-font-size:44px; -$h2-font-size:28px; +$h1-font-size: 44px; +$h2-font-size: 28px; h1 { size: $h1-font-size; @@ -49,7 +41,6 @@ h2 { } // scss-docs-end font-sizes - // Headings // scss-docs-start headings-variables $headings-font-weight: 300 !important; @@ -69,15 +60,39 @@ $list-group-color: $primary !default; // CSS overrides +// Body +// +// Settings for the `` element. + +/* Body font */ +body { + letter-spacing: -0.2px !important; +} + +// Nav and footer + +/* Navbar */ + .navbar { - box-shadow: 0 0 0.2rem #0000001a, 0 0.1rem 0.4rem #0003; - transition: transform .25s cubic-bezier(.1,.7,.1,1),box-shadow .25s; + box-shadow: + 0 0 0.2rem #0000001a, + 0 0.1rem 0.4rem #0003; + transition: + transform 0.25s cubic-bezier(0.1, 0.7, 0.1, 1), + box-shadow 0.25s; } .navbar-title { - font-family: $font-family-sans-serif; - font-size: $font-size-base; - font-weight: 500; + font-family: $font-family-sans-serif; + font-size: $font-size-base; + font-weight: 500; +} + +/* Style for the version included in the website title */ +.navbar-title small { + font-size: 14px; + display: block; + padding-left: 1em; } /* Style for the version included in the website title */ @@ -101,29 +116,153 @@ $list-group-color: $primary !default; } .nav-link { - font-family: $font-family-monospace; - text-transform: uppercase; - letter-spacing: .03em; - font-size: 14px !important; - font-weight: 500 !important; + font-family: $font-family-monospace; + text-transform: uppercase; + letter-spacing: 0.03em; + font-size: 14px !important; + font-weight: 500 !important; + color: $posit-gray !important; +} + +.navbar-nav .nav-link.active, +.navbar-nav .nav-link.show { + color: #000000 !important; + font-weight: 700 !important; } +/* Footer */ + .nav-footer { - font-family: $font-family-monospace; - text-transform: uppercase; - font-size: 14px; - border-top: solid #0000001a .01em; - align-items: center !important; + font-family: $font-family-monospace; + text-transform: uppercase; + font-size: 14px; + border-top: solid #0000001a 0.01em; + align-items: center !important; } -/* Tabs */ +.nav-footer .nav-footer-center { + min-height: min-content; +} + +/* Footer icons */ + +/* Full Posit logo - currently, unused */ +#footer-right-full-posit-logo { + width: 70px; + min-width: 70px; +} + +/* Posit guide book */ +#footer-right-logo { + width: 24px; + min-width: 24px; + margin-left: -3px !important; + margin-right: -3px !important; + padding-top: 1px; +} + +/* Posit icon fullcolor */ +#footer-right-posit-logo { + width: 18px; + min-width: 18px; + margin-left: -3px !important; + margin-right: -3px !important; + padding-top: 1px; +} + +/* Posit logo - footer +#footer-logo { + width: 70px; + min-width: 70px; +} +*/ + +.bi-question-circle-fill { + font-size: 18px !important; +} + +.bi-lightbulb-fill { + font-size: 18px !important; +} + +// Footnotes + +.footnote-back { + font-size: 16px !important; + font-weight: 900px !important; + color: $posit-dark-blue-1; +} + +// Tabs and pills + +/* Tabs */ .nav-tabs .nav-link { - text-transform: none !important; - font-family: $font-family-sans-serif; + text-transform: none !important; + font-family: $font-family-sans-serif; + color: $posit-gray !important; +} + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #000000 !important; +} + +.nav-tabs .nav-link:hover, +.nav-link:focus { + color: $posit-blue !important; +} + +/* Pills */ + +.nav-pills { + border: none !important; +} + +.nav-pills, +.panel-underline { + > .nav { + display: flex; + border: none !important; + flex-direction: row; + justify-content: center; + .nav-link { + cursor: pointer; + } + } +} + +.nav-pills > .nav .nav-link { + border: none !important; +} + +.nav-pills, +.panel-underline { + .tab-content { + padding-left: 0; + padding-right: 0; + border: none; + } +} + +.nav-pills .nav-link.active, +.nav-pills .nav-item.show .nav-link { + color: #ffffff !important; +} + +.nav-pills .nav-link:hover, +.nav-link:focus { + isolation: isolate; + color: $posit-blue !important; + border: none !important; +} + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #ffffff !important; } -/* Sidebar and toc */ +// Sidebar and toc /* Left nav */ .sidebar-item-container .active { @@ -132,45 +271,85 @@ $list-group-color: $primary !default; /* Left nav - letter spacing */ .sidebar-navigation li a { - letter-spacing: .03em; + letter-spacing: 0.03em; font-size: 16px; } +/* Left nav - letter spacing */ +.sidebar-navigation li a { + letter-spacing: -0.2px; + line-height: normal; +} + /* Mini TOC */ -.sidebar nav[role=doc-toc]>ul li a { - text-transform: none !important; - font-family: $font-family-sans-serif; - font-weight: 400 !important; - letter-spacing: -0.2px !important; +.sidebar nav[role="doc-toc"] > ul li a { + text-transform: none !important; + font-family: $font-family-sans-serif; + font-weight: 400 !important; + letter-spacing: -0.2px !important; } -.sidebar nav[role=doc-toc] ul>li>a.active, .sidebar nav[role=doc-toc] ul>li>ul>li>a.active { - font-weight: 700 !important; +.sidebar nav[role="doc-toc"] ul > li > a.active, +.sidebar nav[role="doc-toc"] ul > li > ul > li > a.active { + font-weight: 700 !important; } -/* Left nav - letter spacing */ -.sidebar-navigation li a { - letter-spacing: -0.2px; - line-height: normal; +// Lists + +/* List disc colors */ +li::marker { + color: $primary; } -/* Posit logo - footer */ -#footer-logo { - width: 70px; - min-width: 70px; +// Callouts + +.callout.callout-style-default:not(.no-icon) div.callout-title-container { + color: $posit-dark-gray-1 !important; } -/* Footer */ -.nav-footer .nav-footer-center { - min-height: min-content; +/* Note */ + +div.callout-note.callout { + border-left-color: $posit-blue !important; } -// Font +div.callout-note .callout-icon::before { + // base64 -i _extensions/posit-docs/assets/images/info-circle.svg + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iIzE3MjEyQiIgY2xhc3M9ImJpIGJpLWluZm8tY2lyY2xlIiB2aWV3Qm94PSIwIDAgMTYgMTYiPgogIDxwYXRoIGQ9Ik04IDE1QTcgNyAwIDEgMSA4IDFhNyA3IDAgMCAxIDAgMTRtMCAxQTggOCAwIDEgMCA4IDBhOCA4IDAgMCAwIDAgMTYiLz4KICA8cGF0aCBkPSJtOC45MyA2LjU4OC0yLjI5LjI4Ny0uMDgyLjM4LjQ1LjA4M2MuMjk0LjA3LjM1Mi4xNzYuMjg4LjQ2OWwtLjczOCAzLjQ2OGMtLjE5NC44OTcuMTA1IDEuMzE5LjgwOCAxLjMxOS41NDUgMCAxLjE3OC0uMjUyIDEuNDY1LS41OThsLjA4OC0uNDE2Yy0uMi4xNzYtLjQ5Mi4yNDYtLjY4Ni4yNDYtLjI3NSAwLS4zNzUtLjE5My0uMzA0LS41MzN6TTkgNC41YTEgMSAwIDEgMS0yIDAgMSAxIDAgMCAxIDIgMCIvPgo8L3N2Zz4=") !important; +} -/* Body font */ -body { - letter-spacing: -0.2px !important; - } +div.callout-note.callout-style-default > .callout-header { + background-color: #dce7f2 !important; +} + +/* Warning */ +div.callout-warning.callout { + border-left-color: $posit-orange !important; +} + +div.callout-warning .callout-icon::before { + // base64 -i _extensions/posit-docs/assets/images/exclamation-triangle.svg + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iIzQ1MUYxMiIgY2xhc3M9ImJpIGJpLWV4Y2xhbWF0aW9uLXRyaWFuZ2xlIiB2aWV3Qm94PSIwIDAgMTYgMTYiPgogIDxwYXRoIGQ9Ik03LjkzOCAyLjAxNkEuMTMuMTMgMCAwIDEgOC4wMDIgMmEuMTMuMTMgMCAwIDEgLjA2My4wMTYuMTUuMTUgMCAwIDEgLjA1NC4wNTdsNi44NTcgMTEuNjY3Yy4wMzYuMDYuMDM1LjEyNC4wMDIuMTgzYS4yLjIgMCAwIDEtLjA1NC4wNi4xLjEgMCAwIDEtLjA2Ni4wMTdIMS4xNDZhLjEuMSAwIDAgMS0uMDY2LS4wMTcuMi4yIDAgMCAxLS4wNTQtLjA2LjE4LjE4IDAgMCAxIC4wMDItLjE4M0w3Ljg4NCAyLjA3M2EuMTUuMTUgMCAwIDEgLjA1NC0uMDU3bTEuMDQ0LS40NWExLjEzIDEuMTMgMCAwIDAtMS45NiAwTC4xNjUgMTMuMjMzYy0uNDU3Ljc3OC4wOTEgMS43NjcuOTggMS43NjdoMTMuNzEzYy44ODkgMCAxLjQzOC0uOTkuOTgtMS43Njd6Ii8+CiAgPHBhdGggZD0iTTcuMDAyIDEyYTEgMSAwIDEgMSAyIDAgMSAxIDAgMCAxLTIgME03LjEgNS45OTVhLjkwNS45MDUgMCAxIDEgMS44IDBsLS4zNSAzLjUwN2EuNTUyLjU1MiAwIDAgMS0xLjEgMHoiLz4KPC9zdmc+") !important; +} + +div.callout-warning.callout-style-default > .callout-header { + background-color: #fad8ca !important; +} + +/* Important */ + +div.callout-important.callout { + border-left-color: $posit-burgundy !important; +} + +div.callout-important .callout-icon::before { + // base64 -i _extensions/posit-docs/assets/images/exclamation-circle.svg + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iIzJFMTcxRiIgY2xhc3M9ImJpIGJpLWV4Y2xhbWF0aW9uLWNpcmNsZSIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICA8cGF0aCBkPSJNOCAxNUE3IDcgMCAxIDEgOCAxYTcgNyAwIDAgMSAwIDE0bTAgMUE4IDggMCAxIDAgOCAwYTggOCAwIDAgMCAwIDE2Ii8+CiAgPHBhdGggZD0iTTcuMDAyIDExYTEgMSAwIDEgMSAyIDAgMSAxIDAgMCAxLTIgME03LjEgNC45OTVhLjkwNS45MDUgMCAxIDEgMS44IDBsLS4zNSAzLjUwN2EuNTUyLjU1MiAwIDAgMS0xLjEgMHoiLz4KPC9zdmc+") !important; +} + +div.callout-important.callout-style-default > .callout-header { + background-color: #f2dae3 !important; +} // Specialty headers @@ -205,34 +384,30 @@ div span.preview-feature { text-transform: uppercase; } -// Lists - -/* List disc colors */ -li::marker { - color: $primary; -} +// Specialty lists /* Callout steps for images with multiple items/steps shown in single image */ + ol.groovyAlpha { - list-style: none; - counter-reset: list-counter; - } - + list-style: none; + counter-reset: list-counter; +} + ol.groovyAlpha li { counter-increment: list-counter; } ol.groovyAlpha li > p:before { content: counter(list-counter, lower-alpha); - width: 16px; - height: 16px; + width: 20px; + height: 20px; text-align: center; margin-right: 10px; color: #fff; background-color: #fc403b; display: inline-block; - border-radius: 8px; - font-size: 9px; + border-radius: 10px; + font-size: 14px; line-height: 16px; vertical-align: middle; } diff --git a/_quarto.yml b/_quarto.yml index 8554e84c..3b34b996 100644 --- a/_quarto.yml +++ b/_quarto.yml @@ -32,24 +32,18 @@ website: left: | Copyright © 2000-{{< env CURRENT_YEAR >}} Posit Software, PBC. All Rights Reserved. center: | - Posit Helm Charts {{< env PRODUCT_VERSION >}} + Posit Helm Charts right: - icon: question-circle-fill + aria-label: 'Link to Posit Support' href: "https://support.posit.co/hc/en-us" - icon: lightbulb-fill + aria-label: 'Link to Posit Solutions' href: "https://solutions.posit.co/" - - text: "" + - text: "" href: "https://docs.posit.co/" - - text: "" + - text: "" href: "https://posit.co/" - navbar: - right: - - icon: "list" - menu: - - text: "docs.posit.co" - href: "https://docs.posit.co" - - text: "Posit Support" - href: "https://support.posit.co/hc/en-us/" sidebar: style: "floating" collapse-level: 1