├── cfg
├── cosmo.properties
├── lux.properties
├── yeti.properties
├── pulse.properties
├── morph.properties
└── common
│ └── vars
│ ├── strings-zh-cn.xml
│ ├── strings-zh-tw.xml
│ ├── strings-ko-kr.xml
│ ├── strings-ja-jp.xml
│ ├── strings-he-il.xml
│ ├── strings-is-is.xml
│ ├── strings-kk-kz.xml
│ ├── strings-ur-pk.xml
│ ├── strings-ar-eg.xml
│ ├── strings-en-ca.xml
│ ├── strings-en-gb.xml
│ ├── strings-en-us.xml
│ ├── strings-hi-in.xml
│ ├── strings-th-th.xml
│ ├── strings-tr-tr.xml
│ ├── strings-no-no.xml
│ ├── strings-da-dk.xml
│ ├── strings-fi-fi.xml
│ ├── strings-id-id.xml
│ ├── strings-nl-be.xml
│ ├── strings-nl-nl.xml
│ ├── strings-cs-cz.xml
│ ├── strings-sv-se.xml
│ ├── strings-vi-vn.xml
│ ├── strings-de-ch.xml
│ ├── strings-de-de.xml
│ ├── strings-hu-hu.xml
│ ├── strings-lv-lv.xml
│ ├── strings-ms-my.xml
│ ├── strings-sr-sp.xml
│ ├── strings-be-by.xml
│ ├── strings-bs-ba.xml
│ ├── strings-et-ee.xml
│ ├── strings-hr-hr.xml
│ ├── strings-lt-lt.xml
│ ├── strings-pl-pl.xml
│ ├── strings-sr-latn-me.xml
│ ├── strings-sr-latn-rs.xml
│ ├── strings-uk-ua.xml
│ ├── strings-ca-es.xml
│ ├── strings-el-gr.xml
│ ├── strings-es-es.xml
│ ├── strings-pt-br.xml
│ ├── strings-pt-pt.xml
│ ├── strings-ro-ro.xml
│ ├── strings-ru-ru.xml
│ ├── strings-sk-sk.xml
│ ├── strings-sl-si.xml
│ ├── strings-fr-be.xml
│ ├── strings-fr-ca.xml
│ ├── strings-fr-ch.xml
│ ├── strings-fr-fr.xml
│ ├── strings-bg-bg.xml
│ ├── strings-it-ch.xml
│ ├── strings-it-it.xml
│ └── strings-mk-mk.xml
├── sample
├── src
│ ├── full.png
│ ├── partial.png
│ ├── topbar.png
│ ├── breadcrumb.png
│ ├── extensions.png
│ ├── table-sort.png
│ ├── collapsible.png
│ ├── icons-menubar.png
│ ├── menubar-toc.png
│ ├── nav-pill-full.png
│ ├── search-result.png
│ ├── search-simple.png
│ ├── table-filter.png
│ ├── list-group-full.png
│ ├── scrollspy-list.webp
│ ├── search-complex.png
│ ├── table-paginate.png
│ ├── breadcrumb-divider.png
│ ├── icons-collapsible.png
│ ├── list-group-partial.png
│ ├── nav-pill-partial.png
│ ├── scrollspy-nav-pill.webp
│ └── scrollspy-list-group.webp
├── bootstrap-extension.dita
├── breadcrumb.dita
├── dark-mode.dita
├── badge.dita
├── bootstrap-table.dita
├── extension-points.dita
├── rtl.dita
├── list-group.dita
├── buttons.dita
├── grid.dita
├── figures.dita
├── document.ditamap
├── sass.dita
├── collapse.dita
├── search-box.dita
├── images.dita
└── button-group.dita
├── images
└── default-bootstrap.png
├── .prettierignore
├── .github
├── dita-ot
│ ├── html.ditaval
│ ├── favicon.svg
│ ├── theme.css
│ ├── footer.xml
│ └── html.xml
├── dependabot.yml
└── workflows
│ ├── prettier.yml
│ └── ci.yml
├── includes
├── bootstrap.icons.hdf.xml
├── script-only.hdf.xml
├── ftr.sidebar.example.xml
├── theme.hdf.xml
├── popovers.js
├── bootstrap.hdf.xml
├── bootstrap.hdf.rtl.xml
├── hdr.topbar.example.xml
├── hdr.sidebar.example.xml
├── dark-mode-toggler.js
├── ftr.content.example.xml
├── hdr.navbar.default.xml
└── hdr.navbar.example.xml
├── css
├── none-toc.css
├── menubar-toc.css
├── scrollspy-toc.css
├── side-toc.css
├── common-bootstrap.css
└── collapsible-toc.css
├── .lefthook.yml
├── .editorconfig
├── xsl
├── dita2html5-bootstrap.xsl
├── dita2html5-bootstrap-3.0.xsl
├── dita2html5-legacy-3.0_template.xsl
└── dita2html5-bootstrapImpl_template.xsl
├── .prettierrc.yml
├── Customization
└── xsl
│ ├── hi-d.xsl
│ ├── pagination.xsl
│ ├── popovers.xsl
│ ├── offcanvas.xsl
│ ├── collapse.xsl
│ ├── card.xsl
│ ├── accordion.xsl
│ ├── breadcrumb.xsl
│ ├── tables.xsl
│ ├── tabs.xsl
│ └── tooltips.xsl
├── .gitattributes
├── .gitignore
└── package.json
/cfg/cosmo.properties:
--------------------------------------------------------------------------------
1 | bootstrap.css.figure.image=img-fluid border
2 |
--------------------------------------------------------------------------------
/cfg/lux.properties:
--------------------------------------------------------------------------------
1 | bootstrap.css.figure.image=img-fluid border
2 |
--------------------------------------------------------------------------------
/cfg/yeti.properties:
--------------------------------------------------------------------------------
1 | bootstrap.css.figure.image=img-fluid border
2 |
--------------------------------------------------------------------------------
/sample/src/full.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/full.png
--------------------------------------------------------------------------------
/sample/src/partial.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/partial.png
--------------------------------------------------------------------------------
/sample/src/topbar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/topbar.png
--------------------------------------------------------------------------------
/sample/src/breadcrumb.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/breadcrumb.png
--------------------------------------------------------------------------------
/sample/src/extensions.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/extensions.png
--------------------------------------------------------------------------------
/sample/src/table-sort.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/table-sort.png
--------------------------------------------------------------------------------
/images/default-bootstrap.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/images/default-bootstrap.png
--------------------------------------------------------------------------------
/sample/src/collapsible.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/collapsible.png
--------------------------------------------------------------------------------
/sample/src/icons-menubar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/icons-menubar.png
--------------------------------------------------------------------------------
/sample/src/menubar-toc.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/menubar-toc.png
--------------------------------------------------------------------------------
/sample/src/nav-pill-full.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/nav-pill-full.png
--------------------------------------------------------------------------------
/sample/src/search-result.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/search-result.png
--------------------------------------------------------------------------------
/sample/src/search-simple.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/search-simple.png
--------------------------------------------------------------------------------
/sample/src/table-filter.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/table-filter.png
--------------------------------------------------------------------------------
/sample/src/list-group-full.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/list-group-full.png
--------------------------------------------------------------------------------
/sample/src/scrollspy-list.webp:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/scrollspy-list.webp
--------------------------------------------------------------------------------
/sample/src/search-complex.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/search-complex.png
--------------------------------------------------------------------------------
/sample/src/table-paginate.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/table-paginate.png
--------------------------------------------------------------------------------
/sample/src/breadcrumb-divider.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/breadcrumb-divider.png
--------------------------------------------------------------------------------
/sample/src/icons-collapsible.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/icons-collapsible.png
--------------------------------------------------------------------------------
/sample/src/list-group-partial.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/list-group-partial.png
--------------------------------------------------------------------------------
/sample/src/nav-pill-partial.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/nav-pill-partial.png
--------------------------------------------------------------------------------
/sample/src/scrollspy-nav-pill.webp:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/scrollspy-nav-pill.webp
--------------------------------------------------------------------------------
/sample/src/scrollspy-list-group.webp:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/infotexture/dita-bootstrap/HEAD/sample/src/scrollspy-list-group.webp
--------------------------------------------------------------------------------
/cfg/pulse.properties:
--------------------------------------------------------------------------------
1 | bootstrap.css.carousel=border border-primary-subtle pt-3 pb-2 px-1
2 | bootstrap.css.figure.image=img-fluid border
3 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | # This file specifies files that Prettier should not format
2 |
3 | backups
4 | build_dita2html5-bootstrap.xml
5 | cfg/common/vars/strings.xml
6 | css/custom.css
7 | out
8 |
--------------------------------------------------------------------------------
/.github/dita-ot/html.ditaval:
--------------------------------------------------------------------------------
1 |
2 |
3 |
6 |
--------------------------------------------------------------------------------
/cfg/morph.properties:
--------------------------------------------------------------------------------
1 | bootstrap.css.carousel=border rounded border-secondary-subtle shadow pt-3 pb-2 px-1
2 | bootstrap.css.carousel.indicators=border rounded-5 border-secondary-subtle bg-secondary p-1 shadow
3 | bootstrap.css.figure.image=img-fluid border rounded shadow
4 |
--------------------------------------------------------------------------------
/includes/bootstrap.icons.hdf.xml:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
--------------------------------------------------------------------------------
/includes/ftr.sidebar.example.xml:
--------------------------------------------------------------------------------
1 |
8 |
--------------------------------------------------------------------------------
/includes/theme.hdf.xml:
--------------------------------------------------------------------------------
1 |
2 |
12 |
--------------------------------------------------------------------------------
/.github/dependabot.yml:
--------------------------------------------------------------------------------
1 | version: 2
2 | updates:
3 | - package-ecosystem: npm
4 | directory: '/'
5 | schedule:
6 | interval: monthly
7 | time: '12:00'
8 | timezone: 'Europe/Berlin'
9 | open-pull-requests-limit: 10
10 | - package-ecosystem: github-actions
11 | directory: '/'
12 | schedule:
13 | interval: monthly
14 | time: '12:00'
15 | timezone: 'Europe/Berlin'
16 |
--------------------------------------------------------------------------------
/includes/popovers.js:
--------------------------------------------------------------------------------
1 | const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
2 | const tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
3 | return new bootstrap.Tooltip(tooltipTriggerEl);
4 | });
5 |
6 | const popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
7 | const popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
8 | return new bootstrap.Popover(popoverTriggerEl);
9 | });
10 |
--------------------------------------------------------------------------------
/css/none-toc.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
3 | * See the accompanying LICENSE file for applicable licenses.
4 | */
5 |
6 | /*! These values define the relative width of the
7 | * main content window compared with the sidebar-nav
8 | */
9 | .bs-container {
10 | display: grid;
11 | grid-template-areas: 'main';
12 | grid-template-columns: 1fr;
13 | gap: 1.5rem;
14 | }
15 |
16 | .nested0,
17 | article h1 {
18 | scroll-margin-top: 7.25rem;
19 | }
20 |
--------------------------------------------------------------------------------
/.lefthook.yml:
--------------------------------------------------------------------------------
1 | # Manage Git hooks with Lefthook
2 | # https://evilmartians.com/chronicles/lefthook-knock-your-teams-code-back-into-shape
3 | # https://github.com/evilmartians/lefthook/blob/master/docs/configuration.md
4 |
5 | pre-commit:
6 | parallel: true
7 | commands:
8 | prettier:
9 | glob: '*.{css,dita*,json,md,xml,xsl,yml}'
10 | run: prettier --write {staged_files}
11 | stage_fixed: true
12 | stylelint:
13 | glob: '*.{css}'
14 | run: stylelint {staged_files}
15 | stage_fixed: true
16 |
--------------------------------------------------------------------------------
/includes/bootstrap.hdf.xml:
--------------------------------------------------------------------------------
1 |
2 |
14 |
--------------------------------------------------------------------------------
/includes/bootstrap.hdf.rtl.xml:
--------------------------------------------------------------------------------
1 |
2 |
14 |
--------------------------------------------------------------------------------
/.editorconfig:
--------------------------------------------------------------------------------
1 | # editorconfig.org
2 |
3 | root = true
4 |
5 | [*]
6 | charset = utf-8
7 | # Leave line endings to Git: `core.autocrlf`
8 | # & `.gitattributes` text=auto normalization
9 | # end_of_line = lf
10 | indent_size = 2
11 | indent_style = space
12 | insert_final_newline = true
13 | trim_trailing_whitespace = true
14 |
15 | # Preserve trailing space in Markdown
16 | # > When you do want to insert a
8 | 下一个
9 | 以前的
10 | 跳到主要内容
11 | 跳到文档导航
12 | 跳到主题导航
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-zh-tw.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | 下一個
9 | 以前的
10 | 跳到主要內容
11 | 跳到文檔導航
12 | 跳到主題導航
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ko-kr.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | 다음
9 | 이전의
10 | 주요 콘텐츠로 건너뛰기
11 | 문서 탐색으로 건너뛰기
12 | 주제 탐색으로 건너뛰기
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ja-jp.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | 次
9 | 前
10 | メインコンテンツにスキップ
11 | ドキュメントナビゲーションにスキップ
12 | トピックナビゲーションにスキップ
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-he-il.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | הַבָּא
9 | קודם
10 | דלג לתוכן הראשי
11 | דלג לניווט בתיעוד
12 | דלג לניווט בנושא
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-is-is.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Næst
9 | Fyrri
10 | Fara í aðalefni
11 | Farðu í skjalaleiðsögn
12 | Fara í flakk um efni
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-kk-kz.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Келесі
9 | Алдыңғы
10 | Негізгі мазмұнға өту
11 | Құжаттар шарлауына өту
12 | Тақырыпты шарлауға өту
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ur-pk.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | اگلے
9 | پچھلا
10 | مرکزی مواد پر جائیں۔
11 | ڈاکس نیویگیشن پر جائیں۔
12 | موضوع نیویگیشن پر جائیں۔
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ar-eg.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | التالي
9 | سابق
10 | تخطي إلى المحتوى الرئيسي
11 | انتقل إلى ملاحة المستندات
12 | تخطي إلى موضوع الملاحة
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-en-ca.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Next
9 | Previous
10 | Skip to main content
11 | Skip to docs navigation
12 | Skip to topic navigation
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-en-gb.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Next
9 | Previous
10 | Skip to main content
11 | Skip to docs navigation
12 | Skip to topic navigation
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-en-us.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Next
9 | Previous
10 | Skip to main content
11 | Skip to docs navigation
12 | Skip to topic navigation
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-hi-in.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | अगला
9 | पहले का
10 | मुख्य विषयवस्तु में जाएं
11 | दस्तावेज़ नेविगेशन पर जाएं
12 | विषय नेविगेशन पर जाएं
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-th-th.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | ถัดไป
9 | ก่อนหน้า
10 | ข้ามไปที่เนื้อหาหลัก
11 | ข้ามไปที่การนำทางเอกสาร
12 | ข้ามไปที่การนำทางหัวข้อ
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-tr-tr.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Sonraki
9 | Öncesi
10 | Ana içeriğe geç
11 | Dokümanlar navigasyonuna atla
12 | Konu navigasyonuna atla
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-no-no.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Neste
9 | Tidligere
10 | Gå til hovedinnhold
11 | Hopp til dokumentnavigering
12 | Hopp til emnenavigering
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-da-dk.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Næste
9 | Tidligere
10 | Spring til hovedindhold
11 | Spring til dokumentnavigation
12 | Spring til emnenavigation
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-fi-fi.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Seuraava
9 | Edellinen
10 | Siirry pääsisältöön
11 | Siirry asiakirjanavigointiin
12 | Siirry aiheen navigointiin
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-id-id.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Berikutnya
9 | Sebelumnya
10 | Lewati ke konten utama
11 | Lewati ke navigasi dokumen
12 | Lewati ke navigasi topik
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-nl-be.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Volgende
9 | Vorig
10 | Ga naar hoofdinhoud
11 | Ga naar navigatie in documenten
12 | Ga naar onderwerpnavigatie
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-nl-nl.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Volgende
9 | Vorig
10 | Ga naar hoofdinhoud
11 | Ga naar navigatie in documenten
12 | Ga naar onderwerpnavigatie
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-cs-cz.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Další
9 | Předchozí
10 | Přejít na hlavní obsah
11 | Přejít na navigaci v dokumentech
12 | Přejít na navigaci k tématu
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-sv-se.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Nästa
9 | Tidigare
10 | Hoppa till huvudinnehållet
11 | Hoppa till dokumentnavigering
12 | Hoppa till ämnesnavigering
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-vi-vn.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Kế tiếp
9 | Trước
10 | Chuyển đến nội dung chính
11 | Chuyển đến điều hướng tài liệu
12 | Chuyển đến điều hướng chủ đề
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-de-ch.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Nächste
9 | Vorherige
10 | Zum Hauptinhalt springen
11 | Zur Dokumentennavigation springen
12 | Zur Themennavigation springen
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-de-de.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Nächste
9 | Vorherige
10 | Zum Hauptinhalt springen
11 | Zur Dokumentennavigation springen
12 | Zur Themennavigation springen
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-hu-hu.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Következő
9 | Előző
10 | Ugrás a fő tartalomhoz
11 | Ugrás a dokumentumok navigációjához
12 | Ugrás a téma navigációjához
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-lv-lv.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Nākamais
9 | Iepriekšējais
10 | Pāriet uz galveno saturu
11 | Pāriet uz dokumentu navigāciju
12 | Pāriet uz tēmas navigāciju
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ms-my.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Seterusnya
9 | Sebelumnya
10 | Langkau ke kandungan utama
11 | Langkau ke navigasi dokumen
12 | Langkau ke navigasi topik
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-sr-sp.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Следећи
9 | Претходна
10 | Пређи на главни садржај
11 | Прескочи на навигацију докумената
12 | Пређи на навигацију по теми
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-be-by.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Далей
9 | Папярэдні
10 | Перайсці да асноўнага зместу
11 | Перайсці да навігацыі па дакументах
12 | Перайсці да навігацыі па тэме
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-bs-ba.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Sljedeći
9 | Prethodno
10 | Preskoči na glavni sadržaj
11 | Preskoči na navigaciju dokumenata
12 | Preskoči na navigaciju tema
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-et-ee.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Edasi
9 | Eelmine
10 | Mine põhisisu juurde
11 | Jätke dokumentide navigeerimise juurde
12 | Liikuge teema navigeerimise juurde
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-hr-hr.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Sljedeći
9 | Previous
10 | Preskoči na glavni sadržaj
11 | Preskoči na navigaciju dokumenata
12 | Preskoči na navigaciju po temi
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-lt-lt.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Kitas
9 | Ankstesnis
10 | Pereiti prie pagrindinio turinio
11 | Pereiti prie dokumentų naršymo
12 | Pereiti prie temos naršymo
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-pl-pl.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Następny
9 | Poprzedni
10 | Przejdź do głównej zawartości
11 | Przejdź do nawigacji w dokumentach
12 | Przejdź do nawigacji tematu
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-sr-latn-me.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Следећи
9 | Претходна
10 | Пређи на главни садржај
11 | Прескочи на навигацију докумената
12 | Пређи на навигацију по теми
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-sr-latn-rs.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Следећи
9 | Претходна
10 | Пређи на главни садржај
11 | Прескочи на навигацију докумената
12 | Пређи на навигацију по теми
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-uk-ua.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Далі
9 | Попередній
10 | Перейти до основного вмісту
11 | Перейти до навігації з документами
12 | Перейти до навігації по темі
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ca-es.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Pròxim
9 | Anterior
10 | Saltar al contingut principal
11 | Saltar a la navegació de documents
12 | Saltar a la navegació per temes
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-el-gr.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Επόμενο
9 | Προηγούμενος
10 | Μετάβαση στο κύριο περιεχόμενο
11 | Μετάβαση στην πλοήγηση εγγράφων
12 | Μετάβαση στην πλοήγηση θέματος
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-es-es.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Próxima
9 | Previa
10 | Saltar al contenido principal
11 | Saltar a la navegación de documentos
12 | Saltar a la navegación por temas
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-pt-br.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Próxima
9 | Anterior
10 | Ir para o conteúdo principal
11 | Pular para a navegação de documentos
12 | Pular para a navegação do tópico
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-pt-pt.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Próxima
9 | Anterior
10 | Ir para o conteúdo principal
11 | Pular para a navegação de documentos
12 | Pular para a navegação do tópico
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ro-ro.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Următorul
9 | Anterior
10 | Treci la conținutul principal
11 | Treceți la navigarea documentelor
12 | Sari la navigarea subiectului
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-ru-ru.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Следующий
9 | Предыдущий
10 | Перейти к основному содержанию
11 | Перейти к навигации по документам
12 | Перейти к навигации по теме
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-sk-sk.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Ďalšie
9 | Predchádzajúce
10 | Preskočiť na hlavný obsah
11 | Preskočiť na navigáciu v dokumentoch
12 | Preskočiť na navigáciu v téme
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-sl-si.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Naslednji
9 | Prejšnji
10 | Preskoči na glavno vsebino
11 | Preskoči na navigacijo po dokumentih
12 | Preskoči na navigacijo po temah
13 |
14 |
--------------------------------------------------------------------------------
/includes/hdr.topbar.example.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
20 |
21 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-fr-be.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Suivante
9 | Précédente
10 | Passer au contenu principal
11 | Passer à la navigation dans les documents
12 | Passer à la navigation du sujet
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-fr-ca.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Suivante
9 | Précédente
10 | Passer au contenu principal
11 | Passer à la navigation dans les documents
12 | Passer à la navigation du sujet
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-fr-ch.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Suivante
9 | Précédente
10 | Passer au contenu principal
11 | Passer à la navigation dans les documents
12 | Passer à la navigation du sujet
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-fr-fr.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Suivante
9 | Précédente
10 | Passer au contenu principal
11 | Passer à la navigation dans les documents
12 | Passer à la navigation du sujet
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-bg-bg.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Следващия
9 | Предишна
10 | Преминете към основното съдържание
11 | Преминете към навигацията на документи
12 | Преминете към навигация по теми
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-it-ch.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Prossima
9 | Precedente
10 | Salta al contenuto principale
11 | Salta alla navigazione dei documenti
12 | Salta alla navigazione degli argomenti
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-it-it.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Prossima
9 | Precedente
10 | Salta al contenuto principale
11 | Salta alla navigazione dei documenti
12 | Salta alla navigazione degli argomenti
13 |
14 |
--------------------------------------------------------------------------------
/cfg/common/vars/strings-mk-mk.xml:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
8 | Следно
9 | Претходна
10 | Прескокнете до главната содржина
11 | Прескокнете до навигацијата со документи
12 | Прескокнете на навигација на тема
13 |
14 |
--------------------------------------------------------------------------------
/xsl/dita2html5-bootstrap.xsl:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
17 |
19 |
20 |
--------------------------------------------------------------------------------
/.github/dita-ot/favicon.svg:
--------------------------------------------------------------------------------
1 |
10 |
17 |
--------------------------------------------------------------------------------
/css/menubar-toc.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
3 | * See the accompanying LICENSE file for applicable licenses.
4 | */
5 |
6 | /*! This value keeps the sidebar-nav below the menubar-toc
7 | * main content window compared with the sidebar-nav
8 | */
9 | @media (min-width: 992px) {
10 | .bs-sidebar {
11 | top: 9rem;
12 | height: calc(100vh - 13rem);
13 | }
14 | .bs-scrollspy {
15 | top: 9rem;
16 | height: calc(100vh - 13rem);
17 | }
18 | }
19 |
20 | .nested0,
21 | article h1 {
22 | scroll-margin-top: 11.25rem;
23 | }
24 |
25 | .nested1,
26 | article h2,
27 | article h3,
28 | article h4,
29 | article [tabindex='0'],
30 | section {
31 | scroll-margin-top: 9rem;
32 | scroll-margin-bottom: 100px;
33 | }
34 |
--------------------------------------------------------------------------------
/xsl/dita2html5-bootstrap-3.0.xsl:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
9 |
21 |
23 |
24 |
--------------------------------------------------------------------------------
/.prettierrc.yml:
--------------------------------------------------------------------------------
1 | # Prettier Configuration File
2 |
3 | # https://prettier.io/docs/en/configuration.html
4 |
5 | arrowParens: avoid
6 | bracketSpacing: false
7 | endOfLine: lf
8 | htmlWhitespaceSensitivity: css
9 | printWidth: 120
10 | proseWrap: preserve
11 | requirePragma: false
12 | semi: true
13 | singleQuote: true
14 | tabWidth: 2
15 | trailingComma: all
16 | useTabs: false
17 | vueIndentScriptAndStyle: true
18 | xmlSelfClosingSpace: false
19 | xmlWhitespaceSensitivity: strict
20 |
21 | # Override configuration for certain files
22 | overrides:
23 | - files: '*.json'
24 | options:
25 | printWidth: 200
26 | - files: '*.xml'
27 | options:
28 | printWidth: 80
29 | - files: strings-*.xml
30 | options:
31 | printWidth: 100
32 | - files: '*.xsl'
33 | options:
34 | parser: xml
35 |
36 | plugins:
37 | - '@prettier/plugin-xml'
38 |
--------------------------------------------------------------------------------
/Customization/xsl/hi-d.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
13 |
14 |
15 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/.github/workflows/prettier.yml:
--------------------------------------------------------------------------------
1 | # This workflow checks code formatting
2 |
3 | name: Run Prettier
4 |
5 | # This action works with pull requests and pushes
6 |
7 | on:
8 | pull_request:
9 | push:
10 | branches:
11 | # Push events on development branch
12 | - develop
13 |
14 | jobs:
15 | prettier:
16 | runs-on: ubuntu-latest
17 |
18 | steps:
19 | - name: Checkout
20 | uses: actions/checkout@v5
21 | with:
22 | # Make sure the actual branch is checked out when running on pull requests
23 | ref: ${{ github.ref }}
24 |
25 | - name: Set up Node.js
26 | uses: actions/setup-node@v6
27 | with:
28 | node-version: '18.x'
29 | cache: 'npm'
30 |
31 | - name: Install dependencies
32 | run: |
33 | npm ci
34 |
35 | - name: Prettify code
36 | run: |
37 | npm run check
38 |
--------------------------------------------------------------------------------
/.gitattributes:
--------------------------------------------------------------------------------
1 | # Handle line endings per
14 |
15 |
16 |
17 |
20 |
21 |
23 |
24 |
25 |
26 |
27 |
28 |
30 |
32 |
33 |
34 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # This file specifies intentionally untracked files that Git should ignore
2 | # Created by https://www.gitignore.io/api/linux,macos,windows
3 |
4 | ### Linux ###
5 | *~
6 |
7 | # temporary files which can be created if a process still has a handle open of a deleted file
8 | .fuse_hidden*
9 |
10 | # KDE directory preferences
11 | .directory
12 |
13 | # Linux trash folder which might appear on any partition or disk
14 | .Trash-*
15 |
16 | # .nfs files are created when an open file is removed but is still being accessed
17 | .nfs*
18 |
19 | ### macOS ###
20 | *.DS_Store
21 | .AppleDouble
22 | .LSOverride
23 |
24 | # Icon must end with two \r
25 | Icon
26 |
27 | # Thumbnails
28 | ._*
29 |
30 | # Files that might appear in the root of a volume
31 | .DocumentRevisions-V100
32 | .fseventsd
33 | .Spotlight-V100
34 | .TemporaryItems
35 | .Trashes
36 | .VolumeIcon.icns
37 | .com.apple.timemachine.donotpresent
38 |
39 | # Directories potentially created on remote AFP share
40 | .AppleDB
41 | .AppleDesktop
42 | Network Trash Folder
43 | Temporary Items
44 | .apdisk
45 |
46 | ### Windows ###
47 | # Windows thumbnail cache files
48 | Thumbs.db
49 | ehthumbs.db
50 | ehthumbs_vista.db
51 |
52 | # Folder config file
53 | Desktop.ini
54 |
55 | # Recycle Bin used on file shares
56 | $RECYCLE.BIN/
57 |
58 | # Windows Installer files
59 | *.cab
60 | *.msi
61 | *.msm
62 | *.msp
63 |
64 | # Windows shortcuts
65 | *.lnk
66 |
67 | # End of https://www.gitignore.io/api/linux,macos,windows
68 |
69 | build_dita2html5-bootstrap.xml
70 | xsl/dita2html5-bootstrapImpl.xsl
71 | xsl/dita2html5-legacy-3.0.xsl
72 | node_modules
73 |
--------------------------------------------------------------------------------
/.github/dita-ot/footer.xml:
--------------------------------------------------------------------------------
1 |
2 |
53 |
54 |
--------------------------------------------------------------------------------
/.github/dita-ot/html.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
9 |
10 |
11 |
14 |
37 |
38 |
39 |
--------------------------------------------------------------------------------
/.github/workflows/ci.yml:
--------------------------------------------------------------------------------
1 | name: CI
2 | 'on':
3 | push:
4 | branches:
5 | - master
6 | - develop
7 | workflow_dispatch:
8 |
9 | jobs:
10 | build-dita:
11 | name: Build DITA
12 | runs-on: ubuntu-latest
13 | steps:
14 | - name: Git checkout
15 | uses: actions/checkout@v5
16 |
17 | - name: Calculate short SHA
18 | uses: benjlevesque/short-sha@v3.0
19 | id: short-sha
20 | with:
21 | length: 7
22 | - run: echo $SHA
23 | env:
24 | SHA: ${{ steps.short-sha.outputs.sha }}
25 | - run: echo $SHA
26 | env:
27 | SHA: ${{ env.SHA }}
28 |
29 | - name: Build Bootstrap
30 | uses: dita-ot/dita-ot-action@4.3
31 | with:
32 | install: |
33 | apt-get update -q
34 | export DEBIAN_FRONTEND=noninteractive
35 | apt-get install -qy --no-install-recommends nodejs
36 | nodejs -v
37 | plugins: |
38 | fox.jason.extend.css
39 | https://github.com/infotexture/dita-bootstrap/archive/develop.zip
40 | net.infotexture.dita-bootstrap.lunr
41 | fox.jason.prismjs
42 | fox.jason.favicon
43 | fox.jason.open-graph
44 | https://github.com/jason-fox/fox.jason.theme-switcher/archive/master.zip
45 | project: .github/dita-ot/html.xml
46 |
47 | - name: Deploy HTML 🚀
48 | uses: JamesIves/github-pages-deploy-action@v4.7.3
49 | with:
50 | token: ${{ secrets.GITHUB_TOKEN }}
51 | branch: gh-pages # The branch the action should deploy to.
52 | folder: out/html # The folder the action should deploy.
53 | commit-message: '🚀 Deploy ${{ env.SHA }} to GitHub Pages'
54 | git-config-name: 'GitHub Action'
55 | git-config-email: 'action@github.com'
56 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "dita-bootstrap",
3 | "description": "DITA Open Toolkit plug-in for HTML5 output with extensible Bootstrap style",
4 | "homepage": "https://infotexture.github.io/dita-bootstrap",
5 | "repository": {
6 | "type": "git",
7 | "url": "https://github.com/infotexture/dita-bootstrap.git"
8 | },
9 | "license": "Apache-2.0",
10 | "scripts": {
11 | "check": "npm run prettier-check && npm run stylelint",
12 | "fix:style": "stylelint \"css/*.css\" .github/dita-ot/theme.css --fix",
13 | "fmt": "npm run format",
14 | "format": "prettier --write \"**/*.{css,dita*,json,md,xml,xsl,yml}\"",
15 | "format:css": "prettier --write \"**/*.css\"",
16 | "format:dita": "prettier --write \"**/*.dita\"",
17 | "format:xml": "prettier --write \"**/*.xml\"",
18 | "format:xsl": "prettier --write \"**/*.xsl\"",
19 | "prettier": "prettier --write \"**/*.{css,dita*,json,md,xml,xsl,yml}\"",
20 | "prettier-check": "prettier --check \"**/*.{css,dita*,json,md,xml,xsl,yml}\"",
21 | "stylelint": "stylelint \"css/*.css\" .github/dita-ot/theme.css",
22 | "test": "prettier --list-different \"**/*.{css,dita*,json,md,xml,xsl,yml}\""
23 | },
24 | "stylelint": {
25 | "extends": [
26 | "stylelint-config-twbs-bootstrap"
27 | ],
28 | "ignoreFiles": [
29 | "css/custom.css"
30 | ],
31 | "rules": {
32 | "declaration-no-important": null,
33 | "selector-max-id": 1,
34 | "selector-max-type": 3,
35 | "selector-no-qualifying-type": null,
36 | "@stylistic/number-leading-zero": "always",
37 | "@stylistic/string-quotes": "single"
38 | }
39 | },
40 | "devDependencies": {
41 | "@prettier/plugin-xml": "3.4.2",
42 | "bootstrap": "^5.3.8",
43 | "bootstrap-icons": "^1.13.1",
44 | "bootswatch": "^5.3.8",
45 | "lefthook": "^2.0.2",
46 | "prettier": "3.6.2",
47 | "stylelint": "^16.25.0",
48 | "stylelint-config-twbs-bootstrap": "^16.1.0"
49 | }
50 | }
51 |
--------------------------------------------------------------------------------
/css/scrollspy-toc.css:
--------------------------------------------------------------------------------
1 | .bs-scrollspy {
2 | grid-area: scrollspy;
3 | }
4 |
5 | @media (max-width: 991.98px) {
6 | .bs-main {
7 | grid-template-areas: 'content';
8 | }
9 |
10 | .bs-scrollspy {
11 | display: none;
12 | }
13 | }
14 |
15 | @media (min-width: 992px) {
16 | .bs-main {
17 | grid-template-areas: 'content scrollspy';
18 | grid-template-columns: 4fr 1fr;
19 | }
20 |
21 | .bs-scrollspy {
22 | position: sticky;
23 | top: 5.25rem;
24 | right: 0;
25 | z-index: 2;
26 | height: calc(100vh - 6rem);
27 | overflow-y: auto;
28 | }
29 | }
30 |
31 | .bs-scrollspy nav {
32 | font-size: 0.875rem;
33 | }
34 |
35 | .bs-scrollspy nav ul {
36 | padding-left: 0;
37 | margin-bottom: 0;
38 | list-style: none;
39 | }
40 |
41 | .bs-scrollspy nav ul ul {
42 | padding-left: 1rem;
43 | }
44 |
45 | .bs-scrollspy nav[dir='rtl'] ul ul {
46 | padding-right: 1rem;
47 | padding-left: 0;
48 | }
49 |
50 | .bs-scrollspy nav a {
51 | display: block;
52 | padding: 0.125rem 0 0.125rem 0.75rem;
53 | color: var(--bs-body-color);
54 | text-decoration: none;
55 | border-left: 0.125rem solid transparent;
56 | }
57 |
58 | .bs-scrollspy nav a:hover,
59 | .bs-scrollspy nav a.active {
60 | color: var(--bs-link-hover-color);
61 | border-left-color: var(--bs-primary);
62 | }
63 |
64 | .bs-scrollspy nav[dir='rtl'] a.active,
65 | .bs-scrollspy nav[dir='rtl'] a:hover {
66 | border-right-color: var(--bs-primary);
67 | border-right-style: solid;
68 | border-left-color: transparent;
69 | }
70 |
71 | .bs-scrollspy nav a.nav-link:hover,
72 | .bs-scrollspy nav a.nav-link.active {
73 | border-right-color: transparent;
74 | border-left-color: transparent;
75 | }
76 |
77 | .bs-scrollspy nav a.active {
78 | font-weight: 500;
79 | }
80 |
81 | .bs-scrollspy nav a code {
82 | font: inherit;
83 | }
84 |
85 | .nested1,
86 | article h2,
87 | article h3,
88 | article h4,
89 | article [tabindex='0'] {
90 | scroll-margin-bottom: 100px;
91 | }
92 |
93 | section {
94 | scroll-margin-top: 5.25rem;
95 | }
96 |
--------------------------------------------------------------------------------
/sample/bootstrap-extension.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
14 |
15 | Bootstrap Extension
16 | Incorporate the Bootstrap Extension library as a separate plug-in to support additional features that are
17 | not included in vanilla Bootstrap 5.x.
18 |
19 |
20 | The DITA Bootstrap Extension is a DITA-OT plug-in that incorporates the
21 | Bootstrap Extension library
22 | and adds the necessary CSS and JavaScript — for sliders, whitebox galleries, parallax components, greyscale
23 | images and additional styling options such as new colors.
24 | For the full documentation, see
25 | infotexture.github.io/dita-bootstrap.extension .
30 |
31 |
32 | Additional Bootstrap Extension Colors
33 |
35 |
36 |
37 | Installing the <term>DITA Bootstrap Extension</term> plug-in
38 | Use the dita command to add the DITA Bootstrap Extension
39 | plug-in to your DITA Open Toolkit installation:
40 | dita install net.infotexture.dita-bootstrap.extension
43 |
44 |
45 |
--------------------------------------------------------------------------------
/Customization/xsl/popovers.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
19 | popover
20 |
21 |
30 |
31 |
33 |
34 |
35 |
36 |
38 |
39 |
40 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
54 |
55 |
56 |
--------------------------------------------------------------------------------
/css/side-toc.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
3 | * See the accompanying LICENSE file for applicable licenses.
4 | */
5 |
6 | /*! These values define the relative width of the
7 | * main content window compared with the sidebar-nav
8 | */
9 |
10 | .bs-container {
11 | display: grid;
12 | grid-template-areas: 'sidebar main';
13 | grid-template-columns: 1fr 5fr;
14 | gap: 1.5rem;
15 | }
16 |
17 | .bs-sidebar {
18 | grid-area: sidebar;
19 | }
20 |
21 | .bs-main {
22 | grid-area: main;
23 | }
24 |
25 | .bs-content {
26 | grid-area: content;
27 | min-width: 1px;
28 | }
29 |
30 | .bs-fixed-sidetoc {
31 | height: calc(100vh - 10rem);
32 | }
33 | .bs-fixed-footer {
34 | height: auto;
35 | padding-top: 0.25rem;
36 | }
37 |
38 | @media (max-width: 991.98px) {
39 | .bs-main {
40 | margin-inline: auto;
41 | }
42 | .bs-fixed-sidetoc {
43 | height: calc(100vh);
44 | }
45 | }
46 |
47 | @media (min-width: 768px) {
48 | .bs-main {
49 | display: grid;
50 | grid-template-areas: 'content';
51 | grid-template-rows: auto auto 1fr;
52 | gap: inherit;
53 | }
54 | }
55 |
56 | @media (min-width: 992px) {
57 | .bs-main {
58 | grid-template-areas: 'content';
59 | grid-template-rows: auto 1fr;
60 | }
61 |
62 | .codeblock {
63 | min-width: 100%;
64 | max-width: calc(80vw - 2rem);
65 | }
66 |
67 | .bs-sidebar {
68 | position: sticky;
69 | top: 5rem;
70 | display: block !important;
71 | height: calc(100vh - 6rem);
72 | padding-left: 0.25rem;
73 | margin-left: -0.25rem;
74 | }
75 | }
76 |
77 | @media (max-width: 991.98px) {
78 | .bd-navbar .bd-navbar-toggle {
79 | width: 4.25rem;
80 | }
81 |
82 | .bs-container {
83 | grid-template-columns: 0fr 1fr;
84 | }
85 |
86 | .codeblock,
87 | .table,
88 | .tablist,
89 | .note,
90 | .carousel,
91 | .section,
92 | .shortdesc,
93 | .topic {
94 | max-width: calc(100vw - 4rem);
95 | }
96 |
97 | .bs-sidebar .offcanvas-lg {
98 | border-right-color: var(--bs-border-color);
99 | }
100 | }
101 |
102 | .nested0 {
103 | margin-top: 0;
104 | }
105 |
106 | .nested1 {
107 | margin-top: 1em;
108 | }
109 |
110 | .nested0,
111 | article h1 {
112 | scroll-margin-top: 7.25rem;
113 | }
114 |
115 | .nested1,
116 | article h2,
117 | article h3,
118 | article h4,
119 | article [tabindex='0'] {
120 | scroll-margin-top: 5.25rem;
121 | }
122 |
--------------------------------------------------------------------------------
/includes/dark-mode-toggler.js:
--------------------------------------------------------------------------------
1 | /*!
2 | * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
3 | * Copyright 2011-2023 The Bootstrap Authors
4 | * Licensed under the Creative Commons Attribution 3.0 Unported License.
5 | */
6 |
7 | (() => {
8 | 'use strict';
9 |
10 | const getStoredTheme = () => localStorage.getItem('theme');
11 | const setStoredTheme = theme => localStorage.setItem('theme', theme);
12 |
13 | const getPreferredTheme = () => {
14 | const storedTheme = getStoredTheme();
15 | if (storedTheme) {
16 | return storedTheme;
17 | }
18 |
19 | return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
20 | };
21 |
22 | const setTheme = theme => {
23 | if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
24 | document.documentElement.setAttribute('data-bs-theme', 'dark');
25 | } else {
26 | document.documentElement.setAttribute('data-bs-theme', theme);
27 | }
28 | };
29 |
30 | setTheme(getPreferredTheme());
31 |
32 | const showActiveTheme = (theme, focus = false) => {
33 | const themeSwitcher = document.querySelector('#bd-color-mode');
34 |
35 | if (!themeSwitcher) {
36 | return;
37 | }
38 |
39 | const activeThemeIcon = document.querySelector('.theme-icon-active use');
40 | const btnToActive = document.querySelector(`[data-bs-theme-value="${theme}"]`);
41 |
42 | document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
43 | element.classList.remove('active');
44 | element.setAttribute('aria-pressed', 'false');
45 | });
46 |
47 | btnToActive.classList.add('active');
48 | btnToActive.setAttribute('aria-pressed', 'true');
49 |
50 | if (focus) {
51 | themeSwitcher.focus();
52 | }
53 | };
54 |
55 | window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
56 | const storedTheme = getStoredTheme();
57 | if (storedTheme !== 'light' && storedTheme !== 'dark') {
58 | setTheme(getPreferredTheme());
59 | }
60 | });
61 |
62 | window.addEventListener('DOMContentLoaded', () => {
63 | showActiveTheme(getPreferredTheme());
64 |
65 | document.querySelectorAll('[data-bs-theme-value]').forEach(toggle => {
66 | toggle.addEventListener('click', () => {
67 | const theme = toggle.getAttribute('data-bs-theme-value');
68 | setStoredTheme(theme);
69 | setTheme(theme);
70 | showActiveTheme(theme, true);
71 | });
72 | });
73 | });
74 | })();
75 |
--------------------------------------------------------------------------------
/css/common-bootstrap.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
3 | * See the accompanying LICENSE file for applicable licenses.
4 | */
5 |
6 | :root {
7 | --dita-prussian-blue: #1d365d;
8 | --dita-maroon: #800000;
9 | --dita-violet: var(--bs-purple);
10 | }
11 |
12 | .list-group-item.active,
13 | .nav-link.active,
14 | [data-bs-theme='dark'] {
15 | --dita-prussian-blue: #6a91cf;
16 | --dita-violet: #cc99cd;
17 | --dita-maroon: #ff7676;
18 | }
19 |
20 | .list-group-item {
21 | border-radius: 0;
22 | }
23 |
24 | .tab-pane pre[class*='language-'] {
25 | margin: 0;
26 | }
27 |
28 | .d-dark,
29 | .d-light {
30 | display: none;
31 | }
32 |
33 | [data-bs-theme='light'] .d-light {
34 | display: inherit;
35 | }
36 |
37 | [data-bs-theme='light'] .d-auto {
38 | display: none;
39 | }
40 |
41 | [data-bs-theme='dark'] .d-dark {
42 | display: inherit;
43 | }
44 |
45 | [data-bs-theme='dark'] .d-auto {
46 | display: none;
47 | }
48 |
49 | @media (prefers-color-scheme: dark) {
50 | :root {
51 | --dita-prussian-blue: #6a91cf;
52 | --dita-violet: #cc99cd;
53 | --dita-maroon: #ff7676;
54 | }
55 |
56 | [data-bs-theme='light'] {
57 | --dita-prussian-blue: #1d365d;
58 | --dita-maroon: #800000;
59 | --dita-violet: var(--bs-purple);
60 | }
61 | }
62 |
63 | .syntaxdiagram {
64 | color: var(--dita-maroon);
65 | }
66 |
67 | .numcharref,
68 | .parameterentity,
69 | .textentity,
70 | .xmlatt,
71 | .xmlelement,
72 | .xmlnsname,
73 | .xmlpi {
74 | font-family: var(--bs-font-monospace);
75 | color: var(--dita-violet);
76 | overflow-wrap: break-word;
77 | }
78 |
79 | .cmdname,
80 | .codeph,
81 | .filepath,
82 | .option,
83 | .parmname {
84 | font-family: var(--bs-font-monospace);
85 | color: var(--bs-code-color);
86 | overflow-wrap: break-word;
87 | }
88 |
89 | .cmdname,
90 | .parmname {
91 | font-weight: 700;
92 | color: var(--dita-prussian-blue);
93 | }
94 |
95 | .boolean {
96 | color: var(--bs-green);
97 | }
98 |
99 | .state {
100 | color: var(--bs-red);
101 | }
102 |
103 | .navbar-brand > svg {
104 | margin: 4px 6px;
105 | vertical-align: text-top;
106 | }
107 |
108 | .bs-container {
109 | margin: 3rem auto;
110 | }
111 |
112 | .bs-sidebar-nav {
113 | overflow: auto;
114 | }
115 |
116 | [type='search']::placeholder {
117 | color: rgba(var(--bs-body-color-rgb), 0.3);
118 | }
119 |
120 | .search-box:hover,
121 | .search-box:focus-visible {
122 | outline: -webkit-focus-ring-color auto 1px;
123 | }
124 |
--------------------------------------------------------------------------------
/css/collapsible-toc.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
3 | * See the accompanying LICENSE file for applicable licenses.
4 | */
5 |
6 | /*! These values define the relative width of the
7 | * main content window compared with the sidebar-nav
8 | */
9 |
10 | .bd-links {
11 | padding-left: none;
12 | overflow: auto;
13 | font-weight: 600;
14 | }
15 |
16 | .bd-links a {
17 | padding: 0.1875rem 0.5rem;
18 | margin-top: 0.125rem;
19 | color: var(--bs-body-color);
20 | text-decoration: none;
21 | }
22 |
23 | .bd-links a:hover {
24 | color: var(--bs-link-hover-color);
25 | }
26 |
27 | .bd-links span {
28 | color: var(--bs-body-color);
29 | }
30 |
31 | .bd-links span:hover {
32 | color: var(--bs-link-hover-color);
33 | }
34 |
35 | .bd-links span.bd-divider:hover {
36 | color: var(--bs-body-color);
37 | }
38 |
39 | @media (min-width: 768px) {
40 | .bd-links {
41 | position: sticky;
42 | display: block !important;
43 | padding: 0 0.25rem;
44 | }
45 | }
46 |
47 | @media (max-width: 767.98px) {
48 | .bd-links > ul {
49 | padding: 1.5rem 0.75rem;
50 | background-color: var(--bs-body-bg);
51 | }
52 | }
53 |
54 | .bd-links li li a {
55 | font-size: 0.875em;
56 | }
57 |
58 | .bd-divider {
59 | font-size: 0.875em;
60 | font-weight: 600;
61 | }
62 |
63 | .bd-links .btn {
64 | padding: 0.25rem !important;
65 | font-weight: 600;
66 | color: var(--bs-body-color);
67 | background-color: transparent;
68 | box-shadow: none;
69 | }
70 |
71 | .bd-links svg:hover {
72 | color: var(--bs-link-hover-color);
73 | }
74 |
75 | .bd-links .ps-2 {
76 | padding-left: 0.5rem !important;
77 | }
78 |
79 | [dir='rtl'] .bd-links .ps-2 {
80 | padding-right: 0.5rem !important;
81 | padding-left: 0 !important;
82 | }
83 |
84 | .bd-links .ps-3 {
85 | padding-left: 0.75rem !important;
86 | }
87 |
88 | [dir='rtl'] .bd-links .ps-3 {
89 | padding-right: 0.75rem !important;
90 | padding-left: 0 !important;
91 | }
92 |
93 | .bd-links .ps-4 {
94 | padding-left: 1rem !important;
95 | }
96 |
97 | [dir='rtl'] .bd-links .ps-4 {
98 | padding-right: 1rem !important;
99 | padding-left: 0 !important;
100 | }
101 |
102 | [dir='rtl'] .bd-links svg {
103 | transform: rotate(180deg);
104 | }
105 |
106 | .bd-links .btn[aria-expanded='true'] svg {
107 | transform: rotate(90deg);
108 | }
109 |
110 | .bd-links .btn:focus-visible {
111 | outline: -webkit-focus-ring-color auto 1px;
112 | }
113 |
114 | .bd-links .active {
115 | font-weight: 600;
116 | color: var(--bs-body-color);
117 | }
118 |
--------------------------------------------------------------------------------
/sample/breadcrumb.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Breadcrumb
13 | Indicate the current page’s location within a navigational hierarchy that automatically adds separators via
14 | CSS.
15 |
16 |
17 |
18 | Breadcrumb
19 | --args.breadcrumbs --bootstrap.breadcrumb.divider
22 |
23 |
24 |
25 |
26 |
28 |
29 | Adding breadcrumbs
30 | Breadcrumbs are not included by default. You can add a breadcrumb component to each page by setting the
31 | parameter --args.breadcrumbs =yes
32 |
33 | dita --input =path/to/your.ditamap \
35 | --format =html5-bootstrap \
36 | --args.breadcrumbs =yes
38 |
39 | Dividers
40 | Dividers are automatically added via CSS. They can be changed by setting the parameter
41 | --bootstrap.breadcrumb.divider .
42 |
43 |
45 | dita --input =path/to/your.ditamap \
47 | --format =html5-bootstrap \
48 | --args.breadcrumbs =yes \
49 | --bootstrap.breadcrumb.divider ='>'
51 |
52 |
53 |
--------------------------------------------------------------------------------
/Customization/xsl/offcanvas.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
19 |
21 | h6
22 | h
23 |
24 |
25 |
27 |
28 | offcanvas
29 |
31 |
32 |
33 |
34 |
42 |
43 |
45 |
47 |
48 |
49 |
50 |
57 |
61 |
62 |
63 |
--------------------------------------------------------------------------------
/Customization/xsl/collapse.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
20 |
21 |
22 |
23 |
24 |
25 |
27 |
28 |
30 |
31 |
33 |
34 |
35 |
36 |
37 |
38 |
42 |
44 |
45 |
46 |
47 |
52 |
53 |
54 |
55 |
56 |
63 |
69 |
70 |
71 |
--------------------------------------------------------------------------------
/Customization/xsl/card.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
24 |
25 |
26 |
31 |
32 |
35 |
37 |
38 |
39 |
40 |
41 |
43 | h6
44 | h
47 | h
48 |
49 |
50 |
51 |
58 |
59 |
61 |
62 |
64 |
66 |
67 |
68 |
--------------------------------------------------------------------------------
/sample/dark-mode.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Dark Mode
13 | Bootstrap 5.3 supports color modes, starting with dark mode. You can implement your own color mode toggler onto a static menu bar and apply the different color modes as you see fit. Bootstrap supports a light mode (default) and now dark mode. Color modes can be toggled globally on the html element, or on specific components and elements, thanks to the data-bs-theme attribute.
17 |
18 |
19 |
20 | Dark Mode
21 | Nav Bar
22 | data-bs-theme
24 |
25 |
26 |
27 |
28 | Example
29 | To add a color mode toggler to the menu bar, add a series of button elements with the attributes data-bs-theme="light" or data-bs-theme="dark" as shown here.
32 | <ul class="navbar-nav ms-auto">
33 | <li class="nav-item dropdown">
34 | <a href="#" class="nav-link py-2 px-0 px-lg-2 dropdown-toggle d-flex align-items-center show"
35 | id="bd-color-mode" data-bs-toggle="dropdown" aria-expanded="false"
36 | data-bs-display="static">Toggle theme</a>
37 | <ul class="dropdown-menu dropdown-menu-end"
38 | aria-labelledby="bd-color-mode" style="--bs-dropdown-min-width: 6rem;"
39 | data-bs-popper="static">
40 | <li>
41 | <button type="button" class="dropdown-item d-flex align-items-center"
42 | data-bs-theme-value="light"> Light
43 | </button>
44 | </li>
45 | <li>
46 | <button type="button" class="dropdown-item d-flex align-items-center"
47 | data-bs-theme-value="dark"> Dark
48 | </button>
49 | </li>
50 | <li>
51 | <button type="button" class="dropdown-item d-flex align-items-center"
52 | data-bs-theme-value="auto"> Auto
53 | </button>
54 | </li>
55 | </ul>
56 | </li>
57 | </ul>
58 | The plug-in includes a sample color mode toggler in its
59 | header navbar .
64 |
65 |
66 |
67 |
--------------------------------------------------------------------------------
/sample/badge.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Badges
13 | Documentation and examples for badges, Bootstrap’s small count and labeling component.
14 |
15 |
16 |
17 | Badges
18 | CSS
19 | outputclass
21 | ph
23 |
24 |
25 |
26 |
27 | Example
28 | Badges scale to match the size of the immediate parent element by using relative font sizing and
29 | em units. As of v5, badges no longer have focus or hover styles for links.
30 |
31 |
32 |
33 | Example heading New
34 | Example heading New
35 | Example heading New
36 | Example heading New
37 | Example heading New
38 | Example heading New
39 |
40 |
41 | <title>Example Heading <ph outputclass="bg-secondary">New</ph></title>
42 | <p>Example Text <ph outputclass="bg-secondary">New</ph></p>
43 |
44 | Background colors
45 | Set a background-color with contrasting foreground color with Bootstrap’s text-bg-{color} helpers. Previously it was required to manually pair your choice of outputclass text-{color} and bg-{color} utilities for styling, which you still may use if you prefer.
49 |
50 |
51 | Primary
52 | Secondary
53 | Success
54 | Danger
55 | Warning
56 | Info
57 | Light
58 | Dark
59 |
60 | <ph outputclass="text-bg-primary">Primary</ph>
61 | <ph outputclass="text-bg-secondary">Secondary</ph>
62 | <ph outputclass="text-bg-success">Success</ph>
63 | <ph outputclass="text-bg-danger">Danger</ph>
64 | <ph outputclass="text-bg-warning">Warning</ph>
65 | <ph outputclass="text-bg-info">Info</ph>
66 | <ph outputclass="text-bg-light">Light</ph>
67 | <ph outputclass="text-bg-dark">Dark</ph>
68 |
69 |
70 |
--------------------------------------------------------------------------------
/sample/bootstrap-table.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Dynamic Tables
13 | Documentation and examples for creating dynamic tables with the Bootstrap Table extension.
14 |
15 |
16 |
17 | Bootstrap Table
18 | otherprops table
21 |
22 |
23 |
24 | The DITA Bootstrap Table plug-in is a DITA-OT plug-in that incorporates the
25 | Bootstrap Table library
26 | and adds the necessary CSS and JavaScript for dynamic tables with search, sort, and pagination functions.
27 | For the full documentation, see
28 | infotexture.github.io/dita-bootstrap.table .
33 | If you just want to style DITA tables with the standard Bootstrap table styles, you don’t need a
34 | separate plug-in. See DITA Bootstrap plug-in supports.
36 |
37 | Installing the <term>DITA Bootstrap Table</term> plug-in
38 | Use the dita command to add the DITA Bootstrap Table
39 | plug-in to your DITA Open Toolkit installation:
40 | dita install net.infotexture.dita-bootstrap.table
43 |
44 |
45 | Search and Filtering
46 | Add table otherprops="search" to filter the results based on a search term.
47 |
48 |
49 | Example table with the results filtering on "Bear"
50 |
52 | <table otherprops="search">
53 | ...etc
54 | </table>
55 |
56 | Pagination
57 | Add table otherprops="pagination" to add a pagination footer to a large table.
58 |
59 |
60 | Paginated table with 140 rows reduced to ten
61 |
63 | <table otherprops="pagination">
64 | ...etc
65 | </table>
66 |
67 | Sorting
68 | Add table otherprops="sortable" to allow each column to be sorted dynamically.
69 |
70 |
71 | Sorted table using reverse alphabetical order
72 |
74 | <table otherprops="sortable">
75 | ...etc
76 | </table>
77 |
78 |
79 |
80 |
81 |
--------------------------------------------------------------------------------
/sample/extension-points.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Extension Points
13 | These extension points enable you to extend DITA Bootstrap. You can add Ant targets or override XSLT processing steps within the html5-bootstrap transformation.
16 |
17 |
18 |
19 | bootstrap.process.pre bootstrap.process.post dita.xsl.html5-bootstrap extend.css.process.pre extend.css.process extend.css.process.post
26 |
27 |
28 |
29 |
30 | Extending Bootstrap
31 | Bootstrap is designed to be extensible. Additional CSS and JavaScript libraries can be added to the generated
32 | HTML pages to allow for new Bootstrap components and extend Bootstrap classes. Similarly, the DITA
33 | Bootstrap plug-in itself can be extended to process DITA files to create valid Bootstrap HTML to drive
34 | these custom components.
35 |
36 | The Bootstrap HTML can be altered using the following extension points:
40 |
41 |
42 | bootstrap.process.pre Runs an Ant target before the Bootstrap HTML generation process
44 |
45 |
46 | bootstrap.process.post Runs an Ant target after the Bootstrap HTML generation process
48 |
49 |
50 | dita.xsl.html5-bootstrap Overrides the default DITA Bootstrap transformation. The referenced file is integrated directly into the XSLT step that generates the HTML.
53 |
54 |
55 | Additionally the Bootstrap CSS can be augmented using the following extension points:
59 |
60 |
61 | extend.css.process.pre Runs an Ant target before the Bootstrap CSS generation process allowing a
63 | user to append additional CSS.
64 |
65 |
66 | extend.css.process
68 | Runs an Ant target immediately before the Bootstrap CSS generation process, allowing a user to append additional CSS which overrides the previous step.
69 |
70 |
71 |
72 | extend.css.process.post Runs an Ant target after the Bootstrap CSS generation process.
74 |
75 |
76 |
77 |
78 |
--------------------------------------------------------------------------------
/sample/rtl.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Right-to-Left Language Support
13 | You can enable support for right-to-left (RTL) text via the default language setting,
14 | xml:lang attribute, or dir attribute.
15 |
16 |
17 |
18 | RTL
19 | --bidi.include --defaultLanguage xml:lang
23 |
24 |
25 |
26 |
27 | Loading the Right-to-Left stylesheet
28 | By default the Bootstrap plugin loads standard left-to-right CSS. To enable support for right-to-left
29 | languages, DITA-OT must load the RTL version of the Bootstrap CSS. This is done automatically if the
30 | --defaultLanguage is set to an RTL language. Alternatively, you can manually enable RTL
31 | support using the --bidi.include parameter:
32 | dita --input =path/to/your.ditamap \
34 | --format =html5-bootstrap \
35 | --bidi.include =yes
37 |
38 | Using LTR and RTL languages in the same topic
39 | The overall layout is always defined by the --defaultLanguage parameter.
40 | To render an article as RTL across the page, set the topic xml:lang=".." to an RTL
41 | language.
42 | <topic id="..." xml:lang="ar">
43 | Additionally, within any topic , setting the dir attribute on any DITA
44 | element thereafter will cause the layout to be recalculated for the enclosed block only.
45 |
46 |
47 |
48 |
49 |
50 | عنوان البطاقة
51 | بعض الأمثلة السريعة للنص الذي سيتم بناؤه على عنوان البطاقة وتشكيل الجزء الأكبر من محتوى البطاقة.
53 | اذهب لمكان ما
54 |
55 |
56 |
57 |
58 | <bodydiv outputclass="row" dir="rtl">
59 | <bodydiv outputclass="col">
60 | <section outputclass="card w-50" xml:lang="ar">
61 | <title outputclass="h5">عنوان البطاقة</title>
62 | <image outputclass="card-img-top" href="..." />
63 | <p>بعض الأمثلة السريعة للنص الذي سيتم بناؤه على عنوان البطاقة وتشكيل الجزء الأكبر من محتوى البطاقة.</p>
64 | <xref outputclass="btn-primary" href="#">اذهب لمكان ما</xref>
65 | </section>
66 | </bodydiv>
67 | </bodydiv>
68 |
69 |
70 |
--------------------------------------------------------------------------------
/Customization/xsl/accordion.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
19 |
23 |
24 |
25 |
26 |
34 |
35 |
36 |
43 |
44 |
45 |
46 |
48 | h6
49 | h
50 |
51 |
52 |
53 |
58 |
59 |
62 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
75 |
77 |
78 |
79 |
87 |
88 |
90 |
91 |
--------------------------------------------------------------------------------
/sample/list-group.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | List Group
13 | List groups are a flexible and powerful component for displaying a series of content. Modify and extend
14 | them to support just about any content within.
15 |
16 |
17 |
18 | List Group
19 | CSS
20 | outputclass
22 | ul ol compact
26 |
27 |
28 |
29 |
30 | Basic example
31 | The most basic list group is an unordered list with list items and the proper classes. Build upon it with the
32 | options that follow, or with your own CSS as needed.
33 |
34 |
35 |
36 | An item
37 | A second item
38 | A third item
39 | A fourth item
40 | And a fifth one
41 |
42 |
43 | <ul outputclass="list-group">
44 | <li>An item</li>
45 | <li>A second item</li>
46 | <li>A third item</li>
47 | <li>A fourth item</li>
48 | <li>And a fifth one</li>
49 | </ul>
50 |
51 | Compacted list group
52 | Add compact="yes" to reduce the padding of list items
53 |
54 |
55 |
56 | Item One
57 | Item Two
58 | Item Three
59 |
60 |
61 | <ul outputclass="list-group" compact="yes" >
62 | ...
63 | </ul>
64 |
65 | Expanded list group
66 | Add compact="no" to increase the padding of list items
67 |
68 |
69 |
70 | Item One
71 | Item Two
72 | Item Three
73 |
74 |
75 | <ul outputclass="list-group" compact="no" >
76 | ...
77 | </ul>
78 |
79 | Flush
80 | Add an outputclass="list-group-flush" to remove some borders and
81 | rounded corners to render list group items edge-to-edge in a parent container (e.g., cards).
82 |
83 |
84 |
85 | An item
86 | A second item
87 | A third item
88 | A fourth item
89 | And a fifth one
90 |
91 |
92 | <ul outputclass="list-group-flush">
93 | <li>An item</li>
94 | <li>A second item</li>
95 | <li>A third item</li>
96 | <li>A fourth item</li>
97 | <li>And a fifth one</li>
98 | </ul>
99 |
100 |
101 |
--------------------------------------------------------------------------------
/sample/buttons.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Buttons
13 | Use Bootstrap’s custom button styles for actions in forms, dialogs, and more with support for multiple
14 | sizes, states, and more.
15 |
16 |
17 |
18 | Buttons
19 | CSS
20 | outputclass
22 | xref
24 |
25 |
26 |
27 |
28 | Example
29 | Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras
30 | thrown in for more control.
31 |
32 |
33 | Primary
34 | Secondary
35 | Success
36 | Danger
37 | Warning
38 | Info
39 | Light
40 | Dark
41 |
42 | <xref href="#" outputclass="btn-primary">Primary</xref>
43 | <xref href="#" outputclass="btn-secondary">Secondary</xref>
44 | <xref href="#" outputclass="btn-success">Success</xref>
45 | <xref href="#" outputclass="btn-danger">Danger</xref>
46 | <xref href="#" outputclass="btn-warning">Warning</xref>
47 | <xref href="#" outputclass="btn-info">Info</xref>
48 | <xref href="#" outputclass="btn-light">Light</xref>
49 | <xref href="#" outputclass="btn-dark">Dark</xref>
50 |
51 | Outline buttons
52 | In need of a button, but not the hefty background colors they bring? Replace the default modifier classes with
53 | the outputclass and a value of btn-outline-* to remove all background images
54 | and colors on any button.
55 |
56 |
57 | Primary
58 | Secondary
59 | Success
60 | Danger
61 | Warning
62 | Info
63 | Light
64 | Dark
65 |
66 | <xref href="#" outputclass="btn-outline-primary">Primary</xref>
67 | <xref href="#" outputclass="btn-outline-secondary">Secondary</xref>
68 | <xref href="#" outputclass="btn-outline-success">Success</xref>
69 | <xref href="#" outputclass="btn-outline-danger">Danger</xref>
70 | <xref href="#" outputclass="btn-outline-warning">Warning</xref>
71 | <xref href="#" outputclass="btn-outline-info">Info</xref>
72 | <xref href="#" outputclass="btn-outline-light">Light</xref>
73 | <xref href="#" outputclass="btn-outline-dark">Dark</xref>
74 |
75 |
76 |
--------------------------------------------------------------------------------
/sample/grid.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Grid System
13 | Use Bootstrap’s powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a
14 | twelve column system, six default responsive tiers, Sass variables and mixins, and dozens of predefined
15 | classes.
16 |
17 |
18 |
19 | Grid
20 | CSS
21 | outputclass
23 | bodydiv
25 |
26 |
27 |
28 |
29 | Example
30 | Bootstrap’s grid system uses a series of containers, rows, and columns to layout and align content. It’s built
31 | with flexbox and is fully responsive. Below is an example and an in-depth explanation for how the grid system
32 | comes together.
33 |
34 |
35 |
36 |
37 | One of three columns
38 |
39 |
40 | One of three columns
41 |
42 |
43 | One of three columns
44 |
45 |
46 |
47 | <bodydiv outputclass="row">
48 | <bodydiv outputclass="col-sm-3">
49 | <p>One of three columns</p>
50 | </bodydiv>
51 | <bodydiv outputclass="col-sm-3">
52 | <p>One of three columns</p>
53 | </bodydiv>
54 | <bodydiv outputclass="col-sm-3">
55 | <p>One of three columns</p>
56 | </bodydiv>
57 | </bodydiv>
58 |
59 | Equal-width
60 | For example, here are two grid layouts that apply to every device and viewport, from xs to
61 | xxl . Add any number of unit-less classes for each breakpoint you need and every column will
62 | be the same width.
63 |
64 |
65 |
66 |
67 |
One of two columns
68 |
70 |
One of two columns
71 |
73 |
74 |
75 |
One of three columns
76 |
78 |
One of three columns
79 |
81 |
One of three columns
82 |
84 |
85 | <bodydiv outputclass="row">
86 | <div outputclass="col">
87 | <p>One of two columns</p>
88 | </div>
89 | <div outputclass="col">
90 | <p>One of two columns</p>
91 | </div>
92 | </bodydiv>
93 | <bodydiv outputclass="row">
94 | <div outputclass="col">
95 | <p>One of three columns</p>
96 | </div>
97 | <div outputclass="col">
98 | <p>One of three columns</p>
99 | </div>
100 | <div outputclass="col">
101 | <p>One of three columns</p>
102 | </div>
103 | </bodydiv>
104 |
105 |
106 |
--------------------------------------------------------------------------------
/Customization/xsl/breadcrumb.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
24 |
25 |
26 |
27 | --bs-breadcrumb-divider: '
28 | ';
30 |
31 |
32 |
33 |
34 |
35 |
36 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
47 |
48 |
52 |
53 |
56 |
57 |
59 |
60 |
63 |
64 |
67 |
68 |
69 |
71 |
72 |
73 |
75 |
76 |
77 |
78 |
80 |
81 |
82 |
83 |
84 |
85 |
86 |
88 |
89 |
90 |
92 |
93 |
94 |
95 |
96 |
97 |
--------------------------------------------------------------------------------
/xsl/dita2html5-legacy-3.0_template.xsl:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
76 |
78 |
79 |
--------------------------------------------------------------------------------
/sample/figures.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
12 |
13 | Figures
14 |
15 | Documentation and examples for displaying related images and text with the figure component in
16 | Bootstrap.
17 | Anytime you need to display a piece of content—like an image with an optional caption, consider using a DITA
18 | fig element. Bootstrap CSS classes class="figure" ,
19 | class="figure-img" , and class="figure-caption" are automatically included to
20 | the output to provide some baseline styles for the HTML5 figure and
21 | figcaption elements.
22 |
23 |
24 |
25 |
26 | Figure
27 | CSS
28 | outputclass
30 | fig
32 |
33 |
34 |
35 |
36 | Example
37 | By default figure elements are styled as shown:
38 |
39 |
40 |
41 | A caption for the image.
42 |
44 |
45 | <fig>
46 | <title>A caption for the image.</title>
47 | <image href="..."/>
48 | </fig>
49 |
50 | Aligning text
51 | The figure’s caption can be aligned using the Bootstrap
52 | text utilities .
53 |
54 |
55 |
56 | A caption for the image.
57 |
59 |
60 | <fig>
61 | <title outputclass="text-end">A caption for the image.</title>
62 | <image href="..."/>
63 | </fig>
64 |
65 |
66 | Adding borders
67 | Use the DITA frame attribute to add
68 | borders to a fig .
70 |
71 |
72 |
73 | All Borders
74 | frame="all"
75 |
76 |
77 |
78 | Top and Bottom Borders
79 | frame="topbot"
80 |
81 |
82 |
83 | Side Borders
84 | frame="sides"
85 |
86 |
87 |
88 | Top Border only
89 | frame="top"
90 |
91 |
92 |
93 | Bottom Border Only
94 | frame="bottom"
95 |
96 |
97 | <fig frame="all">
98 | ...
99 | </fig>
100 | <fig frame="topbot">
101 | ...
102 | </fig>
103 | <fig frame="sides">
104 | ...
105 | </fig>
106 | <fig frame="top">
107 | ...
108 | </fig>
109 | <fig frame="bottom">
110 | ...
111 | </fig>
112 |
113 |
114 |
115 |
--------------------------------------------------------------------------------
/sample/document.ditamap:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | DITA Bootstrap
5 |
6 |
7 |
9 |
10 |
11 |
12 | Getting Started
13 |
16 |
18 |
19 |
20 | Layout
21 |
24 |
29 |
30 |
31 | Content
32 |
35 |
40 |
41 |
42 | Components
43 |
46 |
63 |
64 |
65 | Utilities
66 |
69 |
71 |
72 |
73 | Extend
74 |
77 |
78 |
79 |
81 |
82 |
83 |
84 |
86 |
87 |
88 |
89 |
91 |
92 |
93 |
94 |
97 |
98 |
99 |
100 |
102 |
103 |
104 |
105 |
107 |
108 |
109 |
110 |
112 |
113 |
114 |
115 |
117 |
118 |
119 |
120 |
121 |
123 |
124 |
125 |
--------------------------------------------------------------------------------
/xsl/dita2html5-bootstrapImpl_template.xsl:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
75 |
77 |
78 |
--------------------------------------------------------------------------------
/sample/sass.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Bootstrap Sass
13 | For more extensive customizations, you can install the
14 | dita-bootstrap.sass plug-in and create a custom theme with
19 | Sass .
20 |
21 |
22 |
23 | Sass
24 |
25 |
26 |
27 |
28 | This approach allows you to modify additional aspects of Bootstrap’s default presentation, beyond what you can do
29 | with CSS alone.
30 |
31 | Installing
32 | Use the dita command to add the required plug-ins to your DITA Open Toolkit
33 | installation:
34 | dita install fox.jason.extend.css
35 | dita install net.infotexture.dita-bootstrap
36 | dita install net.infotexture.dita-bootstrap.sassThe DITA Bootstrap Sass plug-in uses the
38 | Node.js JavaScript runtime to generate
39 | the theme.css file. Node.js must therefore be present for the index to be generated
40 | successfully. To download and install a copy, follow the instructions for your operating system on the
41 | download page .
42 |
43 |
44 | Generating a CSS theme from Sass
45 | To generate a CSS theme from your custom Sass source files, follow the instructions in the
46 | dita-bootstrap.sass/sass/override.scss sass-bootstrap transformation:
52 | dita --input =path/to/your.ditamap --format =sass-bootstrap A theme.css file will be generated in the sass folder. To preview the
55 | results of your customizations, open the
56 | dita-bootstrap.sass/sass/index.html
61 |
62 |
63 | Using the generated theme
64 | To use a pregenerated Sass theme as CSS in the HTML Bootstrap output, run the html5-bootstrap
65 | transformation and pass the bootstrap.sass parameter to the dita
66 | command:
67 | dita --input =path/to/your.ditamap \
69 | --format =html5-bootstrap \
70 | --bootstrap.sass =yes The generated dita-bootstrap.sass/sass/theme.css file will be copied to the
72 | css folder in the output directory and linked in the head
73 | element of the generated HTML files.
74 |
75 |
76 |
77 |
--------------------------------------------------------------------------------
/includes/ftr.content.example.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
155 |
156 |
--------------------------------------------------------------------------------
/includes/hdr.navbar.default.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
124 |
125 |
--------------------------------------------------------------------------------
/includes/hdr.navbar.example.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
124 |
125 |
--------------------------------------------------------------------------------
/sample/collapse.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Collapse
13 | Toggle the visibility of content across your project with a few classes and Bootstrap’s JavaScript
14 | plugin.
15 |
16 |
17 |
18 | Collapse
19 | CSS
20 | outputclass
22 | bodydiv xref props otherprops
27 |
28 |
29 |
30 |
31 | How it works
32 | The collapse JavaScript plugin is used to show and hide content. Buttons or anchors are used as triggers that
33 | are mapped to specific elements you toggle. Collapsing an element will animate the height from its current value
34 | to 0. Given how CSS handles animations, you cannot use padding on a .collapse element. Instead, use the class as
35 | an independent wrapping element.
36 |
37 |
38 | Example
39 | Below is a collapsed example that is displayed when the button is clicked. Add
40 | props="collapse-toggle" to an xref element to associate a button to
41 | a collapse
42 |
43 |
44 |
45 | Toggle Collapse
46 |
47 |
48 |
49 |
Some placeholder content for the collapse component. This panel is hidden by default but revealed when the
50 | user activates the relevant trigger.
51 |
53 |
54 | <p>
55 | <xref outputclass="btn-primary" props="collapse-toggle" href="#collapse1">
56 | Toggle Collapse
57 | </xref>
58 | </p>
59 | <bodydiv outputclass="collapse" id="collapse1">
60 | <div outputclass="card card-body">
61 | <p>Some placeholder content for the collapse component. This panel is hidden by default but revealed when the user activates the relevant trigger.</p>
62 | </div>
63 | </bodydiv>
64 |
65 | Horizontal
66 | The collapse plugin also supports horizontal collapsing. Add outputclass="collapse-horizontal"
67 | to transition the width instead of height and set an otherprops="style(width: ...) on the
68 | immediate child div element.
69 |
70 |
71 |
72 | Toggle Width Collapse
73 |
74 |
75 |
76 |
Some placeholder content for the collapse component. This is some placeholder content for a horizontal
77 | collapse. It’s hidden by default and shown when triggered.
78 |
80 |
81 | <p>
82 | <xref outputclass="btn-primary" props="collapse-toggle" href="#collapse2">Toggle Width Collapse</xref>
83 | </p>
84 | <bodydiv outputclass="collapse-horizontal" id="collapse2" otherprops="style(min-height: 120px;)">
85 | <div outputclass="card card-body" otherprops="style(width: 300px;)">
86 | <p>This is some placeholder content for a horizontal collapse. It’s hidden by default and shown when triggered.</p>
87 | </div>
88 | </bodydiv>
89 |
90 |
91 |
--------------------------------------------------------------------------------
/Customization/xsl/tables.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
23 |
24 |
25 |
27 |
28 |
37 |
38 |
39 |
40 |
41 |
43 |
44 |
45 |
46 |
47 |
49 |
50 |
52 |
53 |
55 |
56 |
58 |
59 |
61 |
62 |
64 |
65 |
66 |
67 |
68 |
71 |
72 |
73 |
74 |
75 |
76 |
84 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
101 |
102 |
103 |
105 |
106 |
107 |
108 |
110 |
111 |
113 |
114 |
115 |
116 |
117 |
119 |
120 |
121 |
--------------------------------------------------------------------------------
/Customization/xsl/tabs.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
26 |
27 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
48 |
49 |
51 |
53 |
54 |
55 |
63 |
64 |
66 |
67 |
68 |
69 |
70 |
71 |
72 |
77 |
78 |
90 |
91 |
92 |
93 |
94 |
95 |
99 |
108 |
109 |
110 |
111 |
112 |
116 |
126 |
127 |
128 |
--------------------------------------------------------------------------------
/sample/search-box.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Search Box
13 | Add a full-text search function to your menu bar by installing another plug-in.
14 |
15 |
16 |
17 | Search Box
18 | Nav Bar
19 | Lunr.js
20 | Node.js
21 | --args.hdr
23 |
24 |
25 |
26 |
27 | Sample search results
28 |
30 |
31 |
32 | Adding a search function
33 | Search boxes are not included by default. You must first install another plug-in
34 | which indexes the full DITA text. Since multiple search engines exist, search is
35 | always initialised by a separate dependent DITA-OT plug-in.
36 |
37 |
38 | The DITA Bootstrap Lunr Search is a DITA-OT plug-in which has been created using the Lunr.js library. It may be used directly or as a template for extending
43 | search to other search engines.
44 |
45 |
46 |
47 | Installing the <term>DITA Bootstrap Lunr Search</term> plug-in
48 | Use the dita command to add the DITA Bootstrap Lunr Search
49 | plug-in to your DITA Open Toolkit installation:
50 | dita install net.infotexture.dita-bootstrap.lunr
53 |
54 |
55 | Installing Node.js
56 |
57 | The
58 | DITA Bootstrap Lunr Search
59 | plug-in uses the
60 | Node.js
61 | JavaScript runtime to generate the Lunr.js search index.
62 | Node.js must therefore be present for the index to be generated successfully.
63 |
64 |
65 | To download and install a copy, follow the instructions for your operating system on the download page .
70 |
71 |
72 |
73 |
74 | Using
75 | To run, use the html5-bootstrap transformation and pass the --args.hdr parameter to the dita
77 | command:
78 | dita \
79 | --format =html5-bootstrap \
80 | --input =path/to/your.ditamap \
81 | --args.hdr =path/to/your-header.xml
83 |
84 |
85 | Sample header navigation bars
86 | To add a search box to the menu bar, add a form class="search-box" element
87 | with an input type="search" as shown here.
88 |
89 | Simple search box
90 |
92 | <ul class="navbar-nav ms-auto">
93 | <li class="nav-item d-flex align-items-center">
94 | <span class="nav-link pe-2"><i class="bi bi-search"/></span>
95 | <form class="position-relative me-auto search-box rounded">
96 | <input type="search" class="form-control"
97 | placeholder="Search…" aria-label="Search for…" dir="auto"/>
98 | </form>
99 | </li>
100 | </ul>
101 | The DITA Bootstrap Lunr Search plug-in includes a sample search box in its
102 | header navbar .
107 | Additional styling can be added using standard Bootstrap CSS classes such as
108 | input-group :
109 |
110 | Elaborate search box
111 |
113 | <ul class="navbar-nav ms-auto">
114 | <li class="nav-item d-flex align-items-center">
115 | <form class="position-relative me-auto search-box rounded">
116 | <div class="input-group">
117 | <span class="input-group-text bg-primary-subtle">
118 | <i class="bi bi-search"/>
119 | </span>
120 | <input type="search" class="form-control shadow-none"
121 | placeholder="Search…" aria-label="Search for…" dir="auto"/>
122 | </div>
123 | </form>
124 | </li>
125 | </ul>
126 |
127 |
128 |
129 |
130 |
--------------------------------------------------------------------------------
/sample/images.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Images
13 | Documentation and examples for opting images into responsive behavior (so they never become larger than
14 | their parent elements) and add lightweight styles to them—all via classes.
15 |
16 |
17 |
18 | Images
19 | CSS
20 | outputclass
22 | image scalefit
25 |
26 |
27 |
28 |
29 | Responsive images
30 | Images in DITA Bootstrap are made responsive with scalefit="yes" . This applies
31 | max-width: 100%; and height: auto; to the image so that it scales with the
32 | parent element.
33 |
34 |
35 |
37 | <image scalefit="yes" href="..." />
38 |
39 | Image thumbnails
40 | In addition to Bootstrap’s
41 | border-radius
42 | utilities , you can set outputclass to img-thumbnail to give an image
43 | a rounded 1px border appearance.
44 |
45 |
46 |
48 | <image outputclass="img-thumbnail" href="..." />
49 |
50 | Separate images for dark and light mode
51 | Use the outputclass="d-auto" , outputclass="d-light" ,
52 | and outputclass="d-dark" attributes on image elements
53 | to display different images when in dark mode .
54 |
55 |
56 |
57 |
71 |
72 | <fig>
73 | <image outputclass="img-thumbnail d-auto" href="..."/>
74 | <image outputclass="img-thumbnail d-light" href="..." deliveryTarget="html"/>
75 | <image outputclass="img-thumbnail d-dark" href="..." deliveryTarget="html"/>
76 | </fig>
77 |
78 |
79 | Support Lazy Loading
80 | Use the otherprops="loading(lazy)" attribute on image elements
81 | to wait until an image is on screen before loading.
82 |
83 |
84 | <image otherprops="loading(lazy)" href="..."/>
85 |
86 | Support HTML <xmlelement>picture</xmlelement> element
87 | Use the outputclass="d-picture" attributes on a div
88 | holding multiple image elements to display different images on
89 | different media. The otherprops attribute defines the media query and/or
90 | image MIME type. The final image is the default.
91 |
92 |
93 | Change the width of the browser to view different images:
94 |
95 |
101 |
102 | <div outputclass="d-picture" deliveryTarget="html">
103 | <image otherprops="media(min-width: 700px)" href="...">
104 | <image otherprops="media(min-width: 450px)" href="..."/>
105 | <image otherprops="type(image/jpeg)" href="..."/>
106 | <image otherprops="type(image/webp)" href="..."/>
107 | <image href="..."/>
108 | </div>
109 |
110 |
111 |
--------------------------------------------------------------------------------
/sample/button-group.dita:
--------------------------------------------------------------------------------
1 |
2 |
3 |
11 |
12 | Button group
13 | Group a series of buttons together on a single line or stack them in a vertical column.
14 |
15 |
16 |
17 | Button Group
18 | CSS
19 | outputclass
21 | div
23 |
24 |
25 |
26 |
27 | Basic example
28 | Wrap a series of buttons with xref outputclass="btn-*" in a div
29 | outputclass="btn-group"
30 |
31 |
32 |
33 |
34 | Left
35 | Middle
36 | Right
37 |
38 |
39 | <div outputclass="btn-group">
40 | <xref outputclass="btn-primary" href="#">Left</xref>
41 | <xref outputclass="btn-primary" href="#">Middle</xref>
42 | <xref outputclass="btn-primary" href="#">Right</xref>
43 | </div>
44 |
47 |
48 |
49 | Left
50 | Middle
51 | Right
52 |
53 |
54 | <div outputclass="btn-group">
55 | <xref outputclass="btn-danger" href="#">Left</xref>
56 | <xref outputclass="btn-warning" href="#">Middle</xref>
57 | <xref outputclass="btn-success" href="#">Right</xref>
58 | </div>
59 |
60 | Outlined styles
61 |
62 |
63 |
64 | Left
65 | Middle
66 | Right
67 |
68 |
69 | <div outputclass="btn-group">
70 | <xref outputclass="btn-outline-primary" href="#">Left</xref>
71 | <xref outputclass="btn-outline-primary" href="#">Middle</xref>
72 | <xref outputclass="btn-outline-primary" href="#">Right</xref>
73 | </div>
74 |
75 | Button toolbar
76 | Combine sets of button groups into button toolbars for more complex components.
77 |
78 |
79 |
80 |
81 | 1
82 | 2
83 | 3
84 | 4
85 |
86 |
87 | 5
88 | 6
89 | 7
90 |
91 |
92 | 8
93 |
94 |
96 | <div outputclass="btn-toolbar">
97 | <div outputclass="btn-group me-2">
98 | <xref outputclass="btn-primary" href="#">1</xref>
99 | <xref outputclass="btn-primary" href="#">2</xref>
100 | <xref outputclass="btn-primary" href="#">3</xref>
101 | <xref outputclass="btn-primary" href="#">4</xref>
102 | </div>
103 | <div outputclass="btn-group me-2">
104 | <xref outputclass="btn-secondary" href="#">5</xref>
105 | <xref outputclass="btn-secondary" href="#">6</xref>
106 | <xref outputclass="btn-secondary" href="#">7</xref>
107 | </div>
108 | <div outputclass="btn-group me-2">
109 | <xref outputclass="btn-info" href="#">8</xref>
110 | </div>
111 | </div>
112 |
113 | Vertical variation
114 | Make a set of buttons appear vertically stacked rather than horizontally.
115 |
116 |
117 |
118 | Top
119 | Middle
120 | Bottom
121 |
122 |
123 | <div class="btn-group-vertical">
124 | ...etc
125 | </div>
126 |
127 |
128 |
--------------------------------------------------------------------------------
/Customization/xsl/tooltips.xsl:
--------------------------------------------------------------------------------
1 |
2 |
6 |
14 |
15 |
16 |
17 |
18 |
19 | tooltip
20 |
21 |
30 |
31 |
33 |
34 |
35 |
36 |
37 | true
38 |
39 |
40 |
42 |
43 |
44 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
55 |
56 |
58 |
60 |
61 |
62 | <
63 |
66 |
67 | >
68 | </
70 | >
72 |
73 |
74 | />
75 |
76 |
77 |
78 |
79 |
80 |
81 | ="
83 | "
85 |
86 |
87 |
88 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
104 |
105 |
106 |
107 |
108 |
111 |
112 |
114 |
115 |
116 |
117 |
118 |
119 |
120 |
123 |
124 |
126 |
127 |
128 |
129 |
130 |
132 |
133 |
134 |
142 |
143 |
144 |
145 |
146 |
--------------------------------------------------------------------------------