mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-18 19:31:35 +02:00
Code Issues Releases Wiki Activity

docs: bundle assets with Hugo

Browse Source 
Also:

* load any docs' third-party dependencies from node_modules (except for examples)
* exclude docsearch from layouts that don't use it
* preconnect to algolia only when not examples layout
* switch to `RelPermalink`
* refactor JS assets into partials
This commit is contained in:
XhmikosR
2024-03-08 12:43:44 +02:00
parent e340674d06
commit 24f749cb76
20 changed files with 656 additions and 270 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
site/assets/js/application.js
View File

@@ -9,22 +9,12 @@
* For details, see https://creativecommons.org/licenses/by/3.0/.
*/
(() => {
'use strict'
/* eslint-disable import/no-unresolved */
import sidebarScroll from 'js/partials/sidebar.js'
import codeExamples from 'js/partials/code-examples.js'
import snippets from 'js/partials/snippets.js'
/* eslint-enable import/no-unresolved */
// Scroll the active sidebar link into view
const sidenav = document.querySelector('.bd-sidebar')
const sidenavActiveLink = document.querySelector('.bd-links-nav .active')
if (sidenav && sidenavActiveLink) {
const sidenavHeight = sidenav.clientHeight
const sidenavActiveLinkTop = sidenavActiveLink.offsetTop
const sidenavActiveLinkHeight = sidenavActiveLink.clientHeight
const viewportTop = sidenavActiveLinkTop
const viewportBottom = viewportTop - sidenavHeight + sidenavActiveLinkHeight
if (sidenav.scrollTop > viewportTop || sidenav.scrollTop < viewportBottom) {
sidenav.scrollTop = viewportTop - (sidenavHeight / 2) + (sidenavActiveLinkHeight / 2)
}
}
})()
sidebarScroll()
codeExamples()
snippets()

10
site/assets/js/code-examples.js → site/assets/js/partials/code-examples.js
View File

@@ -2,18 +2,18 @@
// IT'S ALL JUST JUNK FOR OUR DOCS!
// ++++++++++++++++++++++++++++++++++++++++++
/*!
/*
* JavaScript for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2011-2024 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
* For details, see https://creativecommons.org/licenses/by/3.0/.
*/
/* global ClipboardJS: false, bootstrap: false */
/* global bootstrap: false */
(() => {
'use strict'
import ClipboardJS from 'clipboard'
export default () => {
// Insert copy to clipboard button before .highlight
const btnTitle = 'Copy to clipboard'
const btnEdit = 'Edit on StackBlitz'
@@ -87,4 +87,4 @@
tooltipBtn.setContent({ '.tooltip-inner': btnTitle })
}, { once: true })
})
})()
}

30
site/assets/js/partials/sidebar.js Normal file
View File

@@ -0,0 +1,30 @@
// NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT
// IT'S ALL JUST JUNK FOR OUR DOCS!
// ++++++++++++++++++++++++++++++++++++++++++
/*
* JavaScript for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2011-2024 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
* For details, see https://creativecommons.org/licenses/by/3.0/.
*/
export default () => {
// Scroll the active sidebar link into view
const sidenav = document.querySelector('.bd-sidebar')
const sidenavActiveLink = document.querySelector('.bd-links-nav .active')
if (!sidenav || !sidenavActiveLink) {
return
}
const sidenavHeight = sidenav.clientHeight
const sidenavActiveLinkTop = sidenavActiveLink.offsetTop
const sidenavActiveLinkHeight = sidenavActiveLink.clientHeight
const viewportTop = sidenavActiveLinkTop
const viewportBottom = viewportTop - sidenavHeight + sidenavActiveLinkHeight
if (sidenav.scrollTop > viewportTop || sidenav.scrollTop < viewportBottom) {
sidenav.scrollTop = viewportTop - (sidenavHeight / 2) + (sidenavActiveLinkHeight / 2)
}
}

168
site/assets/js/partials/snippets.js Normal file
View File

