mirror of
https://github.com/twbs/bootstrap.git
synced 2024-11-29 11:24:18 +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
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
GitHub
parent
ba73ed6906
commit
fb4629f82e
@ -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.
|
||||
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 >}}
|
||||
|
||||
@ -29,6 +29,7 @@
|
||||
{{ .Content }}
|
||||
|
||||
{{ if eq .Title "Examples" -}}
|
||||
{{ partial "examples/main" . }}
|
||||
{{ partial "examples/bs-themes" . }}
|
||||
{{- end }}
|
||||
</div>
|
||||
|
||||
63
site/layouts/partials/examples/main.html
Normal file
63
site/layouts/partials/examples/main.html
Normal 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 -}}
|
||||
Loading…
Reference in New Issue
Block a user