diff --git a/_extensions/posit-docs/_extension.yml b/_extensions/posit-docs/_extension.yml index 54b0fa0..3b7ae4a 100644 --- a/_extensions/posit-docs/_extension.yml +++ b/_extensions/posit-docs/_extension.yml @@ -26,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-docs/assets/images/exclamation-circle-dm.svg b/_extensions/posit-docs/assets/images/exclamation-circle-dm.svg new file mode 100644 index 0000000..fbdfd20 --- /dev/null +++ b/_extensions/posit-docs/assets/images/exclamation-circle-dm.svg @@ -0,0 +1,4 @@ + \ No newline at end of file diff --git a/_extensions/posit-docs/assets/images/exclamation-circle.svg b/_extensions/posit-docs/assets/images/exclamation-circle.svg new file mode 100644 index 0000000..6098c8b --- /dev/null +++ b/_extensions/posit-docs/assets/images/exclamation-circle.svg @@ -0,0 +1,4 @@ + \ No newline at end of file diff --git a/_extensions/posit-docs/assets/images/exclamation-triangle-dm.svg b/_extensions/posit-docs/assets/images/exclamation-triangle-dm.svg new file mode 100644 index 0000000..63db993 --- /dev/null +++ b/_extensions/posit-docs/assets/images/exclamation-triangle-dm.svg @@ -0,0 +1,4 @@ + \ No newline at end of file diff --git a/_extensions/posit-docs/assets/images/exclamation-triangle.svg b/_extensions/posit-docs/assets/images/exclamation-triangle.svg new file mode 100644 index 0000000..65d947c --- /dev/null +++ b/_extensions/posit-docs/assets/images/exclamation-triangle.svg @@ -0,0 +1,4 @@ + \ No newline at end of file diff --git a/_extensions/posit-docs/assets/images/info-circle-dm.svg b/_extensions/posit-docs/assets/images/info-circle-dm.svg new file mode 100644 index 0000000..6a5c164 --- /dev/null +++ b/_extensions/posit-docs/assets/images/info-circle-dm.svg @@ -0,0 +1,4 @@ + \ No newline at end of file diff --git a/_extensions/posit-docs/assets/images/info-circle.svg b/_extensions/posit-docs/assets/images/info-circle.svg new file mode 100644 index 0000000..cb78dbf --- /dev/null +++ b/_extensions/posit-docs/assets/images/info-circle.svg @@ -0,0 +1,4 @@ + \ No newline at end of file diff --git a/_extensions/posit-docs/assets/images/posit-logo-black-TM.svg b/_extensions/posit-docs/assets/images/posit-logo-black-TM.svg index 3b15998..9121db2 100644 --- a/_extensions/posit-docs/assets/images/posit-logo-black-TM.svg +++ b/_extensions/posit-docs/assets/images/posit-logo-black-TM.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/_extensions/posit-docs/theme-dark.scss b/_extensions/posit-docs/theme-dark.scss new file mode 100644 index 0000000..5d5d772 --- /dev/null +++ b/_extensions/posit-docs/theme-dark.scss @@ -0,0 +1,369 @@ +/*-- 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"); + +/*-- scss:variables --*/ + +// scss-docs-start color-variables +$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; +$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 { + background-image: url("_extensions/posit-docs/assets/images/info-circle-dm.svg") !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 { + background-image: url("_extensions/posit-docs/assets/images/exclamation-triangle-dm.svg") !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 { + background-image: url("_extensions/posit-docs/assets/images/exclamation-circle-dm.svg") !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-docs/theme.scss b/_extensions/posit-docs/theme.scss index ce09ba0..16d2630 100644 --- a/_extensions/posit-docs/theme.scss +++ b/_extensions/posit-docs/theme.scss @@ -1,26 +1,46 @@ /*-- 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-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-gray: #404041; -$posit-teal: #419599; -$posit-green: #72994E; -$posit-burgundy:#9A4665; -$posit-burgundy-1:#78384F; -$posit-burgundy-2:#542938; - -$primary: $posit-blue; +$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; +$primary: $posit-teal; // 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 +49,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 +71,6 @@ h2 { } // scss-docs-end font-sizes - // Headings // scss-docs-start headings-variables $headings-font-weight: 300 !important; @@ -69,69 +90,189 @@ $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; + font-size: 14px; + display: block; + padding-left: 1em; } -/* Posit logo - navbar or footer */ -#footer-right-posit-logo { +.nav-link { + 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 0.01em; + align-items: center !important; +} + +.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: 20px; - min-width: 20px; + width: 24px; + min-width: 24px; margin-left: -3px !important; margin-right: -3px !important; + padding-top: 1px; } -.nav-link { - font-family: $font-family-monospace; - text-transform: uppercase; - letter-spacing: .03em; - font-size: 14px !important; - font-weight: 500 !important; - color: $posit-gray !important; +/* Posit icon fullcolor */ +#footer-right-posit-logo { + width: 18px; + min-width: 18px; + margin-left: -3px !important; + margin-right: -3px !important; + padding-top: 1px; } -.navbar-nav .nav-link.active, -.navbar-nav .nav-link.show { - color: #000000 !important; - font-weight: 700 !important; +/* Posit logo - footer +#footer-logo { + width: 70px; + min-width: 70px; } +*/ -.nav-footer { - font-family: $font-family-monospace; - text-transform: uppercase; - font-size: 14px; - border-top: solid #0000001a .01em; - align-items: center !important; +.bi-question-circle-fill { + font-size: 18px !important; } -/* Tabs */ +.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; - color: $posit-gray !important; + 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; } -/* Sidebar and toc */ +.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 /* Left nav */ .sidebar-item-container .active { @@ -140,45 +281,82 @@ $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 { + background-image: url("_extensions/posit-docs/assets/images/info-circle.svg") !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 { + background-image: url("_extensions/posit-docs/assets/images/exclamation-triangle.svg") !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 { + background-image: url("_extensions/posit-docs/assets/images/exclamation-circle.svg") !important; +} + +div.callout-important.callout-style-default > .callout-header { + background-color: #f2dae3 !important; +} // Specialty headers @@ -213,34 +391,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/_publish.yml b/_publish.yml new file mode 100644 index 0000000..bf77ff9 --- /dev/null +++ b/_publish.yml @@ -0,0 +1,7 @@ +- source: project + connect: + - id: 900701dc-368b-4922-99c7-c7f0debadd8c + url: 'https://colorado.posit.co/rsc/content/900701dc-368b-4922-99c7-c7f0debadd8c/' + quarto-pub: + - id: be0488aa-a4ea-4579-8c63-40ac3b1ab453 + url: 'https://ashley.quarto.pub/theme-testing' diff --git a/_quarto.yml b/_quarto.yml index a0818b7..b5ac283 100644 --- a/_quarto.yml +++ b/_quarto.yml @@ -6,6 +6,7 @@ project: website: title: 'Posit Product Documentation Version {{< env PRODUCT_VERSION >}}' + page-navigation: true navbar: left: - text: "Home" @@ -52,5 +53,5 @@ website: href: "https://solutions.posit.co/" - text: "" href: "https://docs.posit.co/" - - text: "" + - text: "" href: "https://posit.co/" diff --git a/admin.qmd b/admin.qmd index 61010d1..02e52f8 100644 --- a/admin.qmd +++ b/admin.qmd @@ -16,3 +16,19 @@ You may learn more. ### Problems You may not learn more. + +- Something +- Something + - Something + - Something +- Something + - Something + - Something + +1. Lists +2. lists +3. lists + a. lists + b. Lists + - Lists + diff --git a/changelog.md b/changelog.md index d93289d..bf13d92 100644 --- a/changelog.md +++ b/changelog.md @@ -1,3 +1,14 @@ +# unreleased + +* Add Posit dark mode theme +* Resolves Callout colors issue (#57) +* Fixed several style issues in default theme +* Fixed several accessibility issues + +Known issue: + +* Dark mode reloads cause flashing (Quarto has an open issue with plans to address in v1.5 or v1.6) + # v.3.1.0 * Add alt-text to footer logos/icons diff --git a/index.qmd b/index.qmd index 1a3e646..17c1edd 100644 --- a/index.qmd +++ b/index.qmd @@ -2,17 +2,21 @@ title: "Posit Documentation Theme Example" --- -## Level Two +## Level two Some text for level two. -### Level Three +[Test link](https://docs.posit.co) -Some text for level three. +### Level three -### Another Level Three {.preview-header} +Some text for level three and showing `inline-code` references. -Some text for another level three +### Another level three {.preview-header} + +Here is a footnote reference,[^1] and another. + +[^1]: Here is the footnote. #### Level four @@ -27,14 +31,87 @@ Five is jive. Six is deep enough! Stop! -## Level Two Again +## Level two: coding + + +```r +cat("cats are cats\n") +``` + +```python +print("snakes are not cats") +``` + +```{.txt filename="Output or filenames"} +Checking Job Launcher configuration... +Ensuring server-user is a Job Launcher admin... +Getting list of Job Launcher clusters... +Job launcher configured with the following clusters: Kubernetes, Local +launcher-adhoc-clusters is empty - all clusters may be used to launch adhoc jobs +launcher-sessions-clusters is empty - all clusters may be used to launch session jobs +Waiting for job to finish... +Job has finished running +Job exited successfully +``` + +### Tabsets and pills + +::: {.panel-tabset} +### RHEL + +```bash +$ yum install rstudio-workbench-rhel +``` + +### Ubuntu | Debian + +```bash +$ dpkg +``` + +::: {.panel-tabset} +### Ubuntu 22.04 +```bash +$ You can nest tabsets +``` + +### Ubuntu 20.04 +```bash +$ Nesting +``` +::: + + +### SUSE + +```bash +$ zypper +``` + +::: + + +::: {.panel-tabset .nav-pills} + +### Pills +You can use tabs and pills for text, code blocks, tables, etc. -::: panel-tabset +### Code + +A single code block + +```bash +$ yum install rstudio-workbench-rhel +``` + +Nested pills + +::: {.panel-tabset .nav-pills } ### RHEL ```bash -$ yum +$ yum install rstudio-workbench-rhel ``` ### Ubuntu | Debian @@ -51,6 +128,20 @@ $ zypper ::: +### Table + +| | | +|-------|---------------------------| +| Table | some text about the table | +|Row | More stuff | + + +### Image + +![This is a test image](/_extensions/posit-docs/assets/images/posit-logo-fullcolor-TM.svg "testing for alt text stuff"){width=240} + +::: + ## Level two: callouts Code-first means using code first. Does that mean we never do things manually? @@ -60,21 +151,15 @@ No. Hands-on is delightful. This is a note. ::: + ::: {.callout-warning} -This is a warning. +Only use the warning callout to explain dangers that may result in personal injury or death. ::: ::: {.callout-important} -This is important. +This is important; don't ignore this information. ::: -::: {.callout-tip} -This is a tip. -::: - -::: {.callout-caution} -This is a cautionary tale. -::: ::: {.callout-note collapse="true"} This is a collapsed note. @@ -86,16 +171,6 @@ This is a collapsed note. This is a note with an alternate title. ::: -## Level two: coding - -```r -cat("cats are cats\n") -``` - -```python -print("snakes are not cats") -``` - ## Level two: lists ### Unordered list diff --git a/user.qmd b/user.qmd index 0fd8552..43b1e91 100644 --- a/user.qmd +++ b/user.qmd @@ -5,3 +5,37 @@ subtitle: Version {{< env PRODUCT_VERSION >}} This is a stub page modeling a top-level collection of documentation, such as a product user guide. + +## Table + +This table uses the bootstrap `{.striped .hover}` classes: + +| Header | Usage | +|-----------------------------|-------------------------------------------| +| X-CSRF-Token | CSRF attack prevention when running or upgrading from `2022.09` and earlier releases | +| X-Postback-ExitCode | R processing | +| X-RS-CSRF-Token | CSRF attack prevention | +| X-RS-Distributed-Event-Checksum | Communication between nodes in a load balanced environment | +| X-RS-Distributed-Event-Timestamp | Communication between nodes in a load balanced environment | +| X-RS-Launcher-Secret | Inter-process communication with the Job Launcher | +| X-RS-Monitor-Shared-Secret | Inter-process authentication | +:This table is using the striped + hover Bootstrap classes {.striped .hover} + + +This table is not using any bootstrap classes: + +| Header | Usage | +|-----------------------------|-------------------------------------------| +| X-CSRF-Token | CSRF attack prevention when running or upgrading from `2022.09` and earlier releases | +| X-Postback-ExitCode | R processing | +| X-RS-CSRF-Token | CSRF attack prevention | +| X-RS-Distributed-Event-Checksum | Communication between nodes in a load balanced environment | +| X-RS-Distributed-Event-Timestamp | Communication between nodes in a load balanced environment | +| X-RS-Launcher-Secret | Inter-process communication with the Job Launcher | +| X-RS-Monitor-Shared-Secret | Inter-process authentication | + +## Images + +The image caption, title, and alt text can all be different. + +![This is a test image](/_extensions/posit-docs/assets/images/posit-logo-fullcolor-TM.svg "Title: Posit logo"){fig-alt="testing for alt text stuff" width=240 fig-align="left"} \ No newline at end of file