@@ -0,0 +1,168 @@
// NOTICE!!! Initially embedded in our docs this JavaScript
// file contains elements that can help you create reproducible
// use cases in StackBlitz for instance.
// In a real project please adapt this content to your needs.
// ++++++++++++++++++++++++++++++++++++++++++
/*
* JavaScript for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2011-2024 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
* For details, see https://creativecommons.org/licenses/by/3.0/.
*/
/* global bootstrap: false */
export default () => {
// --------
// Tooltips
// --------
// Instantiate all tooltips in a docs or StackBlitz
document.querySelectorAll('[data-bs-toggle="tooltip"]')
.forEach(tooltip => {
new bootstrap.Tooltip(tooltip)
})
// --------
// Popovers
// --------
// Instantiate all popovers in docs or StackBlitz
document.querySelectorAll('[data-bs-toggle="popover"]')
.forEach(popover => {
new bootstrap.Popover(popover)
})
// -------------------------------
// Toasts
// -------------------------------
// Used by 'Placement' example in docs or StackBlitz
const toastPlacement = document.getElementById('toastPlacement')
if (toastPlacement) {
document.getElementById('selectToastPlacement').addEventListener('change', function () {
if (!toastPlacement.dataset.originalClass) {
toastPlacement.dataset.originalClass = toastPlacement.className
}
toastPlacement.className = `${toastPlacement.dataset.originalClass} ${this.value}`
})
}
// Instantiate all toasts in docs pages only
document.querySelectorAll('.bd-example .toast')
.forEach(toastNode => {
const toast = new bootstrap.Toast(toastNode, {
autohide: false
})
toast.show()
})
// Instantiate all toasts in docs pages only
// js-docs-start live-toast
const toastTrigger = document.getElementById('liveToastBtn')
const toastLiveExample = document.getElementById('liveToast')
if (toastTrigger) {
const toastBootstrap = bootstrap.Toast.getOrCreateInstance(toastLiveExample)
toastTrigger.addEventListener('click', () => {
toastBootstrap.show()
})
}
// js-docs-end live-toast
// -------------------------------
// Alerts
// -------------------------------
// Used in 'Show live alert' example in docs or StackBlitz
// js-docs-start live-alert
const alertPlaceholder = document.getElementById('liveAlertPlaceholder')
const appendAlert = (message, type) => {
const wrapper = document.createElement('div')
wrapper.innerHTML = [
`<div class="alert alert-${type} alert-dismissible" role="alert">`,
` <div>${message}</div>`,
' <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>',
'</div>'
].join('')
alertPlaceholder.append(wrapper)
}
const alertTrigger = document.getElementById('liveAlertBtn')
if (alertTrigger) {
alertTrigger.addEventListener('click', () => {
appendAlert('Nice, you triggered this alert message!', 'success')
})
}
// js-docs-end live-alert
// --------
// Carousels
// --------
// Instantiate all non-autoplaying carousels in docs or StackBlitz
document.querySelectorAll('.carousel:not([data-bs-ride="carousel"])')
.forEach(carousel => {
bootstrap.Carousel.getOrCreateInstance(carousel)
})
// -------------------------------
// Checks & Radios
// -------------------------------
// Indeterminate checkbox example in docs and StackBlitz
document.querySelectorAll('.bd-example-indeterminate [type="checkbox"]')
.forEach(checkbox => {
if (checkbox.id.includes('Indeterminate')) {
checkbox.indeterminate = true
}
})
// -------------------------------
// Links
// -------------------------------
// Disable empty links in docs examples only
document.querySelectorAll('.bd-content [href="#"]')
.forEach(link => {
link.addEventListener('click', event => {
event.preventDefault()
})
})
// -------------------------------
// Modal
// -------------------------------
// Modal 'Varying modal content' example in docs and StackBlitz
// js-docs-start varying-modal-content
const exampleModal = document.getElementById('exampleModal')
if (exampleModal) {
exampleModal.addEventListener('show.bs.modal', event => {
// Button that triggered the modal
const button = event.relatedTarget
// Extract info from data-bs-* attributes
const recipient = button.getAttribute('data-bs-whatever')
// If necessary, you could initiate an Ajax request here
// and then do the updating in a callback.
// Update the modal's content.
const modalTitle = exampleModal.querySelector('.modal-title')
const modalBodyInput = exampleModal.querySelector('.modal-body input')
modalTitle.textContent = `New message to ${recipient}`
modalBodyInput.value = recipient
})
}
// js-docs-end varying-modal-content
// -------------------------------
// Offcanvas
// -------------------------------
// 'Offcanvas components' example in docs only
const myOffcanvas = document.querySelectorAll('.bd-example-offcanvas .offcanvas')
if (myOffcanvas) {
myOffcanvas.forEach(offcanvas => {
offcanvas.addEventListener('show.bs.offcanvas', event => {
event.preventDefault()
}, false)
})
}
}

