Skip to content

Commit

Permalink
fix styling and enable mermaid diagrams
Browse files Browse the repository at this point in the history
  • Loading branch information
brianinnes committed Oct 22, 2023
1 parent ea198f1 commit c665d90
Show file tree
Hide file tree
Showing 6 changed files with 130 additions and 110 deletions.
133 changes: 62 additions & 71 deletions docs/blog/posts/building-OKD-payload.md

Large diffs are not rendered by default.

Binary file removed docs/blog/posts/img/build_okd_payload_1.png
Binary file not shown.
Binary file removed docs/blog/posts/img/build_okd_payload_2.png
Binary file not shown.
Binary file removed docs/blog/posts/img/build_okd_payload_3.png
Binary file not shown.
84 changes: 46 additions & 38 deletions docs/css/extra.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,38 +2,44 @@

[data-md-color-scheme=okd-dark] {
--md-hue: 207;
--md-default-fg-color: hsla(var(--md-hue), 75%, 95%, 1);
--md-default-fg-color--light: hsla(var(--md-hue), 75%, 90%, 1);
--md-default-fg-color--lighter: hsla(var(--md-hue), 75%, 92%, 1);
--md-default-fg-color--lightest: hsla(var(--md-hue), 75%, 95%, 0.3);
--md-default-bg-color: hsla(var(--md-hue), 37%, 21%, 1);
--md-default-bg-color--light: hsla(var(--md-hue), 37%, 23%, 1);
--md-default-bg-color--lighter: hsla(var(--md-hue), 37%, 25%, 1);
--md-default-bg-color--lightest: hsla(var(--md-hue), 37%, 27%, 1);
--md-code-fg-color: hsla(var(--md-hue), 18%, 86%, 1);
--md-code-bg-color: hsla(var(--md-hue), 37%, 15%, 1);
--md-code-hl-color: hsla(var(--md-default-fg-color--lightest));
--md-default-fg-color: hsla(var(--md-hue), 15%, 90%, 0.82);
--md-default-fg-color--light: hsla(var(--md-hue), 15%, 90%, 0.56);
--md-default-fg-color--lighter: hsla(var(--md-hue), 15%, 90%, 0.32);
--md-default-fg-color--lightest: hsla(var(--md-hue), 15%, 90%, 0.12);
--md-default-bg-color: hsla(var(--md-hue), 15%, 14%, 1);
--md-default-bg-color--light: hsla(var(--md-hue), 15%, 14%, 0.54);
--md-default-bg-color--lighter: hsla(var(--md-hue), 15%, 14%, 0.26);
--md-default-bg-color--lightest: hsla(var(--md-hue), 15%, 14%, 0.07);
--md-code-fg-color: hsla(var(--md-hue), 18%, 86%, 0.82);
--md-code-bg-color: hsla(var(--md-hue), 15%, 18%, 1);
--md-code-hl-color--light: #4287ff26;
--md-code-hl-number-color: #e6695b;
--md-code-hl-special-color: #f06090;
--md-code-hl-function-color: #c973d9;
--md-code-hl-constant-color: #9383e2;
--md-code-hl-keyword-color: #6791e0;
--md-code-hl-string-color: #2fb170;
--md-code-hl-keyword-color: #c6d5f1;
--md-code-hl-string-color: #7bcda4;
--md-code-hl-name-color: var(--md-code-fg-color);
--md-code-hl-operator-color: var(--md-default-fg-color--light);
--md-code-hl-punctuation-color: var(--md-default-fg-color--light);
--md-code-hl-comment-color: #cbd26f;
--md-code-hl-generic-color: var(--md-default-fg-color--light);
--md-code-hl-variable-color: var(--md-default-fg-color--light);
--md-typeset-color: var(--md-default-fg-color);
--md-typeset-a-color: var(--md-primary-fg-color--light);
--md-typeset-mark-color: var(--md-default-fg-color--lightest);
--md-typeset-kbd-color: hsla(var(--md-hue), 15%, 94%, 1);
--md-typeset-kbd-accent-color: hsla(var(--md-hue), 15%, 94%, 1);
--md-typeset-a-color: var(--md-primary-fg-color);
--md-typeset-kbd-color: hsla(var(--md-hue), 15%, 90%, 0.12);
--md-typeset-kbd-accent-color: hsla(var(--md-hue), 15%, 90%, 0.2);
--md-typeset-kbd-border-color: hsla(var(--md-hue), 15%, 14%, 1);
--md-admonition-bg-color: var(--md-default-bg-color--lighter);
--md-footer-bg-color: hsla(var(--md-hue), 15%, 12%, 1);
--md-footer-bg-color--dark: hsla(var(--md-hue), 15%, 10%, 1);
--md-typeset-mark-color: #4287ff4d;
--md-typeset-table-color: hsla(var(--md-hue), 15%, 95%, 0.12);
--md-typeset-table-color--light: hsla(var(--md-hue), 15%, 95%, 0.035);
--md-admonition-fg-color: var(--md-default-fg-color);
--md-admonition-bg-color: var(--md-default-bg-color);
--md-footer-bg-color: hsla(var(--md-hue), 15%, 10%, 0.87);
--md-footer-bg-color--dark: hsla(var(--md-hue), 15%, 8%, 1);
--md-shadow-z1: 0 0.2rem 0.5rem #0000000d, 0 0 0.05rem #0000001a;
--md-shadow-z2: 0 0.2rem 0.5rem #00000040, 0 0 0.05rem #00000040;
--md-shadow-z3: 0 0.2rem 0.5rem #0006, 0 0 0.05rem #00000059;
}

