From 2c740e050971b644e9c5d45fd3fb4695965d4590 Mon Sep 17 00:00:00 2001 From: Wienke Giezeman Date: Thu, 1 Oct 2026 19:32:29 +0200 Subject: [PATCH 1/5] Docs: new theme in the TTN 2026 design (held until the www cutover) New Hugo theme built from the Claude Design "LoRaWAN Docs" design: global TTN header/footer from the platform's single nav source (data/site_nav.json, root-relative + params.ttnOrigin), sidebar navigation, chapter cards, on-this-page rail, search, callouts, prev/next. Header geometry is identical to the www header (platform site.css). Replaces the Bulma/SCSS theme and drops the Node/Yarn asset step from CI. DO NOT MERGE before the thethingsnetwork.org cutover: merging to master publishes to GitHub Pages, which the live site serves at /docs today. Co-Authored-By: Claude Opus 5.5 --- .github/workflows/pull_request.yml | 16 - .github/workflows/release.yml | 16 - .gitignore | 3 + Makefile | 7 +- README.md | 24 +- doc/assets/css/common/fonts.scss | 25 -- doc/assets/css/common/global.scss | 190 -------- doc/assets/css/common/tabs.scss | 24 - doc/assets/css/common/variables.scss | 57 --- doc/assets/css/docs.css | 417 ++++++++++++++++++ doc/assets/css/footer/footer.scss | 24 - doc/assets/css/glossary/glossary.scss | 5 - doc/assets/css/header/nav.scss | 39 -- doc/assets/css/header/search.scss | 20 - doc/assets/css/highlight.scss | 297 ------------- doc/assets/css/sidebar/sidebar.scss | 45 -- doc/assets/css/theme.scss | 38 -- doc/assets/css/vendor/basicLightbox.min.scss | 1 - doc/assets/css/vendor/bulma-divider.sass | 73 --- doc/assets/css/vendor/bulma-tooltip.min.css | 2 - doc/assets/js/docs.js | 226 ++++++++++ doc/assets/js/theme.js | 22 - doc/assets/js/vendor/basicLightbox.min.js | 1 - doc/config/_default/config.toml | 10 +- doc/content/lorawan/_index.md | 63 ++- doc/data/icons.json | 31 ++ doc/data/site_nav.json | 164 +++++++ doc/layouts/404.html | 20 +- .../_default/_markup/render-heading.html | 1 + doc/layouts/_default/baseof.html | 39 +- doc/layouts/_default/list.html | 25 +- doc/layouts/_default/single.html | 26 +- doc/layouts/index.html | 159 +++---- doc/layouts/index.json | 8 + doc/layouts/partials/docs/breadcrumb.html | 17 + doc/layouts/partials/docs/callout.html | 8 + doc/layouts/partials/docs/chapters.html | 12 + doc/layouts/partials/docs/page.html | 18 + doc/layouts/partials/docs/prev-next.html | 36 ++ doc/layouts/partials/docs/rail.html | 26 ++ doc/layouts/partials/docs/sidebar.html | 62 +++ doc/layouts/partials/docs/subpages.html | 16 + doc/layouts/partials/docs/v2-warning.html | 10 + doc/layouts/partials/head/head.html | 47 +- doc/layouts/partials/header-hash.html | 2 - .../partials/header/breadcrumb-container.html | 43 -- doc/layouts/partials/pages-cards.html | 43 -- .../partials/prev-next-in-section.html | 19 - .../partials/sidebar/side-navigation.html | 55 --- doc/layouts/partials/site/cookie-notice.html | 7 + doc/layouts/partials/site/footer.html | 27 ++ doc/layouts/partials/site/header.html | 51 +++ doc/layouts/partials/site/href.html | 8 + doc/layouts/partials/site/icon.html | 7 + doc/layouts/shortcodes/actions.html | 2 + doc/layouts/shortcodes/button.html | 11 + doc/layouts/shortcodes/chapters.html | 14 + doc/layouts/shortcodes/feature.html | 16 + doc/layouts/shortcodes/info.html | 5 +- doc/layouts/shortcodes/lead.html | 2 + doc/layouts/shortcodes/note.html | 5 +- doc/layouts/shortcodes/topics.html | 35 ++ doc/layouts/shortcodes/warning.html | 5 +- doc/layouts/shortcodes/youtube.html | 8 + doc/package.json | 11 - doc/static/fonts/inter/Inter-Bold.woff2 | Bin 0 -> 106052 bytes doc/static/fonts/inter/Inter-Medium.woff2 | Bin 0 -> 105500 bytes doc/static/fonts/inter/Inter-Regular.woff2 | Bin 0 -> 98804 bytes doc/static/fonts/inter/Inter-SemiBold.woff2 | Bin 0 -> 105992 bytes doc/static/img/ttn-horizontal-white.svg | 1 + doc/static/img/ttn-horizontal.svg | 1 + doc/yarn.lock | 12 - 72 files changed, 1403 insertions(+), 1357 deletions(-) delete mode 100644 doc/assets/css/common/fonts.scss delete mode 100644 doc/assets/css/common/global.scss delete mode 100644 doc/assets/css/common/tabs.scss delete mode 100644 doc/assets/css/common/variables.scss create mode 100644 doc/assets/css/docs.css delete mode 100644 doc/assets/css/footer/footer.scss delete mode 100644 doc/assets/css/glossary/glossary.scss delete mode 100644 doc/assets/css/header/nav.scss delete mode 100644 doc/assets/css/header/search.scss delete mode 100644 doc/assets/css/highlight.scss delete mode 100644 doc/assets/css/sidebar/sidebar.scss delete mode 100644 doc/assets/css/theme.scss delete mode 100644 doc/assets/css/vendor/basicLightbox.min.scss delete mode 100644 doc/assets/css/vendor/bulma-divider.sass delete mode 100644 doc/assets/css/vendor/bulma-tooltip.min.css create mode 100644 doc/assets/js/docs.js delete mode 100644 doc/assets/js/theme.js delete mode 100644 doc/assets/js/vendor/basicLightbox.min.js create mode 100644 doc/data/icons.json create mode 100644 doc/data/site_nav.json create mode 100644 doc/layouts/_default/_markup/render-heading.html create mode 100644 doc/layouts/index.json create mode 100644 doc/layouts/partials/docs/breadcrumb.html create mode 100644 doc/layouts/partials/docs/callout.html create mode 100644 doc/layouts/partials/docs/chapters.html create mode 100644 doc/layouts/partials/docs/page.html create mode 100644 doc/layouts/partials/docs/prev-next.html create mode 100644 doc/layouts/partials/docs/rail.html create mode 100644 doc/layouts/partials/docs/sidebar.html create mode 100644 doc/layouts/partials/docs/subpages.html create mode 100644 doc/layouts/partials/docs/v2-warning.html delete mode 100644 doc/layouts/partials/header-hash.html delete mode 100644 doc/layouts/partials/header/breadcrumb-container.html delete mode 100644 doc/layouts/partials/pages-cards.html delete mode 100644 doc/layouts/partials/prev-next-in-section.html delete mode 100644 doc/layouts/partials/sidebar/side-navigation.html create mode 100644 doc/layouts/partials/site/cookie-notice.html create mode 100644 doc/layouts/partials/site/footer.html create mode 100644 doc/layouts/partials/site/header.html create mode 100644 doc/layouts/partials/site/href.html create mode 100644 doc/layouts/partials/site/icon.html create mode 100644 doc/layouts/shortcodes/actions.html create mode 100644 doc/layouts/shortcodes/button.html create mode 100644 doc/layouts/shortcodes/chapters.html create mode 100644 doc/layouts/shortcodes/feature.html create mode 100644 doc/layouts/shortcodes/lead.html create mode 100644 doc/layouts/shortcodes/topics.html create mode 100644 doc/layouts/shortcodes/youtube.html delete mode 100644 doc/package.json create mode 100644 doc/static/fonts/inter/Inter-Bold.woff2 create mode 100644 doc/static/fonts/inter/Inter-Medium.woff2 create mode 100644 doc/static/fonts/inter/Inter-Regular.woff2 create mode 100644 doc/static/fonts/inter/Inter-SemiBold.woff2 create mode 100644 doc/static/img/ttn-horizontal-white.svg create mode 100644 doc/static/img/ttn-horizontal.svg delete mode 100644 doc/yarn.lock diff --git a/.github/workflows/pull_request.yml b/.github/workflows/pull_request.yml index b69c9e964a..aa66f8f89b 100644 --- a/.github/workflows/pull_request.yml +++ b/.github/workflows/pull_request.yml @@ -25,22 +25,6 @@ jobs: ${{ runner.os }}-go- - name: Download Go dependencies run: make go.deps - - name: Set up Node - uses: actions/setup-node@v3 - with: - node-version: '~16' - - name: Get Yarn cache directory path - id: yarn-cache-dir-path - run: echo "dir=$(npx yarn cache dir)" >> $GITHUB_OUTPUT - - name: Initialize Yarn module cache - uses: actions/cache@v3 - with: - path: ${{ steps.yarn-cache-dir-path.outputs.dir }} - key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} - restore-keys: | - ${{ runner.os }}-yarn- - - name: Download Yarn dependencies - run: make js.deps - name: Initialize Hugo binary cache id: cache-hugo uses: actions/cache@v3 diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 28a5b46839..ec93ac4d63 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -30,22 +30,6 @@ jobs: ${{ runner.os }}-go- - name: Download Go dependencies run: make go.deps - - name: Set up Node - uses: actions/setup-node@v3 - with: - node-version: '~16' - - name: Get Yarn cache directory path - id: yarn-cache-dir-path - run: echo "dir=$(npx yarn cache dir)" >> $GITHUB_OUTPUT - - name: Initialize Yarn module cache - uses: actions/cache@v3 - with: - path: ${{ steps.yarn-cache-dir-path.outputs.dir }} - key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} - restore-keys: | - ${{ runner.os }}-yarn- - - name: Download Yarn dependencies - run: make js.deps - name: Initialize Hugo binary cache id: cache-hugo uses: actions/cache@v3 diff --git a/.gitignore b/.gitignore index 66cba4aff9..70220c187b 100644 --- a/.gitignore +++ b/.gitignore @@ -107,3 +107,6 @@ $RECYCLE.BIN/ ### Internal docs build /internal/ + +### Hugo build lock +.hugo_build.lock diff --git a/Makefile b/Makefile index e13d46323b..86f51653a4 100644 --- a/Makefile +++ b/Makefile @@ -36,7 +36,6 @@ clean.public: .PHONY: clean.deps clean.deps: rm -rf $(FREQUENCY_PLAN_DEST) - rm -rf $(YARN_DEPS) .PHONY: build.internal build.internal: @@ -57,16 +56,12 @@ new: @: .PHONY: deps -deps: hooks | go.deps js.deps +deps: hooks | go.deps .PHONY: go.deps go.deps: go mod download -.PHONY: js.deps -js.deps: - yarn --cwd $(DOC_ROOT) - hugo.exe: go.mod go.sum GOOS=windows go build -o $@ $(HUGO_BUILD_FLAGS) $(HUGO_MODULE) diff --git a/README.md b/README.md index 4e006e9e63..6c7dbfb75f 100644 --- a/README.md +++ b/README.md @@ -7,13 +7,29 @@ Data for generated documentation like the glossary is stored in `doc/data`. ## Development Environment Dependencies -The Things Network Documentation development tooling uses [Go](https://golang.org/doc/install) and [Yarn](https://yarnpkg.com/en/docs/install). +The Things Network Documentation development tooling uses [Go](https://golang.org/doc/install) +(Hugo is pinned in `go.mod` and built with `make deps`). The theme has no JavaScript build step. - Follow [Go's installation guide](https://golang.org/doc/install) to install Go. -- Follow [Yarn's installation guide](https://yarnpkg.com/en/docs/install) to install Yarn. -In order to build the documentation site with the right theme, you need to run -`make deps` from time to time. This will install [Yarn](https://yarnpkg.com/) on Mac and Unix systems if it is not already installed. +## Theme + +The theme lives in `doc/layouts` + `doc/assets` (plain CSS and JS, no Bulma/TTUI). The global +header and footer render from `doc/data/site_nav.json`, and icons from `doc/data/icons.json`. Both +are **generated** from www.thethingsnetwork.org's single navigation source — do not edit them by +hand; re-export them from the platform repo instead: + +``` +node scripts/export-docs-chrome.mjs /doc/data +``` + +Nav hrefs are root-relative and prefixed with `params.ttnOrigin` (default +`https://www.thethingsnetwork.org`); for a local all-in-one preview run Hugo with +`HUGO_PARAMS_TTNORIGIN=http://localhost:3000`. + +Section landing pages can use the `lead`, `actions`/`button`, `chapters`, `feature` and `topics` +shortcodes (see `doc/content/lorawan/_index.md`); a section's numbered course is its `chapters` +front matter and its topic index the `topics` front matter. ## Getting Started diff --git a/doc/assets/css/common/fonts.scss b/doc/assets/css/common/fonts.scss deleted file mode 100644 index 8c320ce61c..0000000000 --- a/doc/assets/css/common/fonts.scss +++ /dev/null @@ -1,25 +0,0 @@ -@import url('https://fonts.googleapis.com/css?family=Lato:400,700&display=swap'); - -@font-face { - font-family: 'LatoFallback'; - src: url(../fonts/Lato-Regular.woff2) format('woff2'), url(../fonts/Lato-Regular.woff) format('woff'), url(../fonts/Lato-Regular.ttf) format('ttf'); - font-weight: normal; - font-style: normal; -} - -@font-face { - font-family: 'LatoFallback'; - src: url(../fonts/Lato-Bold.woff2) format('woff2'), url(../fonts/Lato-Bold.woff) format('woff'), url(../fonts/Lato-Bold.ttf) format('ttf'); - font-weight: bold; - font-style: normal; -} - -@font-face { - font-family: "AvantGardePro"; - src: url(../fonts/AvantGardePro-Bold.otf); - font-weight: bold; - font-style: normal; -} - -$family-sans-serif: "Lato", "LatoFallback", $family-sans-serif; -$title-family: "AvantGardePro", $family-sans-serif; diff --git a/doc/assets/css/common/global.scss b/doc/assets/css/common/global.scss deleted file mode 100644 index cae5187656..0000000000 --- a/doc/assets/css/common/global.scss +++ /dev/null @@ -1,190 +0,0 @@ -.container { - @media (max-width: $desktop) { - padding-left: $content-padding-side; - padding-right: $content-padding-side; - } -} - -.is-not-wrapped { - white-space: nowrap; -} - -.is-borderless { - border: 0 !important -} - -.table.has-text-in-td-centered td { - text-align: center; -} - -.schema { - margin: 100px 0px; -} - -.content-intro, .title-intro { - display: flex; - margin: auto; - max-width: 650px; - text-align: center; -} - -.has-vertical-space { - margin-top: 3rem; - margin-bottom: 3rem; -} - -.content { - h1, h2, h3, h4, h5, h6 { - font-family: $title-family; - color: $title-color; - } - figure { - cursor: pointer; - transition: transform ease-out 150ms 150ms; - - &:hover { - transform: scale(1.01); - } - - &.float { - @media (max-width: 620px) { - max-width: none; - } - float: right; - @media (min-width: 621px) { - max-width: 40%; - } - } - - & > img { - max-height: 500px; - object-fit: contain; - } - - &:not(.plain) > img { - box-shadow: $card-shadow; - } - } - - table { - display: block; - overflow: auto; - } - -} - -details + p { - margin-top: 1em; -} - -details + blockquote { - margin-top: 1em; -} - -.glossary { - .term, .term-abbr, .term-alt{ - background-color: #ececec; - padding: 0.25rem; - font-weight: bold; - } - dd { - margin: 0.5em 0 0.5em 0; - } -} - -.frequency-plan { - .id { - background-color: $white-ter; - padding: 0.25rem; - font-weight: bold; - } - dd { - margin: 0.5em 0 0.5em 0; - } -} - -.feedback { - text-align: center; - background-color: $white-ter; - border-radius: 8px; - padding: 12px; -} - -table.fixed { table-layout:fixed; } -table.fixed td { overflow: auto; } - -// Fix for anchor link headbutting https://css-tricks.com/hash-tag-links-padding/ -[id]::before { - display: block; - content: " "; - margin-top: $anchor-offset * -1; - height: $anchor-offset; - visibility: hidden; - pointer-events: none; - z-index: -1; -} - -.has-ttn-navbar-top { - padding-top: 65px; -} - -.is-fullwidth { - width: 100%; -} - -.learn-header { - display: table; - width: 100%; - .text, .span { - vertical-align: middle; - display: table-cell; - } - span { - font-size: 120px; - font-weight: bold; - text-transform: uppercase; - } -} - -.lorawan-image { - width: 300px; - height: 130px; - display: flex; - flex-direction: column; - justify-content: center; -} - -.certifications-image { - height: 130px; - - img { - height: 120px; - width: auto; - } -} - -.quick-start-image { - width: 300px; - height: 130px; - display: flex; - flex-direction: column; - justify-content: center; -} - -.section-lorawan { - @media (min-width: $tablet) { - margin-top: -6rem; - } -} - -.header-hash { - font-size: 100%; - visibility: hidden; - color: silver; -} - -h2, h3, h4, h5, h6 { - &:hover a.header-hash { - visibility: visible - } -} diff --git a/doc/assets/css/common/tabs.scss b/doc/assets/css/common/tabs.scss deleted file mode 100644 index 99c9783151..0000000000 --- a/doc/assets/css/common/tabs.scss +++ /dev/null @@ -1,24 +0,0 @@ -.tabs.is-boxed li.is-active a { - background-color: $blue-alt !important; - border-color: transparent !important; - border-bottom-color: $blue !important; -} - -.tabs.is-boxed a { - color: lighten($blue, 24%); - background-color: lighten($blue-alt, 4%); - border-bottom-color: $blue !important; - margin-right: 4px; -} - -.tabs.is-boxed a:hover { - background-color: $blue-bg; -} - -.tab-content section { - display: none; -} - -.tab-content section.is-active { - display: block; -} diff --git a/doc/assets/css/common/variables.scss b/doc/assets/css/common/variables.scss deleted file mode 100644 index 1c257e45d1..0000000000 --- a/doc/assets/css/common/variables.scss +++ /dev/null @@ -1,57 +0,0 @@ -// Colors - -$blue: rgb(13, 131, 208); -$blue-secondary: #0039CE; -$blue-alt: #D9E4FF; -$white: #FFFFFF; -$graphite: #292929; -$white-bis: #FBFBFB; -$white-ter : #ECECEC; -$red: #F9595A; -$blue-bg: #E5ECFF; -$gray: #AEAEAE; -$red: #FF5C5C; - -$border: #e9ecef; -$code: $blue; -$link-hover: darken($blue, 20%); -$link: $blue; -$primary: $blue; -$title-color: $blue; -$info: $gray; -$warning: $red; - -$navbar-background-color: $white-bis; -$navbar-item-color: $blue; -$navbar-item-hover-background-color: $blue-bg; -$navbar-item-active-color: $blue; -$navbar-item-active-background-color: $white-bis; -$navbar-height: 6rem; - -$card-content-padding: 2rem; - -$border: $white-ter; -$table-head-cell-border-width: 1px 1px 1px; -$table-foot-cell-border-width: 1px 1px 1px; -$table-cell-border: 1px solid $white-ter; -$table-cell-border-width: 1px 1px 1px; -$table-cell-padding: 1.2em 0.75em; - -$tabs-border-bottom-color: $blue; - -$content-blockquote-background-color: inherit; - -$column-gap: 1.25rem; - -$content-padding-top: 2rem; -$content-padding-side: 2rem; -$content-max-width: 820px; - -$menu-item-active-color: $grey-dark; -$menu-item-active-background-color: $blue-bg; - -$banner-height: 4rem; - -$divider-font-size: $size-1; - -$anchor-offset: $navbar-height + 1rem; diff --git a/doc/assets/css/docs.css b/doc/assets/css/docs.css new file mode 100644 index 0000000000..33523b3744 --- /dev/null +++ b/doc/assets/css/docs.css @@ -0,0 +1,417 @@ +/* The Things Network docs theme (2026 redesign). + Tokens: The Things Industries design system (colors_and_type.css), TTN brand. + Chrome (header/footer) mirrors the www platform's site.css so /docs looks like the rest of the site. */ + +/* ---------- Fonts ---------- */ +@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/inter/Inter-Regular.woff2") format("woff2"); } +@font-face { font-family: "Inter"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/inter/Inter-Medium.woff2") format("woff2"); } +@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/inter/Inter-SemiBold.woff2") format("woff2"); } +@font-face { font-family: "Inter"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/inter/Inter-Bold.woff2") format("woff2"); } +@font-face { font-family: "Poppins"; font-weight: 700; font-style: normal; font-display: swap; src: url("https://fonts.gstatic.com/s/poppins/v22/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2") format("woff2"); } + +/* ---------- Tokens ---------- */ +:root { + --grey-025: #fbfcfd; --grey-050: #f3f5f8; --grey-075: #ebeef3; --grey-100: #dee3ea; --grey-200: #d2d7e0; + --grey-300: #c3c9d4; --grey-400: #b2bac8; --grey-500: #98a4b6; --grey-600: #7887a1; --grey-700: #536482; + --grey-800: #354661; --grey-900: #1c293f; --grey-1000: #0c1525; + + --info-050: #effaff; --info-100: #ccefff; --info-600: #005edb; + --warning-050: #fff9e6; --warning-100: #ffeebc; --warning-600: #db7600; --warning-700: #b75b00; + + --ttn: #26a0ff; --ttn-600: #008df9; --ttn-700: #0071c7; + --navy: #001859; --navy-900: #00103f; --ink: #000e36; + --tint: #e6f4ff; --muted-invert: #aebbd3; --navy-text: #c7d4ea; + + --font-display: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; + --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; + --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; + + --br-s: 4px; --br-m: 9px; --br-l: 0.9rem; --br-xl: 1.25rem; --br-pill: 3rem; + --bs-s: 0 0.2rem 1rem 0 rgb(0 0 0 / 5%); + --header-h: 72px; /* = the global header on www (platform site.css .tn-header__bar) */ +} + +/* ---------- Base ---------- */ +*, *::before, *::after { box-sizing: border-box; } +html { font-size: 15px; scroll-padding-top: calc(var(--header-h) + 24px); -webkit-text-size-adjust: 100%; } +body { + margin: 0; + font-family: var(--font-body); + font-size: 1rem; + line-height: 1.6; + color: var(--grey-900); + background: #fff; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +a { color: var(--ttn-600); text-decoration: none; } +a:hover { color: var(--navy); } +img { max-width: 100%; height: auto; } +:focus-visible { outline: 3px solid #cce8ff; outline-offset: 2px; border-radius: 4px; } + +.dx-icon { width: 1em; height: 1em; flex: none; vertical-align: -0.125em; } +.dx-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } +.dx-skip { position: absolute; left: 16px; top: -48px; z-index: 50; padding: 8px 14px; border-radius: var(--br-m); background: var(--navy); color: #fff; } +.dx-skip:focus { top: 12px; color: #fff; } +.dx-wrap { max-width: 1200px; margin-inline: auto; padding-inline: 24px; } + +/* ---------- Buttons ---------- */ +.dx-btn { + display: inline-flex; align-items: center; gap: 8px; + padding: 12px 22px; border: 1px solid transparent; border-radius: var(--br-pill); + font: inherit; font-size: 15px; font-weight: 600; line-height: 1.2; white-space: nowrap; + cursor: pointer; transition: background-color 0.1s, border-color 0.1s, color 0.1s; +} +.dx-btn p { margin: 0; } +.dx-btn--sm { padding: 9px 18px; font-size: 14px; } +.dx-btn, .dx-btn--brand { background: var(--ttn); color: #fff; } +.dx-btn:hover, .dx-btn--brand:hover { background: var(--ttn-600); color: #fff; } +.dx-btn--primary { background: var(--navy); color: #fff; } +.dx-btn--primary:hover { background: var(--navy-900); color: #fff; } +.dx-btn--outline { background: transparent; border-color: var(--grey-300); color: var(--navy); } +.dx-btn--outline:hover { background: transparent; border-color: var(--grey-500); color: var(--navy); } +.dx-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0; } + +/* ---------- Header ---------- */ +.dx-header { + position: sticky; top: 0; z-index: 20; + background: rgb(255 255 255 / 88%); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); + border-bottom: 1px solid var(--grey-100); +} +.dx-header__bar { max-width: 1200px; height: var(--header-h); margin-inline: auto; padding-inline: 24px; display: flex; align-items: center; gap: 32px; } +.dx-header__logo { flex: none; } +.dx-header__logo img { display: block; height: 34px; width: auto; } +.dx-header__panel { flex: 1; min-width: 0; display: flex; align-items: center; gap: 16px; } +.dx-header__nav { display: flex; align-items: center; gap: 2px; } +.dx-header__link { + display: inline-flex; align-items: center; gap: 4px; + padding: 6px 10px; border-radius: var(--br-m); + color: var(--grey-800); font-size: 14px; font-weight: 500; line-height: 24px; white-space: nowrap; + cursor: pointer; list-style: none; +} +.dx-header__link::-webkit-details-marker { display: none; } +.dx-header__link:hover { background: var(--grey-050); color: var(--grey-900); } +.dx-header__link[aria-current="page"] { color: var(--navy); font-weight: 600; } /* no pill: same as the global header */ +.dx-header__tools { flex: 1; display: flex; justify-content: flex-end; align-items: center; gap: 8px; } +.dx-header__auth { display: flex; align-items: center; gap: 4px; } +.dx-header__login { padding: 8px 14px; color: var(--grey-800); font-size: 14px; font-weight: 500; white-space: nowrap; } +.dx-header__login:hover { color: var(--navy); } +.dx-header__user { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; border-radius: var(--br-pill); color: var(--grey-900); font-size: 14px; font-weight: 600; } +.dx-header__user:hover { background: var(--grey-050); color: var(--grey-900); } +.dx-header__user img { width: 28px; height: 28px; border-radius: 50%; background: var(--grey-050); } +.dx-header__toggle { display: none; margin-left: auto; padding: 8px; border: 0; border-radius: var(--br-m); background: transparent; color: var(--grey-900); font-size: 22px; line-height: 0; cursor: pointer; } +.dx-header__toggle-close { display: none; } + +.dx-drop { position: relative; } +.dx-drop__chev { font-size: 14px; transition: transform 0.15s; } +.dx-drop[open] .dx-drop__chev { transform: rotate(180deg); } +.dx-drop__menu { + position: absolute; top: calc(100% + 6px); left: 0; z-index: 30; min-width: 200px; + display: flex; flex-direction: column; padding: 6px; + background: #fff; border: 1px solid var(--grey-100); border-radius: var(--br-l); box-shadow: 0 12px 32px rgb(0 24 89 / 12%); +} +.dx-drop__item { padding: 8px 12px; border-radius: var(--br-m); color: var(--grey-800); font-size: 14px; white-space: nowrap; } +.dx-drop__item:hover { background: var(--grey-050); color: var(--grey-900); } + +/* Search */ +.dx-search { position: relative; width: min(100%, 240px); } +.dx-search__field { + display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; + border: 1px solid var(--grey-200); border-radius: var(--br-m); background: var(--grey-025); color: var(--grey-600); + font-size: 17px; +} +.dx-search__field:focus-within { border-color: var(--ttn); background: #fff; box-shadow: 0 0 0 3px #cce8ff; } +.dx-search__field input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 14px; color: var(--grey-900); } +.dx-search__field input::-webkit-search-cancel-button { display: none; } +.dx-search__field kbd { font-family: var(--font-mono); font-size: 11px; line-height: 1.4; padding: 1px 6px; border: 1px solid var(--grey-200); border-radius: var(--br-s); background: #fff; color: var(--grey-600); } +.dx-search__field:focus-within kbd { display: none; } +.dx-search__results { + position: absolute; top: calc(100% + 6px); right: 0; z-index: 30; width: min(440px, calc(100vw - 32px)); max-height: min(70vh, 480px); overflow-y: auto; + padding: 6px; background: #fff; border: 1px solid var(--grey-100); border-radius: var(--br-l); box-shadow: 0 12px 32px rgb(0 24 89 / 14%); +} +.dx-search__item { display: block; padding: 10px 12px; border-radius: var(--br-m); color: var(--grey-900); } +.dx-search__item:hover, .dx-search__item[aria-selected="true"] { background: var(--tint); color: var(--grey-900); } +.dx-search__title { display: block; font-size: 14px; font-weight: 600; color: var(--navy); } +.dx-search__meta { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.45; color: var(--grey-600); } +.dx-search__empty { padding: 12px; font-size: 14px; color: var(--grey-600); } +.dx-search__item mark { background: transparent; color: var(--ttn-700); font-weight: 700; } + +/* ---------- Docs layout ---------- */ +.dx-docs { max-width: 1440px; margin-inline: auto; display: flex; align-items: flex-start; } + +.dx-side { + flex: 0 0 280px; position: sticky; top: var(--header-h); max-height: calc(100vh - var(--header-h)); overflow-y: auto; + padding: 28px 20px 40px 24px; border-right: 1px solid var(--grey-100); overscroll-behavior: contain; +} +.dx-side__summary { display: none; } +.dx-side__nav { display: flex; flex-direction: column; gap: 28px; } +.dx-side__group { display: flex; flex-direction: column; gap: 2px; } +.dx-side__label { padding: 0 10px 8px; font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--grey-600); } +.dx-side__link { display: flex; align-items: baseline; gap: 10px; padding: 6px 10px; border-radius: var(--br-m); color: var(--grey-800); font-size: 14px; line-height: 1.45; } +.dx-side__link:hover { background: var(--grey-050); color: var(--grey-900); } +.dx-side__link[aria-current="page"] { background: var(--tint); color: var(--navy); font-weight: 600; } +.dx-side__link--overview { align-items: center; padding-block: 8px; font-weight: 600; color: var(--grey-900); } +.dx-side__link--overview .dx-icon { font-size: 17px; color: var(--ttn-700); } +.dx-side__num { flex: none; width: 16px; font-family: var(--font-mono); font-size: 11px; color: var(--grey-500); } +.dx-side__link[aria-current="page"] .dx-side__num { color: var(--ttn-700); } +.dx-side__tree { display: flex; flex-direction: column; gap: 2px; margin: 2px 0 4px 18px; padding-left: 8px; border-left: 1px solid var(--grey-100); } +.dx-side__tree .dx-side__link { font-size: 13.5px; padding-block: 5px; } + +.dx-main { flex: 1 1 560px; min-width: 0; display: flex; justify-content: center; gap: 48px; padding: 40px 40px 96px; } +.dx-article { flex: 1 1 560px; min-width: 0; max-width: 780px; } +.dx-article__head { display: flex; flex-direction: column; gap: 20px; margin-bottom: 20px; } + +.dx-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: var(--grey-600); } +.dx-crumbs a { color: var(--grey-600); } +.dx-crumbs a:hover { color: var(--navy); } +.dx-crumbs .dx-icon { font-size: 13px; } +.dx-crumbs [aria-current] { color: var(--grey-900); font-weight: 500; } + +.dx-title { + margin: 0; font-family: var(--font-display); font-weight: 700; color: var(--navy); + font-size: clamp(2.2rem, 4vw, 3rem); line-height: 1.08; letter-spacing: -0.03em; text-wrap: balance; +} +.dx-docs .dx-article__head .dx-title { overflow-wrap: anywhere; } +/* A section landing (has chapters/topics) gets the full-size display title of the design. */ +.dx-article:has(.dx-lead) .dx-title { font-size: clamp(2.65rem, 5vw, 4rem); line-height: 1.05; } +.dx-eyebrow { font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ttn); } + +/* Right rail */ +.dx-rail { flex: 0 1 200px; min-width: 200px; position: sticky; top: calc(var(--header-h) + 40px); align-self: flex-start; display: flex; flex-direction: column; gap: 10px; font-size: 13px; max-height: calc(100vh - var(--header-h) - 64px); overflow-y: auto; } +.dx-rail__label { margin-bottom: 4px; font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--grey-600); } +.dx-toc { display: flex; flex-direction: column; gap: 10px; } +.dx-toc__link { padding-left: 12px; border-left: 2px solid var(--grey-100); color: var(--grey-700); line-height: 1.45; } +.dx-toc__link--sub { padding-left: 24px; } +.dx-toc__link:hover { color: var(--navy); } +.dx-toc__link[aria-current="true"] { border-left-color: var(--ttn); color: var(--navy); font-weight: 600; } +.dx-rail__rule { height: 1px; margin: 12px 0; background: var(--grey-100); } +.dx-rail__tool { display: flex; align-items: center; gap: 6px; color: var(--grey-700); } +.dx-rail__tool:hover { color: var(--navy); } + +/* ---------- Prose (rendered markdown) ---------- */ +.dx-prose { font-size: 16px; line-height: 1.7; color: var(--grey-800); overflow-wrap: break-word; } +.dx-prose::after { content: ""; display: table; clear: both; } +.dx-prose > :first-child { margin-top: 0; } +.dx-prose p, .dx-prose ul, .dx-prose ol, .dx-prose dl, .dx-prose table, .dx-prose pre, .dx-prose blockquote, .dx-prose figure, .dx-prose details { margin: 0 0 1.15em; } +.dx-prose h2, .dx-prose h3, .dx-prose h4, .dx-prose h5, .dx-prose h6 { color: var(--navy); font-family: var(--font-body); scroll-margin-top: calc(var(--header-h) + 24px); } +.dx-prose h2 { margin: 56px 0 16px; font-size: 26px; line-height: 1.2; letter-spacing: -0.02em; font-weight: 700; } +.dx-prose h3 { margin: 40px 0 12px; font-size: 20px; line-height: 1.3; letter-spacing: -0.01em; font-weight: 700; } +.dx-prose h4 { margin: 28px 0 8px; font-size: 17px; line-height: 1.4; font-weight: 600; } +.dx-prose h5, .dx-prose h6 { margin: 24px 0 8px; font-size: 15px; font-weight: 600; } +.dx-prose h2 + p, .dx-prose h3 + p { margin-top: 0; } +.dx-anchor { margin-left: 6px; color: var(--grey-300); font-weight: 400; opacity: 0; transition: opacity 0.1s; } +:is(h2, h3, h4, h5, h6):hover > .dx-anchor, .dx-anchor:focus-visible { opacity: 1; } +.dx-anchor:hover { color: var(--ttn-600); } +.dx-prose a { font-weight: 500; } +.dx-prose a:hover { text-decoration: underline; text-underline-offset: 3px; } +.dx-prose strong { color: var(--grey-900); font-weight: 600; } +.dx-prose ul, .dx-prose ol { padding-left: 1.5em; } +.dx-prose li { margin: 0.3em 0; } +.dx-prose li > ul, .dx-prose li > ol { margin: 0.3em 0; } +.dx-prose li::marker { color: var(--grey-500); } +.dx-prose hr { margin: 40px 0; border: 0; border-top: 1px solid var(--grey-100); } +.dx-prose blockquote { padding: 4px 0 4px 18px; border-left: 3px solid var(--ttn); color: var(--grey-700); } +.dx-prose dt { font-weight: 600; color: var(--grey-900); } +.dx-prose dd { margin: 0.25em 0 0.75em 1.25em; } +.dx-prose img { border-radius: var(--br-m); } +.dx-prose figure { margin-inline: 0; } +.dx-prose figure > img, .dx-prose figure > a > img { display: block; max-height: 500px; object-fit: contain; } +.dx-prose figure:not(.plain) > img { box-shadow: var(--bs-s); border: 1px solid var(--grey-100); } +.dx-prose figure.float { float: right; max-width: 40%; margin: 0 0 16px 24px; } +.dx-prose figcaption { margin-top: 8px; font-size: 13px; color: var(--grey-600); } +.dx-prose details { padding: 12px 16px; border: 1px solid var(--grey-100); border-radius: var(--br-m); } +.dx-prose summary { cursor: pointer; font-weight: 600; color: var(--navy); } +.dx-prose details[open] summary { margin-bottom: 8px; } +.dx-prose iframe { max-width: 100%; } + +/* Code */ +.dx-prose code { font-family: var(--font-mono); font-size: 0.86em; padding: 2px 6px; border-radius: 6px; background: var(--grey-050); color: var(--grey-900); } +.dx-prose pre { overflow-x: auto; padding: 16px 18px; border: 1px solid var(--grey-100); border-radius: var(--br-m); background: var(--grey-025); font-size: 13.5px; line-height: 1.6; } +.dx-prose pre code { padding: 0; background: none; font-size: inherit; color: inherit; } +.dx-prose .highlight { margin: 0 0 1.15em; } +.dx-prose .highlight pre { margin: 0; } + +/* Tables */ +.dx-prose table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 14px; line-height: 1.5; } +.dx-prose th, .dx-prose td { padding: 9px 14px; border-bottom: 1px solid var(--grey-100); text-align: left; vertical-align: top; } +.dx-prose thead th, .dx-prose tr:first-child > th { border-bottom: 2px solid var(--grey-200); color: var(--grey-900); font-weight: 600; background: var(--grey-025); } +.dx-prose tbody tr:hover { background: var(--grey-025); } + +/* Callouts (info / note / warning shortcodes + V2 banner) */ +.dx-callout { display: flex; gap: 14px; align-items: flex-start; margin: 0 0 1.15em; padding: 16px 18px; border: 1px solid var(--info-100); border-radius: var(--br-m); background: var(--info-050); font-size: 14px; line-height: 1.6; color: var(--grey-800); } +.dx-callout__icon { font-size: 20px; margin-top: 1px; color: var(--info-600); } +.dx-callout__body { min-width: 0; } +.dx-callout__body > :last-child { margin-bottom: 0; } +.dx-callout__body p { margin: 0 0 0.6em; } +.dx-callout a { font-weight: 600; color: var(--info-600); } +.dx-callout--note { border-color: var(--grey-100); background: var(--grey-025); } +.dx-callout--note .dx-callout__icon { color: var(--grey-700); } +.dx-callout--warning { border-color: var(--warning-100); background: var(--warning-050); } +.dx-callout--warning .dx-callout__icon { color: var(--warning-600); } +.dx-callout--warning a { color: var(--warning-700); } +.dx-article__head + .dx-callout { margin-bottom: 28px; } + +/* Landing blocks (shortcodes) */ +.dx-lead { font-size: 19px; line-height: 1.6; color: var(--grey-800); text-wrap: pretty; } +.dx-lead p { margin: 0; } +.dx-lead strong { color: var(--navy); } +.dx-lead a { font-weight: 600; } +.dx-lead a strong { color: inherit; font-weight: inherit; } +.dx-prose .dx-actions + .dx-callout { margin-top: 0; } +.dx-prose .dx-btn, .dx-prose .dx-btn:hover { text-decoration: none; } + +.dx-video { aspect-ratio: 16 / 9; margin: 0 0 1.15em; border: 1px solid var(--grey-100); border-radius: var(--br-l); overflow: hidden; background: var(--navy); } +.dx-video iframe { display: block; width: 100%; height: 100%; border: 0; } + +.dx-chapters, .dx-prose .dx-chapters { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; } +.dx-prose .dx-chapters li { margin: 0; display: flex; } +.dx-chapter { flex: 1; display: flex; align-items: center; gap: 16px; padding: 16px 18px; border: 1px solid var(--grey-100); border-radius: var(--br-l); background: #fff; color: var(--grey-900); transition: border-color 0.1s, box-shadow 0.1s; } +.dx-prose .dx-chapter:hover { border-color: var(--ttn); box-shadow: var(--bs-s); color: var(--grey-900); text-decoration: none; } +.dx-chapter__num { flex: none; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: var(--br-m); background: var(--tint); color: var(--ttn-700); font-family: var(--font-mono); font-size: 14px; font-weight: 600; } +.dx-chapter__title { flex: 1; font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--navy); } +.dx-chapter__arrow { font-size: 18px; color: var(--grey-400); } +.dx-chapter:hover .dx-chapter__arrow { color: var(--ttn); } + +.dx-feature { margin: 56px 0 0; padding: 36px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 32px; align-items: center; border-radius: var(--br-xl); background: var(--navy); color: #fff; } +.dx-feature__text { display: flex; flex-direction: column; gap: 14px; } +.dx-prose .dx-feature__eyebrow { margin: 0; font-size: 13px; font-weight: 600; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ttn); } +.dx-feature__text p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--navy-text); } +.dx-feature__text .dx-btn { align-self: flex-start; font-size: 14px; padding: 11px 20px; } +.dx-feature__media { aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: var(--br-l); background: #fff; } +.dx-feature__media img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 0; } + +.dx-topics { display: flex; flex-direction: column; gap: 28px; margin-top: 28px; } +.dx-topic { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px 32px; padding-top: 20px; border-top: 1px solid var(--grey-100); } +.dx-topic__title { display: flex; align-items: center; gap: 10px; align-self: start; font-size: 15px; font-weight: 600; color: var(--navy); } +.dx-topic__title .dx-icon { font-size: 20px; color: var(--ttn-700); } +.dx-topic__links { grid-column: span 2; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 4px 24px; } +.dx-prose .dx-topic__links a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px dashed var(--grey-100); font-size: 14px; font-weight: 400; color: var(--grey-800); text-decoration: none; } +.dx-prose .dx-topic__links a:hover { color: var(--ttn-600); } +.dx-topic__links .dx-icon { font-size: 14px; color: var(--grey-400); } +@media (max-width: 720px) { .dx-topic__links { grid-column: auto; } } + +/* Subpage cards */ +.dx-cards { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; } +.dx-cards li { display: flex; } +.dx-card { flex: 1; display: flex; align-items: center; gap: 16px; padding: 16px 18px; border: 1px solid var(--grey-100); border-radius: var(--br-l); color: var(--grey-900); transition: border-color 0.1s, box-shadow 0.1s; } +.dx-card:hover { border-color: var(--ttn); box-shadow: var(--bs-s); color: var(--grey-900); } +.dx-card__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; } +.dx-card__title { font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--navy); } +.dx-card__desc { font-size: 13.5px; line-height: 1.5; color: var(--grey-700); } +.dx-card__arrow { font-size: 18px; color: var(--grey-400); } + +/* Prev / next */ +.dx-pager { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--grey-100); } +.dx-pager__link { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border: 1px solid var(--grey-100); border-radius: var(--br-l); color: var(--grey-900); } +.dx-pager__link:hover { border-color: var(--ttn); color: var(--grey-900); } +.dx-pager__link--next { text-align: right; } +.dx-pager__dir { font-size: 12px; color: var(--grey-600); } +.dx-pager__title { display: flex; align-items: center; gap: 6px; font-weight: 600; color: var(--navy); } +.dx-pager__link--next .dx-pager__title { justify-content: flex-end; } + +/* Glossary shortcode */ +.dx-prose .glossary { padding: 20px 0; border-top: 1px solid var(--grey-100); } +.dx-prose .glossary h2 { margin: 0 0 10px; font-size: 20px; } +.dx-prose .glossary h3 { margin: 12px 0 4px; font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--grey-600); } + +/* ---------- Docs home / 404 ---------- */ +.dx-home__hero { padding: 72px 0 56px; background: linear-gradient(180deg, var(--tint) 0%, #fff 100%); border-bottom: 1px solid var(--grey-100); } +.dx-home__hero .dx-title { max-width: 820px; margin-top: 14px; font-size: clamp(2.4rem, 5vw, 3.8rem); } +.dx-home__hero--404 { min-height: 50vh; } +.dx-home__sub { max-width: 640px; margin: 18px 0 0; font-size: 19px; line-height: 1.6; color: var(--grey-800); } +.dx-home__section { padding-block: 48px 8px; } +.dx-home__section:last-of-type { padding-bottom: 96px; } +.dx-home__h2 { margin: 0 0 20px; font-size: 26px; line-height: 1.2; letter-spacing: -0.02em; color: var(--navy); } +.dx-home__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; } +.dx-home__grid li { display: flex; } +.dx-home__card { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 24px; border: 1px solid var(--grey-100); border-radius: var(--br-l); background: #fff; color: var(--grey-900); transition: border-color 0.1s, box-shadow 0.1s; } +.dx-home__card:hover { border-color: var(--ttn); box-shadow: var(--bs-s); color: var(--grey-900); } +.dx-home__img { height: 72px; width: auto; align-self: flex-start; margin-bottom: 6px; object-fit: contain; } +.dx-home__img--wide { height: 40px; margin-block: 16px 22px; } +.dx-home__card-title { font-size: 18px; font-weight: 700; color: var(--navy); } +.dx-home__card-text { flex: 1; font-size: 14.5px; line-height: 1.6; color: var(--grey-700); } +.dx-home__card-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 14px; font-weight: 600; color: var(--ttn-600); } + +/* ---------- Footer ---------- */ +.dx-footer { background: var(--ink); color: var(--muted-invert); } +.dx-footer__inner { display: flex; flex-direction: column; gap: 56px; padding-block: 72px 40px; } +.dx-footer__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 40px; } +.dx-footer__brand { grid-column: span 2; max-width: 360px; display: flex; flex-direction: column; gap: 16px; } +.dx-footer__brand img { height: 34px; width: auto; align-self: flex-start; } +.dx-footer__brand p { margin: 0; font-size: 14px; line-height: 1.6; } +.dx-footer__col { display: flex; flex-direction: column; gap: 10px; } +.dx-footer__title { margin-bottom: 4px; color: #fff; font-size: 13px; font-weight: 600; } +.dx-footer a { color: var(--muted-invert); font-size: 14px; } +.dx-footer a:hover { color: #fff; } +.dx-footer__base { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; padding-top: 24px; border-top: 1px solid rgb(255 255 255 / 12%); font-size: 13px; } +.dx-footer__social { display: flex; gap: 20px; } +.dx-footer__social a { font-size: 20px; line-height: 0; } + +/* Cookie notice */ +.dx-cookie { position: fixed; right: 16px; bottom: 16px; z-index: 40; max-width: 380px; display: flex; align-items: center; gap: 16px; padding: 14px 16px; border: 1px solid var(--grey-100); border-radius: var(--br-l); background: #fff; box-shadow: 0 12px 32px rgb(0 24 89 / 14%); font-size: 13.5px; line-height: 1.5; color: var(--grey-800); } +.dx-cookie[hidden] { display: none; } +.dx-cookie p { margin: 0; } + +/* ---------- Responsive ---------- */ +@media (max-width: 1240px) { + .dx-rail { display: none; } + .dx-main { padding-inline: 40px; } +} + +@media (max-width: 1080px) { + .dx-header__bar { gap: 16px; } + .dx-header__toggle { display: block; } + .dx-header__panel { + display: none; position: absolute; top: var(--header-h); left: 0; right: 0; + flex-direction: column; align-items: stretch; gap: 16px; padding: 16px 16px 24px; + background: #fff; border-bottom: 1px solid var(--grey-100); box-shadow: 0 12px 24px rgb(0 24 89 / 8%); + max-height: calc(100vh - var(--header-h)); overflow-y: auto; + } + .dx-header[data-open] .dx-header__panel { display: flex; } + .dx-header[data-open] .dx-header__toggle-open { display: none; } + .dx-header[data-open] .dx-header__toggle-close { display: inline; } + .dx-header__nav { flex-direction: column; align-items: stretch; } + .dx-header__link { padding: 10px 12px; font-size: 15px; } + .dx-drop__menu { position: static; box-shadow: none; border: 0; padding: 0 0 0 12px; } + .dx-header__tools { flex-direction: column; align-items: stretch; gap: 12px; } + .dx-search { width: 100%; } + .dx-search__results { position: static; width: 100%; margin-top: 6px; box-shadow: none; } + .dx-header__auth { justify-content: flex-start; gap: 8px; } + + .dx-docs { flex-direction: column; align-items: stretch; } + .dx-side { position: static; flex: none; max-height: none; overflow: visible; padding: 12px 16px; border-right: 0; border-bottom: 1px solid var(--grey-100); } + .dx-side__summary { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: var(--br-m); color: var(--navy); font-size: 14px; font-weight: 600; cursor: pointer; list-style: none; } + .dx-side__summary::-webkit-details-marker { display: none; } + .dx-side__toggle[open] .dx-side__summary { margin-bottom: 12px; } + .dx-main { padding: 28px 16px 72px; } +} + +@media (max-width: 700px) { + html { font-size: 14px; } + .dx-prose figure.float { float: none; max-width: none; margin: 0 0 1.15em; } + .dx-feature { padding: 24px; } + .dx-footer__brand { grid-column: 1 / -1; } + .dx-cookie { left: 16px; right: 16px; max-width: none; } +} + +@media print { + .dx-header, .dx-side, .dx-rail, .dx-footer, .dx-cookie, .dx-pager { display: none !important; } + .dx-main { padding: 0; } +} + +/* ---------- Syntax highlighting (Chroma, class-based; light) ---------- */ +.chroma { color: var(--grey-900); background: var(--grey-025); } +.chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } +.chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; } +.chroma .hl { display: block; width: 100%; background: #e6f4ff; } +.chroma .lnt, .chroma .ln { margin-right: 0.8em; padding: 0 0.4em; color: var(--grey-400); } +.chroma .k, .chroma .kc, .chroma .kd, .chroma .kn, .chroma .kp, .chroma .kr, .chroma .kt, .chroma .nt { color: #0050b3; font-weight: 600; } +.chroma .s, .chroma .sa, .chroma .sb, .chroma .sc, .chroma .s2, .chroma .s1, .chroma .sh, .chroma .se, .chroma .sx, .chroma .dl, .chroma .sd { color: #0a7c36; } +.chroma .m, .chroma .mi, .chroma .mf, .chroma .mh, .chroma .mo, .chroma .mb, .chroma .il { color: #b35900; } +.chroma .c, .chroma .c1, .chroma .cm, .chroma .cs, .chroma .ch, .chroma .cp, .chroma .cpf { color: var(--grey-600); font-style: italic; } +.chroma .nf, .chroma .fm, .chroma .nc, .chroma .nn { color: #6f42c1; } +.chroma .na, .chroma .nb, .chroma .bp, .chroma .no, .chroma .nv, .chroma .vc, .chroma .vg, .chroma .vi { color: #005cc5; } +.chroma .o, .chroma .ow, .chroma .p { color: var(--grey-800); } +.chroma .gd { color: #b31d28; background: #ffeef0; } +.chroma .gi { color: #22863a; background: #f0fff4; } +.chroma .err { color: #b31d28; } diff --git a/doc/assets/css/footer/footer.scss b/doc/assets/css/footer/footer.scss deleted file mode 100644 index 0b8918afbd..0000000000 --- a/doc/assets/css/footer/footer.scss +++ /dev/null @@ -1,24 +0,0 @@ -.footer { - background-size: cover; - .title { - color: $graphite; - } - .p { - color: $graphite; - } - a { - color: $graphite; - &:hover { - color: $blue; - } - } -} - -.ttn-footer { - background-color: var(--c-background-03); - padding-bottom: 0; - - @media (min-width: 768px) { - padding-bottom: var(--cs-s); - } -} diff --git a/doc/assets/css/glossary/glossary.scss b/doc/assets/css/glossary/glossary.scss deleted file mode 100644 index b2091ad4d5..0000000000 --- a/doc/assets/css/glossary/glossary.scss +++ /dev/null @@ -1,5 +0,0 @@ -.glossary { - padding-top: 2rem; - padding-bottom: 2rem; - border-top: 1px solid $border; -} diff --git a/doc/assets/css/header/nav.scss b/doc/assets/css/header/nav.scss deleted file mode 100644 index 59cc540904..0000000000 --- a/doc/assets/css/header/nav.scss +++ /dev/null @@ -1,39 +0,0 @@ -#migration-text { - color: $white; - font-weight: bold; - padding-right: 30px; -} - -#migration-button { - border: 1px $white; - border-style: solid; -} - -#migration-info { - width: 100vw; - height: $banner-height; - font-size: 15px; - justify-content: center; - align-items: center; - background-color: $blue; - display: none; // or `flex` -} - -.navbar { - display: block; - border-bottom: 1px solid #e9ecef; -} - -.navbar.is-fixed-top { - background-color: $white; -} - -a.navbar-item { - font-family: $family-sans-serif; - border-radius: 5px; - margin: 10px 5px; -} - -.has-navbar-banner-top { - padding-top: $navbar-height + $banner-height!important; -} diff --git a/doc/assets/css/header/search.scss b/doc/assets/css/header/search.scss deleted file mode 100644 index d2aebadf7b..0000000000 --- a/doc/assets/css/header/search.scss +++ /dev/null @@ -1,20 +0,0 @@ -.search-container { - margin: none; - padding-top: $content-padding-top; - padding-bottom: $content-padding-top; - display: flex; - align-items: center; - justify-content: center; - border-bottom: 1px solid #e9ecef; -} - -.search-bar { - border: solid 1px #888888; - background-color: white; - width: 55vw; - padding: 28px; - border-radius: 5px; - filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.1)); - font-size: 20px; - left: -1px; // Hack for left-justified dropdown -} diff --git a/doc/assets/css/highlight.scss b/doc/assets/css/highlight.scss deleted file mode 100644 index 5732a2fac9..0000000000 --- a/doc/assets/css/highlight.scss +++ /dev/null @@ -1,297 +0,0 @@ -.chroma { - color: $dark; - background-color: $light; - - /* Error */ - .err { - color: $red; - background-color: $dark; - } - /* LineTableTD */ - .lntd { - vertical-align: top; - padding: 0; - margin: 0; - border: 0; - } - /* LineTable */ - .lntable { - border-spacing: 0; - padding: 0; - margin: 0; - border: 0; - width: auto; - overflow: auto; - display: block; - } - /* LineHighlight */ - .hl { - display: block; - width: 100%; - background-color: #ffffcc; - } - /* LineNumbersTable */ - .lnt { - margin-right: 0.4em; - padding: 0 0.4em 0 0.4em; - color: $grey-light; - } - /* LineNumbers */ - .ln { - margin-right: 0.4em; - padding: 0 0.4em 0 0.4em; - color: $grey-light; - } - /* Keyword */ - .k { - color: $blue; - } - /* KeywordConstant */ - .kc { - color: $blue; - } - /* KeywordDeclaration */ - .kd { - color: $blue; - } - /* KeywordNamespace */ - .kn { - color: $primary; - } - /* KeywordPseudo */ - .kp { - color: $blue; - } - /* KeywordReserved */ - .kr { - color: $blue; - } - /* KeywordType */ - .kt { - color: $blue; - } - /* Name */ - .n { - color: $dark; - } - /* NameAttribute */ - .na { - color: $green; - } - /* NameBuiltin */ - .nb { - color: $dark; - } - /* NameBuiltinPseudo */ - .bp { - color: $dark; - } - /* NameClass */ - .nc { - color: $green; - } - /* NameConstant */ - .no { - color: $blue; - } - /* NameDecorator */ - .nd { - color: $green; - } - /* NameEntity */ - .ni { - color: $dark; - } - /* NameException */ - .ne { - color: $green; - } - /* NameFunction */ - .nf { - color: $green; - } - /* NameFunctionMagic */ - .fm { - color: $dark; - } - /* NameLabel */ - .nl { - color: $dark; - } - /* NameNamespace */ - .nn { - color: $dark; - } - /* NameOther */ - .nx { - color: $green; - } - /* NameProperty */ - .py { - color: $dark; - } - /* NameTag */ - .nt { - color: $primary; - } - /* NameVariable */ - .nv { - color: $dark; - } - /* NameVariableClass */ - .vc { - color: $dark; - } - /* NameVariableGlobal */ - .vg { - color: $dark; - } - /* NameVariableInstance */ - .vi { - color: $dark; - } - /* NameVariableMagic */ - .vm { - color: $dark; - } - /* Literal */ - .l { - color: $purple; - } - /* LiteralDate */ - .ld { - color: $orange; - } - /* LiteralString */ - .s { - color: $orange; - } - /* LiteralStringAffix */ - .sa { - color: $orange; - } - /* LiteralStringBacktick */ - .sb { - color: $orange; - } - /* LiteralStringChar */ - .sc { - color: $orange; - } - /* LiteralStringDelimiter */ - .dl { - color: $orange; - } - /* LiteralStringDoc */ - .sd { - color: $orange; - } - /* LiteralStringDouble */ - .s2 { - color: $orange; - } - /* LiteralStringEscape */ - .se { - color: $orange; - } - /* LiteralStringHeredoc */ - .sh { - color: $orange; - } - /* LiteralStringInterpol */ - .si { - color: $orange; - } - /* LiteralStringOther */ - .sx { - color: $orange; - } - /* LiteralStringRegex */ - .sr { - color: $orange; - } - /* LiteralStringSingle */ - .s1 { - color: $orange; - } - /* LiteralStringSymbol */ - .ss { - color: $orange; - } - /* LiteralNumber */ - .m { - color: $purple; - } - /* LiteralNumberBin */ - .mb { - color: $purple; - } - /* LiteralNumberFloat */ - .mf { - color: $purple; - } - /* LiteralNumberHex */ - .mh { - color: $purple; - } - /* LiteralNumberInteger */ - .mi { - color: $purple; - } - /* LiteralNumberIntegerLong */ - .il { - color: $purple; - } - /* LiteralNumberOct */ - .mo { - color: $purple; - } - /* Operator */ - .o { - color: $primary; - } - /* OperatorWord */ - .ow { - color: $primary; - } - /* Punctuation */ - .p { - color: $dark; - } - /* Comment */ - .c { - color: $grey; - } - /* CommentHashbang */ - .ch { - color: $grey; - } - /* CommentMultiline */ - .cm { - color: $grey; - } - /* CommentSingle */ - .c1 { - color: $grey; - } - /* CommentSpecial */ - .cs { - color: $grey; - } - /* CommentPreproc */ - .cp { - color: $grey; - } - /* CommentPreprocFile */ - .cpf { - color: $grey; - } - /* GenericEmph */ - .ge { - font-style: italic; - } - /* GenericStrong */ - .gs { - font-weight: bold; - } -} diff --git a/doc/assets/css/sidebar/sidebar.scss b/doc/assets/css/sidebar/sidebar.scss deleted file mode 100644 index 3113fa7152..0000000000 --- a/doc/assets/css/sidebar/sidebar.scss +++ /dev/null @@ -1,45 +0,0 @@ -.sidebar-left { - @media (min-width: $desktop) { - order: 0; - border-right: 1px solid $border; - position: -webkit-sticky; - position: sticky; - top: 2 * $content-padding-top; - align-self: flex-start; // Fix for sticky in flex - } -} - -.sidebar-right { - display: none; - order: 2; - @media (min-width: $widescreen) { - display: block; - position: -webkit-sticky; - position: sticky; - top: 2 * $content-padding-top; - align-self: flex-start; // Fix for sticky in flex - } -} - -.sidebar-middle { - order: 1; -} - -.docs-content { - @media (min-width: $desktop) { - padding-left: $content-padding-side; - padding-right: $content-padding-side; - max-width: $content-max-width; - } -} - -.toc, .side-navigation { - @media (min-width: $desktop) { - max-height: calc(100vh - 9rem); - overflow-y: auto; - } -} - -.toc, .docs-content, .side-navigation { - padding-top: $content-padding-top; -} diff --git a/doc/assets/css/theme.scss b/doc/assets/css/theme.scss deleted file mode 100644 index b1f0841a31..0000000000 --- a/doc/assets/css/theme.scss +++ /dev/null @@ -1,38 +0,0 @@ -@charset "utf-8"; - -// `node_modules` mounted to css/vendor and js/vendor in config.toml - -@import "vendor/bulma/sass/utilities/initial-variables"; - -// TTUI cannot be inmported currently because of an issue with the -// hugo built-in SCSS transpiler with the minified CSS output. -// @import '@tti/design/ui/main'; - -@import "common/fonts"; -@import "common/variables"; - -@import "vendor/bulma/bulma"; - -@import "vendor/basicLightbox.min"; - -@import "common/global"; -@import "common/tabs"; -@import "footer/footer"; -@import "header/nav"; -@import "header/search"; -@import "sidebar/sidebar"; -@import "glossary/glossary"; - -@import "highlight"; - -.cli-flags dd { - margin-top: 0.5em; - margin-bottom: 0.5em; -} - -.cli-flags p:not(:last-child) { - margin-bottom: 0.5em; -} - -@import "vendor/bulma-tooltip.min"; -@import "vendor/bulma-divider"; diff --git a/doc/assets/css/vendor/basicLightbox.min.scss b/doc/assets/css/vendor/basicLightbox.min.scss deleted file mode 100644 index a8b8b7814d..0000000000 --- a/doc/assets/css/vendor/basicLightbox.min.scss +++ /dev/null @@ -1 +0,0 @@ -.basicLightbox{position:fixed;display:flex;justify-content:center;align-items:center;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,.8);opacity:.01;transition:opacity .4s ease;z-index:1000;will-change:opacity}.basicLightbox--visible{opacity:1}.basicLightbox__placeholder{max-width:100%;transform:scale(.9);transition:transform .4s ease;z-index:1;will-change:transform}.basicLightbox__placeholder>iframe:first-child:last-child,.basicLightbox__placeholder>img:first-child:last-child,.basicLightbox__placeholder>video:first-child:last-child{display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;max-width:95%;max-height:95%}.basicLightbox__placeholder>iframe:first-child:last-child,.basicLightbox__placeholder>video:first-child:last-child{pointer-events:auto}.basicLightbox__placeholder>img:first-child:last-child,.basicLightbox__placeholder>video:first-child:last-child{width:auto;height:auto}.basicLightbox--iframe .basicLightbox__placeholder,.basicLightbox--img .basicLightbox__placeholder,.basicLightbox--video .basicLightbox__placeholder{width:100%;height:100%;pointer-events:none}.basicLightbox--visible .basicLightbox__placeholder{transform:scale(1)} diff --git a/doc/assets/css/vendor/bulma-divider.sass b/doc/assets/css/vendor/bulma-divider.sass deleted file mode 100644 index 9a7c5e9af9..0000000000 --- a/doc/assets/css/vendor/bulma-divider.sass +++ /dev/null @@ -1,73 +0,0 @@ -@charset "utf-8" - -$divider-background-color: $border !default -$divider-font-size: $size-7 !default -$divider-margin-inner-size: 10px !default -$divider-margin-size: 25px !default - -.divider - position: relative - display: flex - align-items: center - text-transform: uppercase - color: $grey - font-size: $divider-font-size - font-weight: $weight-semibold - letter-spacing: .5px - margin: $divider-margin-size 0 - - &::after, - &::before - content: '' - display: block - flex: 1 - height: 1px - background-color: $divider-background-color - - &:not(.is-right) - &::after - margin-left: $divider-margin-inner-size - - &:not(.is-left) - &::before - margin-right: $divider-margin-inner-size - - &.is-left - &::before - display: none - - &.is-right - &::after - display: none - - &.is-vertical - flex-direction: column - margin: 0 $divider-margin-size - - &::after, - &::before - height: auto - width: 1px - - &::after - margin-left: 0 - margin-top: $divider-margin-inner-size - - &::before - margin-right: 0 - margin-bottom: $divider-margin-inner-size - - @each $name, $pair in $colors - $color: nth($pair, 1) - &.is-#{$name} - &::after, - &::before - background-color: $color - - // If light and dark colors are provided - @if length($pair) >= 4 - $color-light: nth($pair, 3) - &.is-light - &::after, - &::before - background-color: $color-light diff --git a/doc/assets/css/vendor/bulma-tooltip.min.css b/doc/assets/css/vendor/bulma-tooltip.min.css deleted file mode 100644 index 00836bb456..0000000000 --- a/doc/assets/css/vendor/bulma-tooltip.min.css +++ /dev/null @@ -1,2 +0,0 @@ -/*! @creativebulma/bulma-tooltip v1.2.0 | (c) 2020 Gaetan | MIT License | https://github.com/CreativeBulma/bulma-tooltip */ -[data-tooltip]:not(.is-disabled),[data-tooltip]:not(.is-loading),[data-tooltip]:not([disabled]){cursor:pointer;overflow:visible;position:relative}[data-tooltip]:not(.is-disabled):before,[data-tooltip]:not(.is-loading):before,[data-tooltip]:not([disabled]):before{background:rgba(74,74,74,.9);border-radius:2px;content:attr(data-tooltip);padding:.5rem 1rem;text-overflow:ellipsis;white-space:pre;right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}[data-tooltip]:not(.is-disabled).has-tooltip-arrow:after,[data-tooltip]:not(.is-disabled):before,[data-tooltip]:not(.is-loading).has-tooltip-arrow:after,[data-tooltip]:not(.is-loading):before,[data-tooltip]:not([disabled]).has-tooltip-arrow:after,[data-tooltip]:not([disabled]):before{box-sizing:border-box;color:#fff;display:inline-block;font-family:BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.75rem;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;visibility:hidden;z-index:1}[data-tooltip]:not(.is-disabled).has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-arrow:after{content:"";border-style:solid;border-width:6px;border-color:rgba(74,74,74,.9) transparent transparent;margin-bottom:-5px}[data-tooltip]:not(.is-disabled).has-tooltip-arrow.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-arrow.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-arrow.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-bottom.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom:before,[data-tooltip]:not([disabled]).has-tooltip-bottom:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}[data-tooltip]:not(.is-disabled).has-tooltip-left.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left:before,[data-tooltip]:not(.is-loading).has-tooltip-left:before,[data-tooltip]:not([disabled]).has-tooltip-left:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}[data-tooltip]:not(.is-disabled).has-tooltip-right.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right:before,[data-tooltip]:not(.is-loading).has-tooltip-right:before,[data-tooltip]:not([disabled]).has-tooltip-right:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}[data-tooltip]:not(.is-disabled).has-tooltip-multiline:before,[data-tooltip]:not(.is-loading).has-tooltip-multiline:before,[data-tooltip]:not([disabled]).has-tooltip-multiline:before{height:auto;width:15rem;max-width:15rem;text-overflow:clip;white-space:normal;word-break:keep-all}[data-tooltip]:not(.is-disabled).has-tooltip-text-left:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left:before,[data-tooltip]:not([disabled]).has-tooltip-text-left:before{text-align:left}[data-tooltip]:not(.is-disabled).has-tooltip-text-centered:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered:before{text-align:center}[data-tooltip]:not(.is-disabled).has-tooltip-text-right:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right:before,[data-tooltip]:not([disabled]).has-tooltip-text-right:before{text-align:right}[data-tooltip]:not(.is-disabled).has-tooltip-white:after,[data-tooltip]:not(.is-loading).has-tooltip-white:after,[data-tooltip]:not([disabled]).has-tooltip-white:after{border-color:hsla(0,0%,100%,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-white.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-white.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-white.has-tooltip-bottom:after{border-color:transparent transparent hsla(0,0%,100%,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-white.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-white.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-white.has-tooltip-left:after{border-color:transparent transparent transparent hsla(0,0%,100%,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-white.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-white.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-white.has-tooltip-right:after{border-color:transparent hsla(0,0%,100%,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-white:before,[data-tooltip]:not(.is-loading).has-tooltip-white:before,[data-tooltip]:not([disabled]).has-tooltip-white:before{background-color:hsla(0,0%,100%,.9);color:#0a0a0a}[data-tooltip]:not(.is-disabled).has-tooltip-black:after,[data-tooltip]:not(.is-loading).has-tooltip-black:after,[data-tooltip]:not([disabled]).has-tooltip-black:after{border-color:hsla(0,0%,4%,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-black.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-black.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-black.has-tooltip-bottom:after{border-color:transparent transparent hsla(0,0%,4%,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-black.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-black.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-black.has-tooltip-left:after{border-color:transparent transparent transparent hsla(0,0%,4%,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-black.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-black.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-black.has-tooltip-right:after{border-color:transparent hsla(0,0%,4%,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-black:before,[data-tooltip]:not(.is-loading).has-tooltip-black:before,[data-tooltip]:not([disabled]).has-tooltip-black:before{background-color:hsla(0,0%,4%,.9);color:#fff}[data-tooltip]:not(.is-disabled).has-tooltip-light:after,[data-tooltip]:not(.is-loading).has-tooltip-light:after,[data-tooltip]:not([disabled]).has-tooltip-light:after{border-color:hsla(0,0%,96%,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-light.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-light.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-light.has-tooltip-bottom:after{border-color:transparent transparent hsla(0,0%,96%,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-light.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-light.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-light.has-tooltip-left:after{border-color:transparent transparent transparent hsla(0,0%,96%,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-light.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-light.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-light.has-tooltip-right:after{border-color:transparent hsla(0,0%,96%,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-light:before,[data-tooltip]:not(.is-loading).has-tooltip-light:before,[data-tooltip]:not([disabled]).has-tooltip-light:before{background-color:hsla(0,0%,96%,.9);color:rgba(0,0,0,.7)}[data-tooltip]:not(.is-disabled).has-tooltip-dark:after,[data-tooltip]:not(.is-loading).has-tooltip-dark:after,[data-tooltip]:not([disabled]).has-tooltip-dark:after{border-color:rgba(54,54,54,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-dark.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-dark.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-dark.has-tooltip-bottom:after{border-color:transparent transparent rgba(54,54,54,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-dark.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-dark.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-dark.has-tooltip-left:after{border-color:transparent transparent transparent rgba(54,54,54,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-dark.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-dark.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-dark.has-tooltip-right:after{border-color:transparent rgba(54,54,54,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-dark:before,[data-tooltip]:not(.is-loading).has-tooltip-dark:before,[data-tooltip]:not([disabled]).has-tooltip-dark:before{background-color:rgba(54,54,54,.9);color:#fff}[data-tooltip]:not(.is-disabled).has-tooltip-primary:after,[data-tooltip]:not(.is-loading).has-tooltip-primary:after,[data-tooltip]:not([disabled]).has-tooltip-primary:after{border-color:rgba(0,209,178,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-primary.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-primary.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-primary.has-tooltip-bottom:after{border-color:transparent transparent rgba(0,209,178,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-primary.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-primary.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-primary.has-tooltip-left:after{border-color:transparent transparent transparent rgba(0,209,178,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-primary.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-primary.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-primary.has-tooltip-right:after{border-color:transparent rgba(0,209,178,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-primary:before,[data-tooltip]:not(.is-loading).has-tooltip-primary:before,[data-tooltip]:not([disabled]).has-tooltip-primary:before{background-color:rgba(0,209,178,.9);color:#fff}[data-tooltip]:not(.is-disabled).has-tooltip-link:after,[data-tooltip]:not(.is-loading).has-tooltip-link:after,[data-tooltip]:not([disabled]).has-tooltip-link:after{border-color:rgba(50,115,220,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-link.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-link.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-link.has-tooltip-bottom:after{border-color:transparent transparent rgba(50,115,220,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-link.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-link.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-link.has-tooltip-left:after{border-color:transparent transparent transparent rgba(50,115,220,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-link.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-link.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-link.has-tooltip-right:after{border-color:transparent rgba(50,115,220,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-link:before,[data-tooltip]:not(.is-loading).has-tooltip-link:before,[data-tooltip]:not([disabled]).has-tooltip-link:before{background-color:rgba(50,115,220,.9);color:#fff}[data-tooltip]:not(.is-disabled).has-tooltip-info:after,[data-tooltip]:not(.is-loading).has-tooltip-info:after,[data-tooltip]:not([disabled]).has-tooltip-info:after{border-color:rgba(50,152,220,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-info.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-info.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-info.has-tooltip-bottom:after{border-color:transparent transparent rgba(50,152,220,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-info.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-info.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-info.has-tooltip-left:after{border-color:transparent transparent transparent rgba(50,152,220,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-info.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-info.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-info.has-tooltip-right:after{border-color:transparent rgba(50,152,220,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-info:before,[data-tooltip]:not(.is-loading).has-tooltip-info:before,[data-tooltip]:not([disabled]).has-tooltip-info:before{background-color:rgba(50,152,220,.9);color:#fff}[data-tooltip]:not(.is-disabled).has-tooltip-success:after,[data-tooltip]:not(.is-loading).has-tooltip-success:after,[data-tooltip]:not([disabled]).has-tooltip-success:after{border-color:rgba(72,199,116,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-success.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-success.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-success.has-tooltip-bottom:after{border-color:transparent transparent rgba(72,199,116,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-success.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-success.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-success.has-tooltip-left:after{border-color:transparent transparent transparent rgba(72,199,116,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-success.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-success.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-success.has-tooltip-right:after{border-color:transparent rgba(72,199,116,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-success:before,[data-tooltip]:not(.is-loading).has-tooltip-success:before,[data-tooltip]:not([disabled]).has-tooltip-success:before{background-color:rgba(72,199,116,.9);color:#fff}[data-tooltip]:not(.is-disabled).has-tooltip-warning:after,[data-tooltip]:not(.is-loading).has-tooltip-warning:after,[data-tooltip]:not([disabled]).has-tooltip-warning:after{border-color:rgba(255,221,87,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-warning.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-warning.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-warning.has-tooltip-bottom:after{border-color:transparent transparent rgba(255,221,87,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-warning.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-warning.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-warning.has-tooltip-left:after{border-color:transparent transparent transparent rgba(255,221,87,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-warning.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-warning.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-warning.has-tooltip-right:after{border-color:transparent rgba(255,221,87,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-warning:before,[data-tooltip]:not(.is-loading).has-tooltip-warning:before,[data-tooltip]:not([disabled]).has-tooltip-warning:before{background-color:rgba(255,221,87,.9);color:rgba(0,0,0,.7)}[data-tooltip]:not(.is-disabled).has-tooltip-danger:after,[data-tooltip]:not(.is-loading).has-tooltip-danger:after,[data-tooltip]:not([disabled]).has-tooltip-danger:after{border-color:rgba(241,70,104,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-danger.has-tooltip-bottom:after,[data-tooltip]:not(.is-loading).has-tooltip-danger.has-tooltip-bottom:after,[data-tooltip]:not([disabled]).has-tooltip-danger.has-tooltip-bottom:after{border-color:transparent transparent rgba(241,70,104,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-danger.has-tooltip-left:after,[data-tooltip]:not(.is-loading).has-tooltip-danger.has-tooltip-left:after,[data-tooltip]:not([disabled]).has-tooltip-danger.has-tooltip-left:after{border-color:transparent transparent transparent rgba(241,70,104,.9)!important}[data-tooltip]:not(.is-disabled).has-tooltip-danger.has-tooltip-right:after,[data-tooltip]:not(.is-loading).has-tooltip-danger.has-tooltip-right:after,[data-tooltip]:not([disabled]).has-tooltip-danger.has-tooltip-right:after{border-color:transparent rgba(241,70,104,.9) transparent transparent!important}[data-tooltip]:not(.is-disabled).has-tooltip-danger:before,[data-tooltip]:not(.is-loading).has-tooltip-danger:before,[data-tooltip]:not([disabled]).has-tooltip-danger:before{background-color:rgba(241,70,104,.9);color:#fff}[data-tooltip]:not(.is-disabled).has-tooltip-active:after,[data-tooltip]:not(.is-disabled).has-tooltip-active:before,[data-tooltip]:not(.is-disabled):hover:after,[data-tooltip]:not(.is-disabled):hover:before,[data-tooltip]:not(.is-loading).has-tooltip-active:after,[data-tooltip]:not(.is-loading).has-tooltip-active:before,[data-tooltip]:not(.is-loading):hover:after,[data-tooltip]:not(.is-loading):hover:before,[data-tooltip]:not([disabled]).has-tooltip-active:after,[data-tooltip]:not([disabled]).has-tooltip-active:before,[data-tooltip]:not([disabled]):hover:after,[data-tooltip]:not([disabled]):hover:before{opacity:1;visibility:visible}[data-tooltip]:not(.is-disabled).has-tooltip-fade:after,[data-tooltip]:not(.is-disabled).has-tooltip-fade:before,[data-tooltip]:not(.is-loading).has-tooltip-fade:after,[data-tooltip]:not(.is-loading).has-tooltip-fade:before,[data-tooltip]:not([disabled]).has-tooltip-fade:after,[data-tooltip]:not([disabled]).has-tooltip-fade:before{transition:opacity .3s linear,visibility .3s linear}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-top-mobile.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-mobile.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-mobile.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-top-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-top-mobile:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-top-tablet.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-tablet.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-tablet.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-top-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-top-tablet:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-top-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-tablet-only.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-top-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-top-tablet-only:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-top-touch.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-touch.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-touch.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-top-touch:before,[data-tooltip]:not([disabled]).has-tooltip-top-touch:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-top-desktop.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-desktop.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-desktop.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-top-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-top-desktop:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-top-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-desktop-only.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-top-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-top-desktop-only:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-top-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-until-widescreen.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-top-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-top-until-widescreen:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-top-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-widescreen.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-top-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-top-widescreen:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-top-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-widescreen-only.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-top-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-top-widescreen-only:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-top-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-until-fullhd.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-top-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-top-until-fullhd:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-top-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-top-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-top-fullhd.has-tooltip-arrow:after{top:0;right:auto;bottom:auto;left:50%;margin:-5px auto auto -5px;border-color:rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-top-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-top-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-top-fullhd:before{right:auto;bottom:auto;left:50%;top:0;margin-top:-5px;margin-bottom:auto;transform:translate(-50%,-100%)}}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-right-mobile.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-mobile.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-mobile.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-right-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-right-mobile:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-right-tablet.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-tablet.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-tablet.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-right-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-right-tablet:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-right-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-tablet-only.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-right-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-right-tablet-only:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-right-touch.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-touch.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-touch.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-right-touch:before,[data-tooltip]:not([disabled]).has-tooltip-right-touch:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-right-desktop.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-desktop.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-desktop.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-right-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-right-desktop:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-right-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-desktop-only.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-right-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-right-desktop-only:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-right-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-until-widescreen.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-right-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-right-until-widescreen:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-right-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-widescreen.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-right-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-right-widescreen:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-right-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-widescreen-only.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-right-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-right-widescreen-only:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-right-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-until-fullhd.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-right-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-right-until-fullhd:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-right-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-right-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-right-fullhd.has-tooltip-arrow:after{top:auto;right:0;bottom:50%;left:auto;margin:auto -6px -6px auto;border-color:transparent rgba(74,74,74,.9) transparent transparent}[data-tooltip]:not(.is-disabled).has-tooltip-right-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-right-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-right-fullhd:before{top:auto;right:-5px;bottom:50%;left:auto;margin-top:auto;transform:translate(100%,50%)}}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-mobile.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-mobile.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-mobile.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-mobile:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-tablet.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-tablet.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-tablet.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-tablet:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-tablet-only.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-tablet-only:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-touch.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-touch.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-touch.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-touch:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-touch:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-desktop.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-desktop.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-desktop.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-desktop:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-desktop-only.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-desktop-only:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-until-widescreen.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-until-widescreen:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-widescreen.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-widescreen:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-widescreen-only.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-widescreen-only:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-until-fullhd.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-until-fullhd:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-bottom-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-bottom-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-bottom-fullhd.has-tooltip-arrow:after{top:auto;right:auto;bottom:-1px;left:50%;margin:auto auto -5px -5px;border-color:transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-bottom-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-bottom-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-bottom-fullhd:before{top:auto;right:auto;bottom:0;left:50%;margin-top:auto;margin-bottom:-5px;transform:translate(-50%,100%)}}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-left-mobile.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-mobile.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-mobile.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-left-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-left-mobile:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-left-tablet.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-tablet.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-tablet.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-left-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-left-tablet:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-left-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-tablet-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-tablet-only.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-left-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-left-tablet-only:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-left-touch.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-touch.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-touch.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-left-touch:before,[data-tooltip]:not([disabled]).has-tooltip-left-touch:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-left-desktop.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-desktop.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-desktop.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-left-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-left-desktop:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-left-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-desktop-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-desktop-only.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-left-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-left-desktop-only:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-left-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-until-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-until-widescreen.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-left-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-left-until-widescreen:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-left-widescreen.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-widescreen.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-widescreen.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-left-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-left-widescreen:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-left-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-widescreen-only.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-widescreen-only.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-left-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-left-widescreen-only:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-left-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-until-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-until-fullhd.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-left-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-left-until-fullhd:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-left-fullhd.has-tooltip-arrow:after,[data-tooltip]:not(.is-loading).has-tooltip-left-fullhd.has-tooltip-arrow:after,[data-tooltip]:not([disabled]).has-tooltip-left-fullhd.has-tooltip-arrow:after{top:auto;right:auto;bottom:50%;left:0;margin:auto auto -6px -5px;border-color:transparent transparent transparent rgba(74,74,74,.9)}[data-tooltip]:not(.is-disabled).has-tooltip-left-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-left-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-left-fullhd:before{top:auto;right:auto;bottom:50%;left:-5px;transform:translate(-100%,50%)}}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-mobile:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-mobile:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-mobile:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-mobile:before{opacity:0!important;display:none!important}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-tablet:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-tablet:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-tablet:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-tablet:before{opacity:0!important;display:none!important}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-tablet-only:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-tablet-only:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-tablet-only:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-tablet-only:before{opacity:0!important;display:none!important}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-touch:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-touch:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-touch:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-touch:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-touch:before{opacity:0!important;display:none!important}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-desktop:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-desktop:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-desktop:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-desktop:before{opacity:0!important;display:none!important}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-desktop-only:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-desktop-only:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-desktop-only:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-desktop-only:before{opacity:0!important;display:none!important}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-until-widescreen:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-until-widescreen:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-until-widescreen:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-until-widescreen:before{opacity:0!important;display:none!important}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-widescreen:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-widescreen:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-widescreen:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-widescreen:before{opacity:0!important;display:none!important}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-widescreen-only:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-widescreen-only:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-widescreen-only:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-widescreen-only:before{opacity:0!important;display:none!important}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-until-fullhd:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-until-fullhd:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-until-fullhd:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-until-fullhd:before{opacity:0!important;display:none!important}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-hidden-fullhd:after,[data-tooltip]:not(.is-disabled).has-tooltip-hidden-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-hidden-fullhd:after,[data-tooltip]:not(.is-loading).has-tooltip-hidden-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-hidden-fullhd:after,[data-tooltip]:not([disabled]).has-tooltip-hidden-fullhd:before{opacity:0!important;display:none!important}}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-mobile:before{text-align:left}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-tablet:before{text-align:left}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-tablet-only:before{text-align:left}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-touch:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-touch:before{text-align:left}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-desktop:before{text-align:left}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-desktop-only:before{text-align:left}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-until-widescreen:before{text-align:left}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-widescreen:before{text-align:left}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-widescreen-only:before{text-align:left}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-until-fullhd:before{text-align:left}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-text-left-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-text-left-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-text-left-fullhd:before{text-align:left}}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-mobile:before{text-align:center}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-tablet:before{text-align:center}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-tablet-only:before{text-align:center}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-touch:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-touch:before{text-align:center}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-desktop:before{text-align:center}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-desktop-only:before{text-align:center}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-until-widescreen:before{text-align:center}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-widescreen:before{text-align:center}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-widescreen-only:before{text-align:center}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-until-fullhd:before{text-align:center}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-text-centered-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-text-centered-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-text-centered-fullhd:before{text-align:center}}@media screen and (max-width:768px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-mobile:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-mobile:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-mobile:before{text-align:right}}@media print,screen and (min-width:769px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-tablet:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-tablet:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-tablet:before{text-align:right}}@media screen and (min-width:769px) and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-tablet-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-tablet-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-tablet-only:before{text-align:right}}@media screen and (max-width:1023px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-touch:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-touch:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-touch:before{text-align:right}}@media screen and (min-width:1024px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-desktop:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-desktop:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-desktop:before{text-align:right}}@media screen and (min-width:1024px) and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-desktop-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-desktop-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-desktop-only:before{text-align:right}}@media screen and (max-width:1215px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-until-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-until-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-until-widescreen:before{text-align:right}}@media screen and (min-width:1216px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-widescreen:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-widescreen:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-widescreen:before{text-align:right}}@media screen and (min-width:1216px) and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-widescreen-only:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-widescreen-only:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-widescreen-only:before{text-align:right}}@media screen and (max-width:1407px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-until-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-until-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-until-fullhd:before{text-align:right}}@media screen and (min-width:1408px){[data-tooltip]:not(.is-disabled).has-tooltip-text-right-fullhd:before,[data-tooltip]:not(.is-loading).has-tooltip-text-right-fullhd:before,[data-tooltip]:not([disabled]).has-tooltip-text-right-fullhd:before{text-align:right}}span[data-tooltip]{border-bottom:1px dashed #dbdbdb}span[data-tooltip].has-tooltip-white{border-bottom-color:#fff}span[data-tooltip].has-tooltip-black{border-bottom-color:#171717}span[data-tooltip].has-tooltip-light{border-bottom-color:#fff}span[data-tooltip].has-tooltip-dark{border-bottom-color:#424242}span[data-tooltip].has-tooltip-primary{border-bottom-color:#00ebc7}span[data-tooltip].has-tooltip-link{border-bottom-color:#4882e0}span[data-tooltip].has-tooltip-info{border-bottom-color:#48a3e0}span[data-tooltip].has-tooltip-success{border-bottom-color:#5bcd83}span[data-tooltip].has-tooltip-warning{border-bottom-color:#ffe270}span[data-tooltip].has-tooltip-danger{border-bottom-color:#f35e7c}.control span[data-tooltip]{border-bottom:none} diff --git a/doc/assets/js/docs.js b/doc/assets/js/docs.js new file mode 100644 index 0000000000..ac1bbf0bc0 --- /dev/null +++ b/doc/assets/js/docs.js @@ -0,0 +1,226 @@ +// The Things Network docs theme — progressive enhancement only: every page is fully usable without +// this script (navigation is plain links, dropdowns are
, the sidebar starts open). +(function () { + "use strict"; + + var script = document.currentScript; + var header = document.querySelector("[data-header]"); + + // ---- Mobile header menu ---- + var toggle = document.querySelector("[data-header-toggle]"); + if (header && toggle) { + toggle.addEventListener("click", function () { + var open = !header.hasAttribute("data-open"); + header.toggleAttribute("data-open", open); + toggle.setAttribute("aria-expanded", String(open)); + }); + } + + // ---- Dropdowns: close on outside click / Escape, one open at a time ---- + var drops = Array.prototype.slice.call(document.querySelectorAll(".dx-drop")); + function closeDrops(except) { + drops.forEach(function (d) { if (d !== except) d.removeAttribute("open"); }); + } + drops.forEach(function (d) { + d.addEventListener("toggle", function () { if (d.open) closeDrops(d); }); + }); + document.addEventListener("pointerdown", function (e) { + drops.forEach(function (d) { if (d.open && !d.contains(e.target)) d.removeAttribute("open"); }); + }); + document.addEventListener("keydown", function (e) { + if (e.key === "Escape") closeDrops(null); + }); + + // ---- Sidebar: collapsed by default on narrow screens ---- + var side = document.querySelector("[data-side]"); + if (side) { + var narrow = window.matchMedia("(max-width: 1080px)"); + var syncSide = function () { side.open = !narrow.matches; }; + syncSide(); + if (narrow.addEventListener) narrow.addEventListener("change", syncSide); + } + + // ---- Signed-in state (same-origin session API of www.thethingsnetwork.org; absent elsewhere) ---- + var auth = document.querySelector("[data-auth]"); + if (auth && /(^|\.)thethingsnetwork\.org$/.test(location.hostname) && window.fetch) { + fetch("/api/session", { credentials: "same-origin" }) + .then(function (r) { return r.ok ? r.json() : null; }) + .then(function (d) { + var u = d && d.user && d.user.username; + if (!u) return; + var a = document.createElement("a"); + a.className = "dx-header__user"; + a.href = "/u/" + encodeURIComponent(u); + var img = document.createElement("img"); + img.src = "https://id.thethingsnetwork.org/pictures/" + encodeURIComponent(u) + "/thumbnail"; + img.alt = ""; + img.width = 28; + img.height = 28; + a.appendChild(img); + a.appendChild(document.createTextNode(u)); + auth.replaceChildren(a); + }) + .catch(function () {}); + } + + // ---- Cookie notice (same rules + storage key as the TTUI banner it replaces) ---- + var cookie = document.querySelector("[data-cookie]"); + if (cookie) { + var KEY = "ttn-ca"; + var accepted = false; + try { accepted = !!localStorage.getItem(KEY); } catch (e) { accepted = true; } + var tz = ""; + try { tz = Intl.DateTimeFormat().resolvedOptions().timeZone || ""; } catch (e) {} + if (!accepted && tz.indexOf("Europe") !== -1) cookie.hidden = false; + var btn = cookie.querySelector("[data-cookie-accept]"); + if (btn) btn.addEventListener("click", function () { + try { localStorage.setItem(KEY, "true"); } catch (e) {} + cookie.hidden = true; + }); + } + + // ---- "On this page": highlight the section being read ---- + var tocLinks = Array.prototype.slice.call(document.querySelectorAll("[data-toc] a")); + if (tocLinks.length && "IntersectionObserver" in window) { + var targets = tocLinks + .map(function (a) { return document.getElementById(decodeURIComponent(a.hash.slice(1))); }) + .filter(Boolean); + var current = null; + var setCurrent = function (id) { + if (id === current) return; + current = id; + tocLinks.forEach(function (a) { + if (decodeURIComponent(a.hash.slice(1)) === id) a.setAttribute("aria-current", "true"); + else a.removeAttribute("aria-current"); + }); + }; + var update = function () { + var line = 120; + var active = targets[0]; + for (var i = 0; i < targets.length; i++) { + if (targets[i].getBoundingClientRect().top - line <= 0) active = targets[i]; + else break; + } + if (active) setCurrent(active.id); + }; + var ticking = false; + window.addEventListener("scroll", function () { + if (ticking) return; + ticking = true; + requestAnimationFrame(function () { ticking = false; update(); }); + }, { passive: true }); + update(); + } + + // ---- Search (client-side over the Hugo-generated index.json) ---- + var box = document.querySelector("[data-search]"); + var input = box && box.querySelector("[data-search-input]"); + var results = box && box.querySelector("[data-search-results]"); + var indexUrl = script && script.getAttribute("data-search-index"); + if (!box || !input || !results || !indexUrl || !window.fetch) return; + + var index = null; + var loading = null; + var selected = -1; + var shown = []; + + function load() { + if (!loading) { + loading = fetch(indexUrl) + .then(function (r) { if (!r.ok) throw new Error(r.status); return r.json(); }) + .then(function (d) { index = d; }) + .catch(function () { index = []; loading = null; }); + } + return loading; + } + + function norm(s) { return (s || "").toLowerCase().normalize("NFD").replace(/[̀-ͯ]/g, ""); } + function esc(s) { return String(s).replace(/[&<>"']/g, function (c) { return { "&": "&", "<": "<", ">": ">", '"': """, "'": "'" }[c]; }); } + function mark(text, terms) { + var out = esc(text); + terms.forEach(function (t) { + if (t.length < 2) return; + out = out.replace(new RegExp("(" + t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&") + ")", "ig"), "$1"); + }); + return out; + } + + function search(q) { + var terms = norm(q).split(/\s+/).filter(Boolean); + if (!terms.length) return []; + var scored = []; + for (var i = 0; i < index.length; i++) { + var p = index[i]; + var t = norm(p.t), d = norm(p.d), s = norm(p.s); + var score = 0, ok = true; + for (var j = 0; j < terms.length; j++) { + var term = terms[j]; + if (t.indexOf(term) === 0) score += 12; + else if (t.indexOf(term) !== -1) score += 8; + else if (s.indexOf(term) !== -1) score += 3; + else if (d.indexOf(term) !== -1) score += 2; + else { ok = false; break; } + } + if (ok) scored.push({ p: p, score: score }); + } + scored.sort(function (a, b) { return b.score - a.score || a.p.t.length - b.p.t.length; }); + return scored.slice(0, 8).map(function (x) { return x.p; }); + } + + function render() { + var q = input.value.trim(); + if (!q) { close(); return; } + shown = index ? search(q) : []; + selected = shown.length ? 0 : -1; + var terms = norm(q).split(/\s+/).filter(Boolean); + if (!index) { + results.innerHTML = '
Loading…
'; + } else if (!shown.length) { + results.innerHTML = '
No pages match “' + esc(q) + '”.
'; + } else { + results.innerHTML = shown.map(function (p, i) { + return '" + + '' + mark(p.t, terms) + "" + + '' + esc(p.s) + (p.d ? " · " + esc(p.d) : "") + ""; + }).join(""); + } + results.hidden = false; + input.setAttribute("aria-expanded", "true"); + input.setAttribute("aria-activedescendant", selected >= 0 ? "dx-sr-" + selected : ""); + } + + function close() { + results.hidden = true; + input.setAttribute("aria-expanded", "false"); + input.removeAttribute("aria-activedescendant"); + } + + function move(delta) { + if (!shown.length) return; + selected = (selected + delta + shown.length) % shown.length; + var items = results.querySelectorAll(".dx-search__item"); + for (var i = 0; i < items.length; i++) items[i].toggleAttribute("aria-selected", i === selected); + if (items[selected]) items[selected].scrollIntoView({ block: "nearest" }); + input.setAttribute("aria-activedescendant", "dx-sr-" + selected); + } + + input.addEventListener("focus", load); + input.addEventListener("input", function () { load().then(render); render(); }); + input.addEventListener("keydown", function (e) { + if (e.key === "ArrowDown") { e.preventDefault(); move(1); } + else if (e.key === "ArrowUp") { e.preventDefault(); move(-1); } + else if (e.key === "Enter" && shown[selected]) { e.preventDefault(); location.href = shown[selected].u; } + else if (e.key === "Escape") { input.value = ""; close(); input.blur(); } + }); + document.addEventListener("pointerdown", function (e) { if (!box.contains(e.target)) close(); }); + + // "/" focuses search (unless already typing somewhere). + document.addEventListener("keydown", function (e) { + if (e.key !== "/" || e.metaKey || e.ctrlKey || e.altKey) return; + var el = document.activeElement; + if (el && (el.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(el.tagName))) return; + e.preventDefault(); + if (header && getComputedStyle(toggle).display !== "none" && !header.hasAttribute("data-open")) toggle.click(); + input.focus(); + }); +})(); diff --git a/doc/assets/js/theme.js b/doc/assets/js/theme.js deleted file mode 100644 index cf46ae7415..0000000000 --- a/doc/assets/js/theme.js +++ /dev/null @@ -1,22 +0,0 @@ -// Copyright © 2019 The Things Network Foundation, The Things Industries B.V. -// -// Licensed under the Apache License, Version 2.0 (the "License"); -// you may not use this file except in compliance with the License. -// You may obtain a copy of the License at -// -// http://www.apache.org/licenses/LICENSE-2.0 -// -// Unless required by applicable law or agreed to in writing, software -// distributed under the License is distributed on an "AS IS" BASIS, -// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -// See the License for the specific language governing permissions and -// limitations under the License. - - -import "@tti/design/ui/ttui-vendor.js"; -import "@tti/design/ui/main.js"; -import "@tti/design/ui/components/ttui-header/index.js"; -import "@tti/design/ui/components/ttui-footer/index.js"; -import "@tti/design/ui/components/ttn-header/index.js"; -import "@tti/design/ui/components/ttn-footer/index.js"; -import "@tti/design/ui/components/cookie-banner"; diff --git a/doc/assets/js/vendor/basicLightbox.min.js b/doc/assets/js/vendor/basicLightbox.min.js deleted file mode 100644 index e0ed0b2058..0000000000 --- a/doc/assets/js/vendor/basicLightbox.min.js +++ /dev/null @@ -1 +0,0 @@ -!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{("undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this).basicLightbox=e()}}((function(){return function e(n,t,o){function r(c,u){if(!t[c]){if(!n[c]){var s="function"==typeof require&&require;if(!u&&s)return s(c,!0);if(i)return i(c,!0);var a=new Error("Cannot find module '"+c+"'");throw a.code="MODULE_NOT_FOUND",a}var l=t[c]={exports:{}};n[c][0].call(l.exports,(function(e){return r(n[c][1][e]||e)}),l,l.exports,e,n,t,o)}return t[c].exports}for(var i="function"==typeof require&&require,c=0;c1&&void 0!==arguments[1]&&arguments[1],t=document.createElement("div");return t.innerHTML=e.trim(),!0===n?t.children:t.firstChild},r=function(e,n){var t=e.children;return 1===t.length&&t[0].tagName===n},i=function(e){return null!=(e=e||document.querySelector(".basicLightbox"))&&!0===e.ownerDocument.body.contains(e)};t.visible=i;t.create=function(e,n){var t=function(e,n){var t=o('\n\t\t
\n\t\t\t\n\t\t
\n\t')),i=t.querySelector(".basicLightbox__placeholder");e.forEach((function(e){return i.appendChild(e)}));var c=r(i,"IMG"),u=r(i,"VIDEO"),s=r(i,"IFRAME");return!0===c&&t.classList.add("basicLightbox--img"),!0===u&&t.classList.add("basicLightbox--video"),!0===s&&t.classList.add("basicLightbox--iframe"),t}(e=function(e){var n="string"==typeof e,t=e instanceof HTMLElement==!0;if(!1===n&&!1===t)throw new Error("Content must be a DOM element/node or string");return!0===n?Array.from(o(e,!0)):"TEMPLATE"===e.tagName?[e.content.cloneNode(!0)]:Array.from(e.children)}(e),n=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(null==(e=Object.assign({},e)).closable&&(e.closable=!0),null==e.className&&(e.className=""),null==e.onShow&&(e.onShow=function(){}),null==e.onClose&&(e.onClose=function(){}),"boolean"!=typeof e.closable)throw new Error("Property `closable` must be a boolean");if("string"!=typeof e.className)throw new Error("Property `className` must be a string");if("function"!=typeof e.onShow)throw new Error("Property `onShow` must be a function");if("function"!=typeof e.onClose)throw new Error("Property `onClose` must be a function");return e}(n)),c=function(e){return!1!==n.onClose(u)&&function(e,n){return e.classList.remove("basicLightbox--visible"),setTimeout((function(){return!1===i(e)||e.parentElement.removeChild(e),n()}),410),!0}(t,(function(){if("function"==typeof e)return e(u)}))};!0===n.closable&&t.addEventListener("click",(function(e){e.target===t&&c()}));var u={element:function(){return t},visible:function(){return i(t)},show:function(e){return!1!==n.onShow(u)&&function(e,n){return document.body.appendChild(e),setTimeout((function(){requestAnimationFrame((function(){return e.classList.add("basicLightbox--visible"),n()}))}),10),!0}(t,(function(){if("function"==typeof e)return e(u)}))},close:c};return u}},{}]},{},[1])(1)})); diff --git a/doc/config/_default/config.toml b/doc/config/_default/config.toml index f28b851298..3e1de8ac50 100644 --- a/doc/config/_default/config.toml +++ b/doc/config/_default/config.toml @@ -13,8 +13,9 @@ enableGitInfo = true languageCode = "en-us" languageName = "English" -pygmentsCodeFences = true -pygmentsUseClasses = true +[outputs] + # JSON = the client-side search index behind the header search box (layouts/index.json). + home = ["HTML", "JSON"] [params] title = "The Things Network" @@ -25,6 +26,8 @@ pygmentsUseClasses = true tts_github_repository = "https://github.com/TheThingsNetwork/lorawan-stack" [markup] + [markup.highlight] + noClasses = false [markup.goldmark] [markup.goldmark.renderer] unsafe = true @@ -72,6 +75,3 @@ pygmentsUseClasses = true [[module.mounts]] source = "static" target = "static" - [[module.mounts]] - source = "node_modules/bulma" - target = "assets/css/vendor/bulma" diff --git a/doc/content/lorawan/_index.md b/doc/content/lorawan/_index.md index b61598dca2..33b9236831 100644 --- a/doc/content/lorawan/_index.md +++ b/doc/content/lorawan/_index.md @@ -7,40 +7,63 @@ description: "Learn about LoRaWAN: the secure messaging protocol used by The Thi sections: - The Things Fundamentals - Additional Information +# The numbered course (sidebar numbers, the chapter grid and chapter-to-chapter prev/next). +chapters: + - what-is-lorawan + - architecture + - regional-parameters + - message-types + - security + - classes + - end-device-activation + - spreading-factors + - adaptive-data-rate + - limitations +# The "Additional Information" index, grouped by topic. Pages not listed here appear under "More". +topics: + - title: Radio & spectrum + icon: wave-sine + pages: [frequencies-by-country, frequency-plans, duty-cycle, modulation-data-rate, fec-and-code-rate, lora-phy-format, regional-limitations-of-rf-use] + - title: Antennas & signal + icon: antenna + pages: [antenna-connectors, antenna-types, db-dbm-dbi-dbd, eirp-and-erp, rssi-and-snr] + - title: Hardware & addressing + icon: cpu + pages: [concentrators, transceivers, addressing, prefix-assignments] + - title: Certification & research + icon: certificate + pages: [preparing-certification, the-things-certified-security, academic, glossary] --- -{{< figure width="150px" class="float plain" src="icon.png" >}} +{{< lead >}} +**Welcome to The Things Fundamentals on LoRaWAN!** This series of chapters was created to prepare you for [**The Things Fundamentals certification**](https://www.thethingsnetwork.org/achievements/certificates/). You'll learn all about LoRa® and LoRaWAN and suitable use cases, and afterwards you'll be ready to start developing your own LoRaWAN applications. +{{< /lead >}} -**Welcome to The Things Fundamentals on LoRaWAN!** - -This series of chapters was created to prepare you for [**The Things Fundamentals certification**](https://www.thethingsnetwork.org/achievements/certificates/). You'll learn all about LoRa® and LoRaWAN and suitable use cases, and afterwards you'll be ready to start developing your own LoRaWAN applications. +{{< actions >}} +{{< button ref="what-is-lorawan" icon="arrow-right" >}}Start chapter 1{{< /button >}} +{{< button href="#everything-you-need-to-know-about-lorawan-in-60-minutes" style="outline" icon-before="player-play" >}}Watch the 60-minute video{{< /button >}} +{{< /actions >}} {{< info >}} The LoRaWAN Fundamentals course can also be followed on Udemy. [Sign up for the online course today!](https://www.udemy.com/course/lorawan-fundamentals/) {{}} -### Everything you need to know about LoRaWAN in 60 minutes +## Everything you need to know about LoRaWAN in 60 minutes The chapters are designed to be paired with the following video by Johan Stokking, which covers the Fundamentals of LoRaWAN in 60 minutes: -{{< youtube "ZsVhYiX4_6o" >}} +{{< youtube id="ZsVhYiX4_6o" title="LoRaWAN Fundamentals in 60 minutes" >}} -### Chapters +## Chapters -- [What are LoRa and LoRaWAN]({{< relref "what-is-lorawan" >}}) -- [LoRaWAN Architecture]({{< relref "architecture" >}}) -- [Regional Parameters]({{< relref "regional-parameters" >}}) -- [Message Types]({{< relref "message-types" >}}) -- [Security]({{< relref "security" >}}) -- [Classes]({{< relref "classes" >}}) -- [End Device Activation]({{< relref "end-device-activation" >}}) -- [Spreading Factors]({{< relref "spreading-factors" >}}) -- [Adaptive Data Rate]({{< relref "adaptive-data-rate" >}}) -- [Limitations]({{< relref "limitations" >}}) +{{< chapters >}} +{{< feature title="The Things Certifications" image="certifications.png" alt="The Things Certification" href="https://www.thethingsnetwork.org/achievements/" button="Visit The Things Certification" >}} +The Things Network developed a certification program, allowing you to officially certify your skills and knowledge around LoRaWAN. Once completed the The Things Fundamentals course, you are ready to take up The Things Fundamentals Certification. +{{< /feature >}} -### The Things Certifications -The Things Network developed a certification program, allowing you to officially certify your skills and knowledge around LoRaWAN. Once completed the The Things Fundamentals course, you are ready to take up The Things Fundamentals Certification. To learn more about our certification program, visit [The Things Certification](https://www.thethingsnetwork.org/achievements/). +## Additional Information -The Things Certification +Reference articles grouped by topic. +{{< topics section="Additional Information" >}} diff --git a/doc/data/icons.json b/doc/data/icons.json new file mode 100644 index 0000000000..05d45b4702 --- /dev/null +++ b/doc/data/icons.json @@ -0,0 +1,31 @@ +{ + "search": "", + "menu-2": "", + "x": "", + "chevron-down": "", + "chevron-right": "", + "arrow-right": "", + "arrow-left": "", + "player-play": "", + "info-circle": "", + "alert-triangle": "", + "notes": "", + "layout-grid": "", + "edit": "", + "messages": "", + "list": "", + "link": "", + "wave-sine": "", + "antenna": "", + "cpu": "", + "certificate": "", + "book": "", + "school": "", + "box": "", + "network": "", + "file-text": "", + "brand-github": "", + "brand-linkedin": "", + "brand-youtube": "", + "brand-x": "" +} diff --git a/doc/data/site_nav.json b/doc/data/site_nav.json new file mode 100644 index 0000000000..26064f6f2d --- /dev/null +++ b/doc/data/site_nav.json @@ -0,0 +1,164 @@ +{ + "origin": "https://www.thethingsnetwork.org", + "header": [ + { + "label": "Learn", + "href": "/docs/", + "external": false, + "key": "learn", + "children": [] + }, + { + "label": "Hardware", + "href": "/device-repository/", + "external": false, + "key": "hardware", + "children": [ + { + "label": "Device Repository", + "href": "/device-repository/", + "external": false + }, + { + "label": "The Things Shop", + "href": "https://www.thethingsshop.com/", + "external": true + } + ] + }, + { + "label": "Forum", + "href": "/forum", + "external": false, + "key": "forum", + "children": [] + }, + { + "label": "Community", + "href": "/community", + "external": false, + "key": "community", + "children": [] + }, + { + "label": "Conference", + "href": "https://www.thethingsconference.com/", + "external": true, + "key": "conference", + "children": [] + }, + { + "label": "Enterprise", + "href": "https://www.thethingsindustries.com/", + "external": true, + "key": "enterprise", + "children": [] + } + ], + "auth": { + "login": "/login/", + "signup": "/login/", + "console": "https://console.cloud.thethings.network/" + }, + "footer": [ + { + "title": "Learn", + "links": [ + { + "label": "Get started", + "href": "/docs/network/", + "external": false + }, + { + "label": "LoRaWAN® fundamentals", + "href": "/docs/lorawan/", + "external": false + }, + { + "label": "Certification", + "href": "/achievements", + "external": false + }, + { + "label": "The Things Academy", + "href": "/achievements/a/the-things-academy/", + "external": false + } + ] + }, + { + "title": "Community", + "links": [ + { + "label": "Communities", + "href": "/community", + "external": false + }, + { + "label": "Forum", + "href": "/forum", + "external": false + }, + { + "label": "Start a community", + "href": "/start-a-community", + "external": false + }, + { + "label": "Conference", + "href": "https://www.thethingsconference.com/", + "external": true + } + ] + }, + { + "title": "Resources", + "links": [ + { + "label": "Documentation", + "href": "/docs/", + "external": false + }, + { + "label": "Device Repository", + "href": "/device-repository/", + "external": false + }, + { + "label": "The Things Stack", + "href": "https://www.thethingsindustries.com/stack/", + "external": true + }, + { + "label": "Open source", + "href": "https://github.com/TheThingsNetwork/lorawan-stack", + "external": true + } + ] + } + ], + "social": [ + { + "label": "GitHub", + "href": "https://github.com/TheThingsNetwork", + "icon": "brand-github" + }, + { + "label": "LinkedIn", + "href": "https://www.linkedin.com/company/the-things-network/", + "icon": "brand-linkedin" + }, + { + "label": "YouTube", + "href": "https://www.youtube.com/c/TheThingsNetworkCommunity", + "icon": "brand-youtube" + }, + { + "label": "X", + "href": "https://twitter.com/thethingsntwrk", + "icon": "brand-x" + } + ], + "tagline": "A global collaborative Internet of Things ecosystem, initiated by The Things Industries.", + "lorawanNotice": "LoRaWAN® is a mark used under license from the LoRa Alliance®." +} diff --git a/doc/layouts/404.html b/doc/layouts/404.html index f2ba8d5610..f0521d573b 100644 --- a/doc/layouts/404.html +++ b/doc/layouts/404.html @@ -1,11 +1,15 @@ {{ define "main" }} -
-
-
-

{{ .Title }}

-

Go Home

-
{{ .Content }}
+
+
+
+
404
+

{{ .Title | default "Page not found" }}

+

This page does not exist (anymore). Try the search above, or start from the docs home.

+
+ Docs home {{ partial "site/icon.html" (dict "n" "arrow-right") }} +
+ {{ with .Content }}
{{ . }}
{{ end }}
-
-
+ + {{ end }} diff --git a/doc/layouts/_default/_markup/render-heading.html b/doc/layouts/_default/_markup/render-heading.html new file mode 100644 index 0000000000..e970953f51 --- /dev/null +++ b/doc/layouts/_default/_markup/render-heading.html @@ -0,0 +1 @@ +{{ .Text | safeHTML }}{{ if ge .Level 2 }} #{{ end }} diff --git a/doc/layouts/_default/baseof.html b/doc/layouts/_default/baseof.html index 77e4aba61e..e89bc73026 100644 --- a/doc/layouts/_default/baseof.html +++ b/doc/layouts/_default/baseof.html @@ -1,6 +1,5 @@ - - + {{ partial "head/head.html" . }} @@ -11,40 +10,18 @@ height="0" width="0" style="display:none;visibility:hidden"> - - -{{- block "main" . }}{{- end }} - -
+Skip to content - - +{{ partial "site/header.html" . }} -{{- $script := resources.Get "js/vendor/basicLightbox.min.js" }} - -{{- $script := resources.Get "js/theme.js" | js.Build | resources.Minify | resources.Fingerprint }} - - - - - +{{- $script := resources.Get "js/docs.js" | resources.Minify | resources.Fingerprint }} + diff --git a/doc/layouts/_default/list.html b/doc/layouts/_default/list.html index d388d046ab..b159498cee 100644 --- a/doc/layouts/_default/list.html +++ b/doc/layouts/_default/list.html @@ -1,26 +1,3 @@ {{ define "main" }} - -{{- partial "header/breadcrumb-container.html" . -}} - -
-
-
- {{ partial "sidebar/side-navigation.html" . }} -
-
-
-

- {{ .Title }} -

-
- {{ partial "header-hash.html" .Content }} -
- {{ if and .Pages (not (eq .Parent .FirstSection)) }} - {{ partial "pages-cards.html" . }} - {{ end }} - {{ partial "prev-next-in-section" . }} -
-
-
-
+{{ partial "docs/page.html" . }} {{ end }} diff --git a/doc/layouts/_default/single.html b/doc/layouts/_default/single.html index 7411d78901..b159498cee 100644 --- a/doc/layouts/_default/single.html +++ b/doc/layouts/_default/single.html @@ -1,27 +1,3 @@ {{ define "main" }} - -{{- partial "header/breadcrumb-container.html" . -}} - -
-
-
- {{ partial "sidebar/side-navigation.html" . }} -
-
-
-

- {{ .Title }} -

- -
- {{ partial "header-hash.html" .Content }} -
- - {{ partial "prev-next-in-section" . }} - -
-
-
-
- +{{ partial "docs/page.html" . }} {{ end }} diff --git a/doc/layouts/index.html b/doc/layouts/index.html index a0f203b98c..106e73ea71 100644 --- a/doc/layouts/index.html +++ b/doc/layouts/index.html @@ -1,115 +1,58 @@ {{ define "main" }} -
-
-
-

- Learn -

-

- Learn all about LoRaWAN and The Things Network! -

+
+
+
+

{{ .Title }}

+

Learn all about LoRaWAN and The Things Network!

-
-
+ -
-
-
- {{ with .Site.GetPage "/lorawan" }} -
-
-
- - {{ with .Params.image }} -
-
- -
-
- {{ end }} - -
- {{ .Description | plainify }} -
-
- Read -
-
-
-
- {{ end }} -
-
-
- -
-
- -
-
- -
- Show off your LoRaWAN knowledge! Complete an official The Things Certification and get a badge. -
-
- Read -
-
-
-
-
-
-
- -
-
- -
-
- -
- Get started with The Things Stack, an out-of-the-box LoRaWAN Network Server for monitoring of network components. -
-
- Read -
-
-
-
-
-
-
- -
-
-
- {{- range .Site.Menus.community }} -
-
-
-

{{ .Name }} -

-
- {{ with .Params.image }} -
-
- -
-
- {{ end }} - {{ .Pre | plainify }} -
-
- Learn More -
-
-
-
+
+
-
-
+
  • + + + The Things Certification + Show off your LoRaWAN knowledge! Complete an official The Things Certification and get a badge. + Get certified {{ partial "site/icon.html" (dict "n" "arrow-right") }} + +
    • +
  • + + + The Things Stack + Get started with The Things Stack, an out-of-the-box LoRaWAN Network Server for monitoring of network components. + Read the docs {{ partial "site/icon.html" (dict "n" "arrow-right") }} + +
    • + + -{{ .Content }} +
    +

    Community

    + +
    + {{ .Content }} + {{ end }} diff --git a/doc/layouts/index.json b/doc/layouts/index.json new file mode 100644 index 0000000000..64e60d40b9 --- /dev/null +++ b/doc/layouts/index.json @@ -0,0 +1,8 @@ +{{- /* Client-side search index for the header search box (assets/js/docs.js). */ -}} +{{- $out := slice -}} +{{- range site.Pages -}} + {{- if and (not .IsHome) .Title (ne .Kind "404") -}} + {{- $out = $out | append (dict "t" .Title "u" .RelPermalink "s" .FirstSection.Title "d" (.Description | default (.Summary | plainify | htmlUnescape | truncate 140))) -}} + {{- end -}} +{{- end -}} +{{- $out | jsonify -}} diff --git a/doc/layouts/partials/docs/breadcrumb.html b/doc/layouts/partials/docs/breadcrumb.html new file mode 100644 index 0000000000..720ee33dae --- /dev/null +++ b/doc/layouts/partials/docs/breadcrumb.html @@ -0,0 +1,17 @@ +{{- /* Learn › › … › . Hugo 0.88 has no .Ancestors, so walk .Parent. */ -}} +{{- $chain := slice -}} +{{- $p := .Parent -}} +{{- range seq 10 -}} + {{- if and $p (not $p.IsHome) -}} + {{- $chain = $chain | append $p -}} + {{- $p = $p.Parent -}} + {{- end -}} +{{- end -}} + diff --git a/doc/layouts/partials/docs/callout.html b/doc/layouts/partials/docs/callout.html new file mode 100644 index 0000000000..b9c0792bc9 --- /dev/null +++ b/doc/layouts/partials/docs/callout.html @@ -0,0 +1,8 @@ +{{- /* Shared body of the info / note / warning shortcodes. */ -}} +
    + {{ partial "site/icon.html" (dict "n" .icon "class" "dx-callout__icon") }} +
    + {{ .label }}: + {{ .body | markdownify }} +
    +
    diff --git a/doc/layouts/partials/docs/chapters.html b/doc/layouts/partials/docs/chapters.html new file mode 100644 index 0000000000..660882e35a --- /dev/null +++ b/doc/layouts/partials/docs/chapters.html @@ -0,0 +1,12 @@ +{{- /* Returns the numbered course of a first-level section, in order: the pages named by the + section's `chapters` front matter (slugs relative to the section). Empty when not set. */ -}} +{{- $section := . -}} +{{- $out := slice -}} +{{- range $section.Params.chapters -}} + {{- with site.GetPage (printf "/%s" (path.Join $section.File.Dir .)) -}} + {{- $out = $out | append . -}} + {{- else -}} + {{- errorf "%s: chapter %q not found" $section.File.Path . -}} + {{- end -}} +{{- end -}} +{{- return $out -}} diff --git a/doc/layouts/partials/docs/page.html b/doc/layouts/partials/docs/page.html new file mode 100644 index 0000000000..006a891a81 --- /dev/null +++ b/doc/layouts/partials/docs/page.html @@ -0,0 +1,18 @@ +
    + {{ partial "docs/sidebar.html" . }} +
    +
    +
    + {{ partial "docs/breadcrumb.html" . }} +

    {{ .Title }}

    +
    + {{ partial "docs/v2-warning.html" . }} +
    + {{ .Content }} +
    + {{ if .IsSection }}{{ partial "docs/subpages.html" . }}{{ end }} + {{ partial "docs/prev-next.html" . }} +
    + {{ partial "docs/rail.html" . }} +
    +
    diff --git a/doc/layouts/partials/docs/prev-next.html b/doc/layouts/partials/docs/prev-next.html new file mode 100644 index 0000000000..88ce9dd555 --- /dev/null +++ b/doc/layouts/partials/docs/prev-next.html @@ -0,0 +1,36 @@ +{{- /* Previous/next within the page's group: a course chapter steps through the course in chapter + order; any other page through its sidebar group (`section` front matter) by weight. */ -}} +{{- $cur := . -}} +{{- $first := .FirstSection -}} +{{- $chapters := partial "docs/chapters.html" $first -}} +{{- $list := slice -}} +{{- $isChapter := false -}} +{{- range $chapters }}{{ if eq .RelPermalink $cur.RelPermalink }}{{ $isChapter = true }}{{ end }}{{ end -}} +{{- if $isChapter -}} + {{- $list = $chapters -}} +{{- else if and .Params.section (eq .Parent $first) -}} + {{- $list = where $first.Pages.ByWeight "Params.section" .Params.section -}} +{{- end -}} +{{- $prev := false -}}{{- $next := false -}} +{{- range $i, $p := $list -}} + {{- if eq $p.RelPermalink $cur.RelPermalink -}} + {{- if gt $i 0 }}{{ $prev = index $list (sub $i 1) }}{{ end -}} + {{- if lt (add $i 1) (len $list) }}{{ $next = index $list (add $i 1) }}{{ end -}} + {{- end -}} +{{- end -}} +{{- if or $prev $next }} + +{{- end }} diff --git a/doc/layouts/partials/docs/rail.html b/doc/layouts/partials/docs/rail.html new file mode 100644 index 0000000000..6a07e19f16 --- /dev/null +++ b/doc/layouts/partials/docs/rail.html @@ -0,0 +1,26 @@ +{{- /* "On this page" + page tools. The TOC is read from the rendered HTML (h2/h3 with an id) rather + than .TableOfContents, so headings emitted by shortcodes are included too. */ -}} +{{- $nav := site.Data.site_nav -}} +{{- $heads := findRE `(?s)]*\sid="[^"]+"[^>]*>.*?` .Content -}} +{{- $min := 3 -}} +{{- range $heads }}{{ if hasPrefix . " + {{- if ge (len $heads) 2 }} +
    On this page
    + +
    + {{- end }} + {{- with .File }} + {{ partial "site/icon.html" (dict "n" "edit") }}Edit this page + {{- end }} + {{- range where $nav.header "key" "forum" }} + {{ partial "site/icon.html" (dict "n" "messages") }}Ask on the forum + {{- end }} + diff --git a/doc/layouts/partials/docs/sidebar.html b/doc/layouts/partials/docs/sidebar.html new file mode 100644 index 0000000000..70e149a39d --- /dev/null +++ b/doc/layouts/partials/docs/sidebar.html @@ -0,0 +1,62 @@ +{{- $current := . -}} +{{- $first := .FirstSection -}} +{{- $chapters := partial "docs/chapters.html" $first -}} +{{- $chapterLinks := slice -}} +{{- range $chapters }}{{ $chapterLinks = $chapterLinks | append .RelPermalink }}{{ end -}} + + + +{{- define "dx-side-item" }} +{{ .page.LinkTitle }} +{{- if and .page.IsSection (.page.IsAncestor .current) }}{{ template "dx-side-tree" (dict "section" .page "current" .current) }}{{ end }} +{{- end }} + +{{- define "dx-side-tree" }} +{{- $current := .current }} +{{- with .section.Pages.ByWeight }} +
    + {{- range . }} + {{ template "dx-side-item" (dict "page" . "current" $current) }} + {{- end }} +
    +{{- end }} +{{- end }} diff --git a/doc/layouts/partials/docs/subpages.html b/doc/layouts/partials/docs/subpages.html new file mode 100644 index 0000000000..ecae6fe9b0 --- /dev/null +++ b/doc/layouts/partials/docs/subpages.html @@ -0,0 +1,16 @@ +{{- /* Cards for a section's pages. Skipped when the page builds its own index (chapters/topics). */ -}} +{{- if and .Pages (not (.HasShortcode "chapters")) (not (.HasShortcode "topics")) }} + +{{- end }} diff --git a/doc/layouts/partials/docs/v2-warning.html b/doc/layouts/partials/docs/v2-warning.html new file mode 100644 index 0000000000..7d2b47b13e --- /dev/null +++ b/doc/layouts/partials/docs/v2-warning.html @@ -0,0 +1,10 @@ +{{- if in (slice "devices" "applications" "gateways" "network") .Section }} +
    + {{ partial "site/icon.html" (dict "n" "alert-triangle" "class" "dx-callout__icon") }} +
    +

    Outdated: this section documents The Things Network V2, which is no longer maintained. + See the documentation for The Things Stack V3 + {{- with site.GetPage "/v2-docs" }}, or browse the V2 docs index{{ end }}.

    +
    +
    +{{- end }} diff --git a/doc/layouts/partials/head/head.html b/doc/layouts/partials/head/head.html index 98759d11a9..6b9b0f26da 100644 --- a/doc/layouts/partials/head/head.html +++ b/doc/layouts/partials/head/head.html @@ -1,7 +1,6 @@ - diff --git a/doc/layouts/partials/head/head.html b/doc/layouts/partials/head/head.html index 6b9b0f26da..2902640668 100644 --- a/doc/layouts/partials/head/head.html +++ b/doc/layouts/partials/head/head.html @@ -2,13 +2,10 @@ - - - + {{- /* Cookie banner + Google Tag Manager, served by the www platform (platform/app/consent.js): GTM + loads only after the visitor accepts. Root-relative on purpose — it exists only behind the www + front door, so the raw GitHub Pages origin and local Hugo previews stay untracked. */}} + {{ hugo.Generator }} diff --git a/doc/layouts/partials/site/cookie-notice.html b/doc/layouts/partials/site/cookie-notice.html deleted file mode 100644 index 0f95c8c9d2..0000000000 --- a/doc/layouts/partials/site/cookie-notice.html +++ /dev/null @@ -1,7 +0,0 @@ -{{- /* Replaces TTUI's with the same behaviour: shown only to visitors in a European - timezone who have not dismissed it yet; dismissal is remembered under the same localStorage key - ('ttn-ca') so people who already accepted on the old theme do not see it again. */ -}} - diff --git a/doc/layouts/partials/site/footer.html b/doc/layouts/partials/site/footer.html index 5bec416c40..3aac35ebf2 100644 --- a/doc/layouts/partials/site/footer.html +++ b/doc/layouts/partials/site/footer.html @@ -16,7 +16,10 @@ {{- end }}
    - {{ $nav.lorawanNotice }} +
    + {{ $nav.lorawanNotice }} + +