15
site/assets/js/search.js
View File

@@ -2,18 +2,25 @@
// IT'S ALL JUST JUNK FOR OUR DOCS!
// ++++++++++++++++++++++++++++++++++++++++++
(() => {
'use strict'
/*!
* JavaScript for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2024 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
* For details, see https://creativecommons.org/licenses/by/3.0/.
*/
import docsearch from '@docsearch/js'
(() => {
const searchElement = document.getElementById('docsearch')
if (!window.docsearch || !searchElement) {
if (!searchElement) {
return
}
const siteDocsVersion = searchElement.getAttribute('data-bd-docs-version')
window.docsearch({
docsearch({
apiKey: '3151f502c7b9e9dafd5e6372b691a24e',
indexName: 'bootstrap',
appId: 'AK7KMZKZHQ',

169
site/assets/js/snippets.js
View File

@@ -1,170 +1,15 @@
// NOTICE!!! Initially embedded in our docs this JavaScript
// file contains elements that can help you create reproducible
// use cases in StackBlitz for instance.
// In a real project please adapt this content to your needs.
// ++++++++++++++++++++++++++++++++++++++++++
/*!
/*
* JavaScript for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2011-2024 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
* For details, see https://creativecommons.org/licenses/by/3.0/.
*/
/* global bootstrap: false */
// Note that this file is not published; we only include it in scrpts.html
// for StackBlitz to work
(() => {
'use strict'
/* eslint-disable import/no-unresolved */
import snippets from 'js/partials/snippets.js'
/* eslint-enable import/no-unresolved */
// --------
// Tooltips
// --------
// Instantiate all tooltips in a docs or StackBlitz
document.querySelectorAll('[data-bs-toggle="tooltip"]')
.forEach(tooltip => {
new bootstrap.Tooltip(tooltip)
})
// --------
// Popovers
// --------
// Instantiate all popovers in docs or StackBlitz
document.querySelectorAll('[data-bs-toggle="popover"]')
.forEach(popover => {
new bootstrap.Popover(popover)
})
// -------------------------------
// Toasts
// -------------------------------
// Used by 'Placement' example in docs or StackBlitz
const toastPlacement = document.getElementById('toastPlacement')
if (toastPlacement) {
document.getElementById('selectToastPlacement').addEventListener('change', function () {
if (!toastPlacement.dataset.originalClass) {
toastPlacement.dataset.originalClass = toastPlacement.className
}
toastPlacement.className = `${toastPlacement.dataset.originalClass} ${this.value}`
})
}
// Instantiate all toasts in docs pages only
document.querySelectorAll('.bd-example .toast')
.forEach(toastNode => {
const toast = new bootstrap.Toast(toastNode, {
autohide: false
})
toast.show()
})
// Instantiate all toasts in docs pages only
// js-docs-start live-toast
const toastTrigger = document.getElementById('liveToastBtn')
const toastLiveExample = document.getElementById('liveToast')
if (toastTrigger) {
const toastBootstrap = bootstrap.Toast.getOrCreateInstance(toastLiveExample)
toastTrigger.addEventListener('click', () => {
toastBootstrap.show()
})
}
// js-docs-end live-toast
// -------------------------------
// Alerts
// -------------------------------
// Used in 'Show live alert' example in docs or StackBlitz
// js-docs-start live-alert
const alertPlaceholder = document.getElementById('liveAlertPlaceholder')
const appendAlert = (message, type) => {
const wrapper = document.createElement('div')
wrapper.innerHTML = [
`<div class="alert alert-${type} alert-dismissible" role="alert">`,
` <div>${message}</div>`,
' <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>',
'</div>'
].join('')
alertPlaceholder.append(wrapper)
}
const alertTrigger = document.getElementById('liveAlertBtn')
if (alertTrigger) {
alertTrigger.addEventListener('click', () => {
appendAlert('Nice, you triggered this alert message!', 'success')
})
}
// js-docs-end live-alert
// --------
// Carousels
// --------
// Instantiate all non-autoplaying carousels in docs or StackBlitz
document.querySelectorAll('.carousel:not([data-bs-ride="carousel"])')
.forEach(carousel => {
bootstrap.Carousel.getOrCreateInstance(carousel)
})
// -------------------------------
// Checks & Radios
// -------------------------------
// Indeterminate checkbox example in docs and StackBlitz
document.querySelectorAll('.bd-example-indeterminate [type="checkbox"]')
.forEach(checkbox => {
if (checkbox.id.includes('Indeterminate')) {
checkbox.indeterminate = true
}
})
// -------------------------------
// Links
// -------------------------------
// Disable empty links in docs examples only
document.querySelectorAll('.bd-content [href="#"]')
.forEach(link => {
link.addEventListener('click', event => {
event.preventDefault()
})
})
// -------------------------------
// Modal
// -------------------------------
// Modal 'Varying modal content' example in docs and StackBlitz
// js-docs-start varying-modal-content
const exampleModal = document.getElementById('exampleModal')
if (exampleModal) {
exampleModal.addEventListener('show.bs.modal', event => {
// Button that triggered the modal
const button = event.relatedTarget
// Extract info from data-bs-* attributes
const recipient = button.getAttribute('data-bs-whatever')
// If necessary, you could initiate an Ajax request here
// and then do the updating in a callback.
// Update the modal's content.
const modalTitle = exampleModal.querySelector('.modal-title')
const modalBodyInput = exampleModal.querySelector('.modal-body input')
modalTitle.textContent = `New message to ${recipient}`
modalBodyInput.value = recipient
})
}
// js-docs-end varying-modal-content
// -------------------------------
// Offcanvas
// -------------------------------
// 'Offcanvas components' example in docs only
const myOffcanvas = document.querySelectorAll('.bd-example-offcanvas .offcanvas')
if (myOffcanvas) {
myOffcanvas.forEach(offcanvas => {
offcanvas.addEventListener('show.bs.offcanvas', event => {
event.preventDefault()
}, false)
})
}
})()
snippets()

67
site/assets/js/stackblitz.js Normal file
View File

@@ -0,0 +1,67 @@
// NOTICE!!! Initially embedded in our docs this JavaScript
// file contains elements that can help you create reproducible
// use cases in StackBlitz for instance.
// In a real project please adapt this content to your needs.
// ++++++++++++++++++++++++++++++++++++++++++
/*!
* JavaScript for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2024 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
* For details, see https://creativecommons.org/licenses/by/3.0/.
*/
import sdk from '@stackblitz/sdk'
// https://gohugo.io/hugo-pipes/js/#options
import {
cssCdn, docsVersion, jsBundleCdn, jsSnippetFile
} from '@params' // eslint-disable-line import/no-unresolved
// Open in StackBlitz logic
document.querySelectorAll('.btn-edit').forEach(btn => {
btn.addEventListener('click', event => {
const codeSnippet = event.target.closest('.bd-code-snippet')
const exampleEl = codeSnippet.querySelector('.bd-example')
const htmlSnippet = exampleEl.innerHTML
const jsSnippet = codeSnippet.querySelector('.btn-edit').getAttribute('data-sb-js-snippet')
// Get extra classes for this example
const classes = Array.from(exampleEl.classList).join(' ')
sdk.openBootstrapSnippet(htmlSnippet, jsSnippet, classes)
})
})
sdk.openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
const markup = `<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="${cssCdn}" rel="stylesheet">
<link href="https://getbootstrap.com/docs/${docsVersion}/assets/css/docs.css" rel="stylesheet">
<title>Bootstrap Example</title>
<${'script'} src="${jsBundleCdn}"></${'script'}>
</head>
<body class="p-3 m-0 border-0 ${classes}">
<!-- Example Code -->
${htmlSnippet.replace(/^/gm, ' ')}
<!-- End Example Code -->
</body>
</html>`
const jsSnippetContent = jsSnippet ? jsSnippetFile : null
const project = {
files: {
'index.html': markup,
'index.js': jsSnippetContent
},
title: 'Bootstrap Example',
description: `Official example from ${window.location.href}`,
template: jsSnippet ? 'javascript' : 'html',
tags: ['bootstrap']
}
sdk.openProject(project, { openFile: 'index.html' })
}

7
site/assets/js/vendor/clipboard.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
site/assets/scss/_search.scss
View File

@@ -1,5 +1,7 @@
// stylelint-disable selector-class-pattern
@import "@docsearch/css/dist/style";
:root {
--docsearch-primary-color: var(--bd-violet);
--docsearch-logo-color: var(--bd-violet);

2
site/content/docs/5.3/components/alerts.md
View File

@@ -38,7 +38,7 @@ Click the button below to show an alert (hidden with inline styles to start), th
We use the following JavaScript to trigger our live alert demo:
{{< js-docs name="live-alert" file="site/assets/js/snippets.js" >}}
{{< js-docs name="live-alert" file="site/assets/js/partials/snippets.js" >}}
### Link color

2
site/content/docs/5.3/components/modal.md
View File

@@ -481,7 +481,7 @@ Below is a live demo followed by example HTML and JavaScript. For more informati
</div>
{{< /example >}}
{{< js-docs name="varying-modal-content" file="site/assets/js/snippets.js" >}}
{{< js-docs name="varying-modal-content" file="site/assets/js/partials/snippets.js" >}}
### Toggle between modals

2
site/content/docs/5.3/components/toasts.md
View File

@@ -87,7 +87,7 @@ Click the button below to show a toast (positioned with our utilities in the low
We use the following JavaScript to trigger our live toast demo:
{{< js-docs name="live-toast" file="site/assets/js/snippets.js" >}}
{{< js-docs name="live-toast" file="site/assets/js/partials/snippets.js" >}}
### Translucent

2
site/content/docs/5.3/docsref.md
View File

@@ -46,4 +46,4 @@ sitemap_exclude: true
{{< scss-docs name="variable-gradient" file="scss/_variables.scss" >}}
{{< js-docs name="live-toast" file="site/assets/js/snippets.js" >}}
{{< js-docs name="live-toast" file="site/assets/js/partials/snippets.js" >}}

8
site/layouts/partials/header.html
View File

@@ -7,11 +7,13 @@
<meta name="docsearch:language" content="en">
<meta name="docsearch:version" content="{{ .Site.Params.docs_version }}">
<title>{{ if .IsHome }}{{ .Site.Title | markdownify }} · {{ .Site.Params.subtitle | markdownify }}{{ else }}{{ .Title | markdownify }} · {{ .Site.Title | markdownify }} v{{ .Site.Params.docs_version }}{{ end }}</title>
<link rel="canonical" href="{{ .Permalink }}">
<link rel="preconnect" href="https://AK7KMZKZHQ-dsn.algolia.net" crossorigin>
{{ if (ne .Page.Layout "examples") -}}
<link rel="preconnect" href="https://ak7kmzkzhq-dsn.algolia.net" crossorigin>
{{- end }}
<title>{{ if .IsHome }}{{ .Site.Title | markdownify }} · {{ .Site.Params.subtitle | markdownify }}{{ else }}{{ .Title | markdownify }} · {{ .Site.Title | markdownify }} v{{ .Site.Params.docs_version }}{{ end }}</title>
{{ with .Params.robots -}}
<meta name="robots" content="{{ . }}">

83
site/layouts/partials/scripts.html
View File

@@ -4,70 +4,31 @@
<script src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.js"></script>
{{- end }}
<script src="https://cdn.jsdelivr.net/npm/@docsearch/js@3"></script>
{{ if eq .Page.Layout "docs" -}}
<script src="https://cdn.jsdelivr.net/npm/@stackblitz/sdk@1/bundles/sdk.umd.js"></script>
{{- end }}
{{- $vendor := resources.Match "js/vendor/*.js" -}}
{{- $js := resources.Match "js/*.js" -}}
{{- $targetDocsJSPath := path.Join "/docs" .Site.Params.docs_version "assets/js/docs.js" -}}
{{- $docsJs := append $js $vendor | resources.Concat $targetDocsJSPath -}}
{{- $esbuildOptions := dict "target" "es2019" -}}
{{- $targetDocsJSPath := path.Join "/docs" .Site.Params.docs_version -}}
{{- if hugo.IsProduction -}}
{{- $docsJs = $docsJs | resources.Minify -}}
{{- $esbuildOptions = merge $esbuildOptions (dict "minify" "true") -}}
{{- end }}
<script src="{{ $docsJs.Permalink | relURL }}"></script>
{{- $applicationJs := resources.Get "js/application.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/application.js") }}
<script src="{{ $applicationJs.RelPermalink }}"></script>
{{- if (ne .Page.Layout "examples") -}}
{{- $searchJs := resources.Get "js/search.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/search.js") }}
<script async src="{{ $searchJs.RelPermalink }}"></script>
{{- end -}}
{{ if eq .Page.Layout "docs" -}}
<script>
// Open in StackBlitz logic
document.querySelectorAll('.btn-edit').forEach(btn => {
btn.addEventListener('click', event => {
const htmlSnippet = event.target.closest('.bd-code-snippet').querySelector('.bd-example').innerHTML
// Get extra classes for this example
const classes = Array.from(event.target.closest('.bd-code-snippet').querySelector('.bd-example').classList).join(' ')
const jsSnippet = event.target.closest('.bd-code-snippet').querySelector('.btn-edit').getAttribute('data-sb-js-snippet')
StackBlitzSDK.openBootstrapSnippet(htmlSnippet, jsSnippet, classes)
})
})
StackBlitzSDK.openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
const markup = `<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="{{ .Site.Params.cdn.css }}" rel="stylesheet">
<link href="https://getbootstrap.com/docs/{{ .Site.Params.docs_version }}/assets/css/docs.css" rel="stylesheet">
<title>Bootstrap Example</title>
<${'script'} src="{{ .Site.Params.cdn.js_bundle }}"></${'script'}>
</head>
<body class="p-3 m-0 border-0 ${classes}">
<!-- Example Code -->
${htmlSnippet.replace(/^/gm, ' ')}
<!-- End Example Code -->
</body>
</html>`
const jsSnippetContent = jsSnippet ? '{{ os.ReadFile "site/assets/js/snippets.js" }}' : null
const project = {
files: {
'index.html': markup,
'index.js': jsSnippetContent
},
title: 'Bootstrap Example',
description: `Official example from ${window.location.href}`,
template: jsSnippet ? 'javascript' : 'html',
tags: ['bootstrap']
}
StackBlitzSDK.openProject(project, { openFile: 'index.html' })
}
</script>
{{- end }}
{{- /* Disable minify options for snippets.js so that the file's readable on StackBlitz */ -}}
{{- $snippetsFile := resources.Get "js/snippets.js" | js.Build (merge $esbuildOptions (dict "minify" "false")) -}}
{{- $esbuildParams := dict
"cssCdn" .Site.Params.cdn.css
"jsBundleCdn" .Site.Params.cdn.js_bundle
"docsVersion" .Site.Params.docs_version
"jsSnippetFile" $snippetsFile.Content
-}}
{{- $esbuildOptions = merge $esbuildOptions (dict "params" $esbuildParams) -}}
{{- $stackblitzJs := resources.Get "js/stackblitz.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/stackblitz.js") }}
<script async src="{{ $stackblitzJs.RelPermalink }}"></script>
{{- end -}}

4
site/layouts/partials/stylesheet.html
View File

@@ -1,5 +1,3 @@
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3">
{{ if hugo.IsProduction -}}
{{ if eq .Page.Params.direction "rtl" -}}
<link href="/docs/{{ .Site.Params.docs_version }}/dist/css/bootstrap.rtl.min.css" rel="stylesheet" {{ printf "integrity=%q" .Site.Params.cdn.css_rtl_hash | safeHTMLAttr }}>
@@ -21,5 +19,5 @@
{{- $style := resources.Get "scss/docs.scss" | toCSS $sassOptions | postCSS $postcssOptions }}
<link href="{{ $style.Permalink | relURL }}" rel="stylesheet">
<link href="{{ $style.RelPermalink }}" rel="stylesheet">
{{- end }}