[data-md-color-primary=blue-grey] {
Expand All @@ -48,24 +54,24 @@

[data-md-color-scheme=okd] {
--md-hue: 207;
--md-default-fg-color: rgba(0, 0, 0, 0.87);
--md-default-fg-color--light: rgba(0, 0, 0, 0.54);
--md-default-fg-color--lighter: rgba(0, 0, 0, 0.32);
--md-default-fg-color--lightest: rgba(0, 0, 0, 0.07);
--md-default-bg-color: hsla(0, 0%, 85%, 1);
--md-default-bg-color--light: hsla(0, 0%, 60%, 1);
--md-default-bg-color--lighter: hsla(0, 0%, 70%, 1);
--md-default-bg-color--lightest: hsla(0, 0%, 91%, 1);
--md-default-fg-color: hsla(var(--md-hue), 44%, 7%, 0.87);
--md-default-fg-color--light: hsla(var(--md-hue), 44%, 7%, 0.54);
--md-default-fg-color--lighter: hsla(var(--md-hue), 44%, 7%, 0.32);
--md-default-fg-color--lightest: hsla(var(--md-hue), 44%, 7%, 0.07);
--md-default-bg-color: hsla(var(--md-hue), 44%, 96%, 0.87);
--md-default-bg-color--light: hsla(var(--md-hue), 44%, 96%, 0.54);
--md-default-bg-color--lighter: hsla(var(--md-hue), 44%, 96%, 0.32);
--md-default-bg-color--lightest: hsla(var(--md-hue), 4%, 96%, 0.07);
--md-default-bg-color--white: hsla(0, 0%, 100%, 1);
--md-code-fg-color: hsla(var(--md-hue), 18%, 86%, 1);
--md-code-bg-color: hsla(var(--md-hue), 37%, 15%, 1);
--md-code-fg-color: hsla(var(--md-hue), 44%, 8%, 1);
--md-code-bg-color: hsla(var(--md-hue), 44%, 96%, 1);
--md-code-hl-color: hsla(var(--md-default-fg-color--lightest));
--md-code-hl-number-color: #e6695b;
--md-code-hl-special-color: #f06090;
--md-code-hl-function-color: #c973d9;
--md-code-hl-constant-color: #9383e2;
--md-code-hl-keyword-color: #6791e0;
--md-code-hl-string-color: #2fb170;
--md-code-hl-number-color: #c83727;
--md-code-hl-special-color: #e63c75;
--md-code-hl-function-color: #7e2e8c;
--md-code-hl-constant-color: #46378c;
--md-code-hl-keyword-color: #08317e;
--md-code-hl-string-color: #027e42;
--md-code-hl-name-color: var(--md-code-fg-color);
--md-code-hl-operator-color: var(--md-default-fg-color--light);
--md-code-hl-punctuation-color: var(--md-default-fg-color--light);
Expand All @@ -79,13 +85,14 @@
--md-typeset-kbd-color: hsla(var(--md-hue), 15%, 94%, 1);
--md-typeset-kbd-accent-color: hsla(var(--md-hue), 15%, 94%, 1);
--md-typeset-kbd-border-color: hsla(var(--md-hue), 15%, 14%, 1);
--md-admonition-bg-color: var(--md-default-bg-color--lightest);
--md-admonition-fg-color: var(--md-default-fg-color);
--md-admonition-bg-color: var(--md-default-bg-color);
--md-footer-bg-color: hsla(var(--md-hue), 15%, 12%, 1);
--md-footer-bg-color--dark: hsla(var(--md-hue), 15%, 10%, 1);
}

[data-md-color-primary='okd-blue'] {
--md-primary-fg-color: hsla(var(--md-hue), 37%, 21%, 1);
--md-primary-fg-color: hsla(var(--md-hue), 37%, 60%, 1);
--md-primary-fg-color--light: hsla(var(--md-hue), 37%, 70%, 1);
--md-primary-fg-color--dark: hsla(var(--md-hue), 37%, 16%, 1);
--md-primary-bg-color: hsla(var(--md-hue), 37%, 95%, 1);
Expand Down Expand Up @@ -1341,6 +1348,7 @@ footer {

.footer_top:before {
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
content: '';
right: 50%;
margin-right: -30px;
Expand Down
23 changes: 22 additions & 1 deletion mkdocs.yml
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,23 @@ theme:
logo: img/okd_logo_resized.svg
favicon: img/okdLogo.png
palette:

# Palette toggle for light mode
# - media: "(prefers-color-scheme: light)"
# scheme: default
# toggle:
# icon: material/brightness-7
# name: Switch to dark mode

# Palette toggle for dark mode
# - media: "(prefers-color-scheme: dark)"
# scheme: slate
# toggle:
# icon: material/brightness-4
# name: Switch to light mode
#
#-----------------------------
#
- media: "(prefers-color-scheme: light)"
scheme: okd
toggle:
Expand Down Expand Up @@ -83,6 +100,9 @@ plugins:
- trimmer
markdown_extensions:
- attr_list
- pymdownx.emoji:
emoji_index: !!python/name:material.extensions.emoji.twemoji
emoji_generator: !!python/name:material.extensions.emoji.to_svg
- admonition
- toc:
permalink: true
Expand All @@ -93,7 +113,8 @@ markdown_extensions:
class: mermaid
format: !!python/name:pymdownx.superfences.fence_code_format
- pymdownx.highlight
- pymdownx.tabbed
- pymdownx.tabbed:
alternate_style: true
- pymdownx.details
extra_css:
- css/extra.css
Expand Down

0 comments on commit c665d90

Please sign in to comment.