0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00

docs: move examples inline shortcode to a partial (#39829)
Some checks failed
BrowserStack / browserstack (push) Has been skipped
Bundlewatch / bundlewatch (push) Successful in 56s
CodeQL / Analyze (push) Failing after 44s
cspell / cspell (push) Successful in 34s
CSS / css (push) Successful in 39s
Docs / docs (push) Failing after 12s
JS Tests / JS Tests (push) Failing after 33s
Lint / lint (push) Successful in 33s
CSS (node-sass) / css (push) Successful in 23s
Release notes / update_release_draft (push) Has been skipped

* docs: move examples inline shortcode to a partial

* Further tweaks
This commit is contained in:
XhmikosR 2024-04-01 22:00:09 +03:00 committed by GitHub
parent ba73ed6906
commit fb4629f82e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 64 additions and 66 deletions

View File

@ -4,69 +4,3 @@ title: Examples
description: Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts. description: Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.
aliases: "/examples/" aliases: "/examples/"
--- ---
{{< list-examples.inline >}}
{{ range $entry := $.Site.Data.examples -}}
<div class="bd-content">
<h2 id="{{ $entry.category | urlize }}">{{ $entry.category }}</h2>
<p>{{ $entry.description }}</p>
{{ if eq $entry.category "RTL" -}}
<div class="bd-callout bd-callout-warning small">
<p>
<strong>RTL is still experimental</strong> and will evolve with feedback. Spotted something or have an improvement to suggest?
</p>
<p><a href="{{ $.Site.Params.repo }}/issues/new/choose">Please open an issue.</a></p>
</div>
{{ end -}}
{{ range $i, $example := $entry.examples -}}
{{- $len := len $entry.examples -}}
{{ if (eq $i 0) }}<div class="row">{{ end }}
{{ if $entry.external -}}
<div class="col-md-6 col-lg-4 mb-3 d-flex gap-3">
<svg class="bi fs-5 flex-shrink-0 mt-1"><use xlink:href="#box-seam"></use></svg>
<div>
<h3 class="h5 mb-1">
<a class="d-block link-offset-1" href="{{ urls.JoinPath $.Site.Params.github_org $example.url }}" target="_blank" rel="noopener">
{{ $example.name }}
</a>
</h3>
<p class="text-body-secondary">{{ $example.description }}</p>
<p>
{{- $indexPath := "index.html" -}}
{{- if $example.indexPath -}}
{{- $indexPath = $example.indexPath -}}
{{- end }}
<a class="icon-link small link-secondary link-offset-1" href="https://stackblitz.com/github/twbs{{ $example.url }}?file={{ $indexPath | urlquery }}" target="_blank" rel="noopener">
<svg class="bi flex-shrink-0"><use xlink:href="#lightning-charge-fill"></use></svg>
Edit in StackBlitz
</a>
</p>
</div>
</div>
{{ else -}}
<div class="col-sm-6 col-md-3 mb-3">
<a class="d-block link-offset-1" href="{{ urls.JoinPath "/docs" $.Site.Params.docs_version "/examples" ($example.name | urlize) "/"}}"{{ if in $example.name "RTL" }} hreflang="ar"{{ end }}>
{{ $imageBasePath := urls.JoinPath "/docs" $.Site.Params.docs_version "assets/img/examples" -}}
{{- $imgPath := urls.JoinPath $imageBasePath (printf "%s%s" ($example.name | urlize) ".png") -}}
{{- $imgPath2x := urls.JoinPath $imageBasePath (printf "%s%s" ($example.name | urlize) "@2x.png") -}}
{{- with (imageConfig (path.Join "/site/static" $imgPath)) -}}
<img class="img-thumbnail mb-3"
srcset="{{ $imgPath }}, {{ $imgPath2x }} 2x"
src="{{ $imgPath }}"
alt=""
width="{{ .Width }}"
height="{{ .Height }}"
loading="lazy">
{{- end }}
<h3 class="h5 mb-1">
{{ $example.name }}
</h3>
</a>
<p class="text-body-secondary">{{ $example.description }}</p>
</div>
{{- end }}
{{ if (eq (add $i 1) $len) }}</div>{{ end -}}
{{ end -}}
</div>
{{ end -}}
{{< /list-examples.inline >}}

View File

@ -29,6 +29,7 @@
{{ .Content }} {{ .Content }}
{{ if eq .Title "Examples" -}} {{ if eq .Title "Examples" -}}
{{ partial "examples/main" . }}
{{ partial "examples/bs-themes" . }} {{ partial "examples/bs-themes" . }}
{{- end }} {{- end }}
</div> </div>

View File

@ -0,0 +1,63 @@
{{ range $entry := $.Site.Data.examples -}}
<div class="bd-content">
<h2 id="{{ $entry.category | urlize }}">{{ $entry.category }}</h2>
<p>{{ $entry.description }}</p>
{{ if eq $entry.category "RTL" -}}
<div class="bd-callout bd-callout-warning small">
<p>
<strong>RTL is still experimental</strong> and will evolve with feedback. Spotted something or have an improvement to suggest?
</p>
<p><a href="{{ urls.JoinPath $.Site.Params.repo "issues/new/choose" }}">Please open an issue.</a></p>
</div>
{{ end -}}
{{ range $i, $example := $entry.examples -}}
{{- $len := len $entry.examples -}}
{{ if (eq $i 0) }}<div class="row">{{ end }}
{{ if $entry.external -}}
<div class="col-md-6 col-lg-4 mb-3 d-flex gap-3">
<svg class="bi fs-5 flex-shrink-0 mt-1"><use xlink:href="#box-seam"></use></svg>
<div>
<h3 class="h5 mb-1">
<a class="d-block link-offset-1" href="{{ urls.JoinPath $.Site.Params.github_org $example.url }}" target="_blank" rel="noopener">
{{ $example.name }}
</a>
</h3>
<p class="text-body-secondary">{{ $example.description }}</p>
<p>
{{- $indexPath := default "index.html" $example.indexPath -}}
{{- $stackBlitzUrl := printf "%s%s%s" (urls.JoinPath "https://stackblitz.com/github/twbs" $example.url) "?file=" ($indexPath | urlquery) }}
<a class="icon-link small link-secondary link-offset-1" href="{{ $stackBlitzUrl }}" target="_blank" rel="noopener">
<svg class="bi flex-shrink-0"><use xlink:href="#lightning-charge-fill"></use></svg>
Edit in StackBlitz
</a>
</p>
</div>
</div>
{{ else -}}
<div class="col-sm-6 col-md-3 mb-3">
{{- $exampleNameUrlized := $example.name | urlize -}}
{{- $exampleUrl := urls.JoinPath "/docs" $.Site.Params.docs_version "/examples" $exampleNameUrlized "/" }}
<a class="d-block link-offset-1" href="{{ $exampleUrl }}"{{ if in $example.name "RTL" }} hreflang="ar"{{ end }}>
{{ $imageBasePath := urls.JoinPath "/docs" $.Site.Params.docs_version "assets/img/examples" -}}
{{- $imgPath := urls.JoinPath $imageBasePath (printf "%s.png" $exampleNameUrlized) -}}
{{- $imgPath2x := urls.JoinPath $imageBasePath (printf "%s@2x.png" $exampleNameUrlized) -}}
{{- with (imageConfig (path.Join "/site/static" $imgPath)) -}}
<img class="img-thumbnail mb-3"
srcset="{{ $imgPath }}, {{ $imgPath2x }} 2x"
src="{{ $imgPath }}"
alt=""
width="{{ .Width }}"
height="{{ .Height }}"
loading="lazy">
{{- end }}
<h3 class="h5 mb-1">
{{ $example.name }}
</h3>
</a>
<p class="text-body-secondary">{{ $example.description }}</p>
</div>
{{- end }}
{{ if (eq (add $i 1) $len) }}</div>{{ end -}}
{{ end -}}
</div>
{{ end -}}