Improve persona page with browser-like screenshots and background color
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
This commit is contained in:
parent
3fca077425
commit
24eb85edc1
13 changed files with 143 additions and 2 deletions
|
|
@ -1,5 +1,6 @@
|
|||
{{ $image := .Get "image" }}
|
||||
{{ $alt := .Get "alt" | default "" }}
|
||||
{{ $url := .Get "url" }}
|
||||
{{ $title := .Get "title" }}
|
||||
{{ $flip := eq (.Get "flip") "true" }}
|
||||
{{ $bg := .Get "bg" | default "" }}
|
||||
|
|
@ -9,12 +10,14 @@
|
|||
{{ if eq $bg "green" }}{{ $style = "background: var(--hd-green-50)" }}{{ end }}
|
||||
{{ if eq $bg "plum" }}{{ $style = "background: var(--hd-plum-100)" }}{{ end }}
|
||||
|
||||
{{ $browserArgs := dict "image" $image "alt" $alt "url" $url }}
|
||||
|
||||
<div class="container-fluid py-5"{{ with $style }} style="{{ . }}"{{ end }}>
|
||||
<div class="container my-5">
|
||||
<div class="row">
|
||||
{{ if $flip }}
|
||||
<div class="order-1 order-md-0 col-md-7 align-self-center">
|
||||
<img class="rounded img-thumbnail" src="{{ $image }}" alt="{{ $alt }}">
|
||||
{{ partial "usage-browser.html" $browserArgs }}
|
||||
</div>
|
||||
<div class="order-0 order-md-1 col-md-5 align-self-center text-center">
|
||||
{{ else }}
|
||||
|
|
@ -28,7 +31,7 @@
|
|||
</div>
|
||||
{{ if not $flip }}
|
||||
<div class="order-1 col-md-7 py-2 align-self-center">
|
||||
<img class="rounded img-thumbnail" src="{{ $image }}" alt="{{ $alt }}">
|
||||
{{ partial "usage-browser.html" $browserArgs }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue