Compare commits
No commits in common. "3248ac51d13b1ecf221f3c9ba453cb3da30b9bf3" and "c4821daa6e080cc16f339884d022c243b163c0dc" have entirely different histories.
3248ac51d1
...
c4821daa6e
31 changed files with 65 additions and 329 deletions
|
|
@ -47,7 +47,7 @@
|
|||
|
||||
:root {
|
||||
--background-color: light-dark(var(--gray7), var(--gray1));
|
||||
--hr-color: var(--text-color-secondary);
|
||||
--hr-color: light-dark(var(--gray5), var(--gray2));
|
||||
--text-color-primary: light-dark(var(--gray1), var(--gray7));
|
||||
--text-color-secondary: light-dark(var(--gray4), var(--gray5));
|
||||
--text-color-light: light-dark(var(--gray5), var(--gray4));
|
||||
|
|
|
|||
|
|
@ -51,30 +51,17 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
|
||||
hr {
|
||||
margin-block: var(--space-l);
|
||||
margin-block: var(--space-m);
|
||||
}
|
||||
|
||||
:is(dl, p, ol, ul) + :is(dl, p, ol, ul) {
|
||||
p + p {
|
||||
margin-block-start: var(--space-paragraph);
|
||||
}
|
||||
|
||||
|
||||
/* Figures */
|
||||
|
||||
{{-
|
||||
$elementsWithXLBlockMargins := delimit
|
||||
(slice
|
||||
"blockquote"
|
||||
"table"
|
||||
".codeblock"
|
||||
".content-grid"
|
||||
".figure"
|
||||
".highlight"
|
||||
".instagram-media"
|
||||
".two-column:has(figure:first-child + figure:last-child)"
|
||||
)
|
||||
", "
|
||||
-}}
|
||||
{{- $elementsWithXLBlockMargins := "blockquote, table, .codeblock, .figure--main-column, .figure--code, .figure--image, .figure--video, .figure--youtube, .highlight" -}}
|
||||
|
||||
p + :is({{ $elementsWithXLBlockMargins }}) {
|
||||
margin-block-start: var(--space-xl);
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@ body {
|
|||
gap: var(--space-xl) 0;
|
||||
}
|
||||
|
||||
.list-header, p {
|
||||
:is(.list-header, p) {
|
||||
grid-column: main-start / main-end;
|
||||
}
|
||||
|
||||
|
|
@ -106,10 +106,14 @@ body {
|
|||
grid-column: main-start / main-end;
|
||||
}
|
||||
|
||||
.content > .codeblock {
|
||||
.content > :is(.figure--image, .codeblock) {
|
||||
grid-column: wide-gutter-start / wide-gutter-end;
|
||||
}
|
||||
|
||||
figure, img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
img {
|
||||
object-fit: contain;
|
||||
}
|
||||
|
|
@ -138,38 +142,3 @@ section.content--small-right-column {
|
|||
margin-block: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*********************
|
||||
* 2 COLUMN CONTAINER
|
||||
*********************/
|
||||
|
||||
main.content > .two-column {
|
||||
display: grid;
|
||||
grid-column: main-start / main-end;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
||||
&.wide {
|
||||
grid-column: wide-gutter-start / wide-gutter-end;
|
||||
}
|
||||
|
||||
> :first-child {
|
||||
grid-column: unset;
|
||||
}
|
||||
|
||||
> :last-child {
|
||||
grid-column: unset;
|
||||
}
|
||||
|
||||
> .figure {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&:has(figure:first-child + figure:last-child) {
|
||||
gap: var(--space-xs);
|
||||
grid-column: wide-gutter-start / wide-gutter-end;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -82,7 +82,7 @@ h4 {
|
|||
font-size: var(--text-m);
|
||||
}
|
||||
|
||||
p, dd {
|
||||
p {
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -9,29 +9,21 @@
|
|||
|
||||
.figure {
|
||||
grid-column: wide-gutter-start / wide-gutter-end;
|
||||
}
|
||||
|
||||
.figure--main-column {
|
||||
grid-column: main-start / main-end;
|
||||
}
|
||||
|
||||
.figure--code {
|
||||
grid-column: gutter-start / gutter-end;
|
||||
}
|
||||
|
||||
|
||||
.figure {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
|
||||
&:has(> img:only-child) {
|
||||
.figure__container {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: var(--body-item-spacing);
|
||||
grid-column: wide-gutter-start / wide-gutter-end;
|
||||
justify-content: center;
|
||||
min-width: fit-content;
|
||||
}
|
||||
|
||||
&:has(.youtube) {
|
||||
display: block;
|
||||
grid-template-columns: unset;
|
||||
&:has(> img:only-child, .figure__container > img:only-child) {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
> a:has(img:only-child) {
|
||||
|
|
@ -54,28 +46,20 @@
|
|||
}
|
||||
|
||||
|
||||
.figure :is(img, video) {
|
||||
.figure--main-column {
|
||||
grid-column: main-start / main-end;
|
||||
}
|
||||
|
||||
|
||||
.figure--code {
|
||||
grid-column: gutter-start / gutter-end;
|
||||
}
|
||||
|
||||
|
||||
.figure--youtube {
|
||||
grid-column: wide-gutter-start / wide-gutter-end;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.figure--small {
|
||||
display: flow;
|
||||
margin-inline: auto;
|
||||
|
||||
img {
|
||||
max-width: 480px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.figure video {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.figure .youtube {
|
||||
.youtube {
|
||||
width: 100%;
|
||||
|
||||
iframe {
|
||||
|
|
@ -83,6 +67,7 @@
|
|||
margin-bottom: -3px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -93,8 +78,3 @@ figcaption {
|
|||
grid-column: main-start / main-end;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
|
||||
|
||||
.content-grid > .figure {
|
||||
grid-column: unset;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,10 +12,8 @@ ol,
|
|||
ul
|
||||
{
|
||||
grid-column: main-start / main-end;
|
||||
margin-block: 0;
|
||||
}
|
||||
|
||||
|
||||
ol {
|
||||
display: grid;
|
||||
grid-template-columns: min-content 1fr;
|
||||
|
|
@ -48,7 +46,6 @@ ol {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
ul {
|
||||
list-style-type: "*";
|
||||
padding-inline-start: 1ch;
|
||||
|
|
@ -58,7 +55,6 @@ ul {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
li {
|
||||
&::marker, &::before {
|
||||
color: var(--text-color-secondary);
|
||||
|
|
@ -66,15 +62,15 @@ li {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
dl {
|
||||
dd {
|
||||
color: var(--text-color-secondary);
|
||||
font-size: var(--text-s);
|
||||
margin-inline: var(--space-l);
|
||||
font-style: italic;
|
||||
line-height: 1.2;
|
||||
margin-inline-start: var(--space-l);
|
||||
|
||||
&:has(+ dt) {
|
||||
margin-block-end: var(--space-paragraph);
|
||||
margin-block-end: var(--space-xs);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,12 +37,12 @@
|
|||
padding-inline-start: 0;
|
||||
}
|
||||
|
||||
.tag__list-item {
|
||||
.tag__value__list-item {
|
||||
padding-inline-start: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tag__list-item:not(:first-child)::before {
|
||||
.tag__value__list-item:not(:first-child)::before {
|
||||
color: var(--text-color-secondary);
|
||||
content: ":";
|
||||
margin-inline-end: var(--spacing);
|
||||
|
|
|
|||
|
|
@ -1,13 +0,0 @@
|
|||
|
||||
|
||||
|
||||
|
||||
|
||||
/***************
|
||||
* CONTENT GRID
|
||||
***************/
|
||||
|
||||
.content-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(var(--columns), 1fr);
|
||||
}
|
||||
|
|
@ -6,6 +6,7 @@
|
|||
font-size: var(--text-s);
|
||||
|
||||
hr {
|
||||
border-top: 2px dashed var(--gray6);
|
||||
margin-block-start: var(--space-xl);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -31,10 +31,9 @@
|
|||
}
|
||||
|
||||
.page-date {
|
||||
color: var(--text-color-secondary);
|
||||
display: block;
|
||||
font-family: var(--font-family-body);
|
||||
font-size: var(--text-s);
|
||||
margin-block: var(--space-xs) 0;
|
||||
margin-block: var(--space-paragraph) 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,27 +15,27 @@
|
|||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.prev, .next {
|
||||
li {
|
||||
display: block;
|
||||
padding-inline: 0;
|
||||
}
|
||||
|
||||
.next {
|
||||
.next-page {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.prev::before,
|
||||
.next::after {
|
||||
.previous-page::before,
|
||||
.next-page::after {
|
||||
color: var(--text-color-secondary);
|
||||
font-family: var(--font-family-monospace);
|
||||
}
|
||||
|
||||
.prev::before {
|
||||
.previous-page::before {
|
||||
content: "<-";
|
||||
padding-inline-end: var(--space-s);
|
||||
}
|
||||
|
||||
.next::after {
|
||||
.next-page::after {
|
||||
content: "->";
|
||||
padding-inline-start: var(--space-s);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,15 +5,10 @@ draftYes: "YES"
|
|||
draftNo: "NO"
|
||||
|
||||
home: Home
|
||||
|
||||
instagram: Instagram
|
||||
tableOfContents: Table of Contents
|
||||
|
||||
# Title of section of a list page where years older than
|
||||
# .Site.Params.blog.yearLimit are collapsed into a bulleted list.
|
||||
olderPagesSectionTitle: Older
|
||||
|
||||
source: Source
|
||||
|
||||
tableOfContents: Table of Contents
|
||||
|
||||
yearsTagTitle: Years
|
||||
|
|
|
|||
|
|
@ -12,7 +12,6 @@
|
|||
<footer class="site-footer">
|
||||
{{ partialCached "site/footer.html" . }}
|
||||
</footer>
|
||||
{{ block "after_content" . }}{{ end }}
|
||||
{{ partial "base/body-extras.html" . }}
|
||||
</body>
|
||||
{{- block "after_js" . }}{{ end }}
|
||||
|
|
|
|||
|
|
@ -20,9 +20,3 @@
|
|||
</footer>
|
||||
</main>
|
||||
{{ end }}
|
||||
|
||||
{{ define "after_content" }}
|
||||
{{ range .Resources.Match "*.css" }}
|
||||
<link rel="stylesheet" href="{{ .RelPermalink }}">
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -12,9 +12,3 @@
|
|||
</footer>
|
||||
</main>
|
||||
{{ end }}
|
||||
|
||||
{{ define "after_content" }}
|
||||
{{ range .Resources.Match "*.css" }}
|
||||
<link rel="stylesheet" href="{{ .RelPermalink }}">
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
{{- $dateName := .date -}}
|
||||
|
||||
{{- $name := "" -}}
|
||||
{{- $date := $page.PublishDate -}}
|
||||
{{- $date := $page.Date -}}
|
||||
|
||||
{{- if or (not $dateName) (eq $dateName "date") }}
|
||||
{{- $name = T "datePublishedName" -}}
|
||||
|
|
|
|||
|
|
@ -1,6 +0,0 @@
|
|||
<figcaption>
|
||||
{{ .resource.Title | markdownify }}
|
||||
{{ with .resource.Params.source -}}
|
||||
{{ partial "page/figures/resource-source.html" . }}
|
||||
{{- end -}}
|
||||
</figcaption>
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
{{- $image := .resource -}}
|
||||
|
||||
{{- $isSVG := strings.Contains $image.MediaType.SubType "svg" -}}
|
||||
{{- $linksToFullSizeImage := and .linksToFullSizeImage (not $isSVG) -}}
|
||||
|
||||
{{- $resizedImages := dict "full" $image -}}
|
||||
{{- if not $isSVG -}}
|
||||
{{-
|
||||
$resizedImages := dict
|
||||
"full" ($image.Fit "2560x2560")
|
||||
"half" ($image.Fit "1280x1280")
|
||||
"quarter" ($image.Fit "640x640")
|
||||
-}}
|
||||
{{ end }}
|
||||
|
||||
{{- $classes := slice "figure" "figure--image" -}}
|
||||
{{- if eq .size "main" -}}
|
||||
{{ $classes = $classes | append "figure--main-column" }}
|
||||
{{- end -}}
|
||||
{{- with .class -}}
|
||||
{{ $classes = $classes | append . }}
|
||||
{{- end -}}
|
||||
|
||||
<figure class="{{ delimit $classes " " }}">
|
||||
{{ if $linksToFullSizeImage -}}
|
||||
<a href="{{ $image.RelPermalink }}">
|
||||
{{- end -}}
|
||||
<img
|
||||
src="{{ (index $resizedImages "full").RelPermalink }}"
|
||||
{{ if gt (len $resizedImages) 1 -}}
|
||||
srcset="
|
||||
{{ (index $resizedImages "full").RelPermalink }} 2560w,
|
||||
{{ (index $resizedImages "half").RelPermalink }} 1280w,
|
||||
{{ (index $resizedImages "quarter").RelPermalink }} 640w,
|
||||
"
|
||||
{{ end }}
|
||||
{{ with $image.Params.alt | default $image.Title }} alt="{{ . }}"{{ end }}
|
||||
{{ with $image.Title }} title="{{ . }}"{{ end }}>
|
||||
{{ if .linksToFullSizeImage -}}
|
||||
</a>
|
||||
{{- end -}}
|
||||
{{ if .shouldShowTitle }}
|
||||
{{ partial "page/figures/caption.html" . }}
|
||||
{{ end }}
|
||||
</figure>
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
{{- $video := .resource -}}
|
||||
|
||||
<figure class="figure figure--video">
|
||||
<video controls>
|
||||
<source src="{{ $video.RelPermalink }}" type="{{ $video.MediaType.Type }}">
|
||||
</video>
|
||||
{{ if .shouldShowTitle }}
|
||||
{{ partial "page/figures/caption.html" . }}
|
||||
{{ end }}
|
||||
</figure>
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
{# TODO: Accommodate multiple images here #}
|
||||
{{- $resource := index .images 0 -}}
|
||||
|
||||
{{- if eq $resource.ResourceType "image" -}}
|
||||
{{ partial "page/figures/fullwidth-image.html" (merge . (dict "resource" $resource)) }}
|
||||
{{- else if eq $resource.ResourceType "video" -}}
|
||||
{{ partial "page/figures/fullwidth-video.html" (merge . (dict "resource" $resource)) }}
|
||||
{{- end -}}
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
{{- $image := .page.Resources.GetMatch .name -}}
|
||||
|
||||
{{ if not $image }}
|
||||
{{ errorf "No images named '%s' found. %s " .name .page.Permalink }}
|
||||
{{ end }}
|
||||
|
||||
{{ if ne $image.MediaType.SubType "svg" }}
|
||||
{{ errorf "Only SVGs may be inlined. %s" $image.Permalink }}
|
||||
{{ end }}
|
||||
|
||||
{{- $classes := slice "figure" "figure--image" "figure--inline-image" -}}
|
||||
{{- if eq .size "main" -}}
|
||||
{{ $classes = $classes | append "figure--main-column" }}
|
||||
{{- end -}}
|
||||
{{- with .class -}}
|
||||
{{ $classes = $classes | append . }}
|
||||
{{- end -}}
|
||||
|
||||
<figure class="{{ delimit $classes " " }}">
|
||||
{{ $image.Content | safeHTML }}
|
||||
{{ if .shouldShowTitle }}
|
||||
{{ partial "page/figures/caption.html" (merge . (dict "resource" $image)) }}
|
||||
{{ end }}
|
||||
</figure>
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
<span class="figure__source">
|
||||
{{ if and .title .url }}
|
||||
{{ i18n "source" }}: <a href="{{ .url }}">{{ .title }}</a>.
|
||||
{{ else if .title }}
|
||||
{{ .title }}
|
||||
{{ else }}
|
||||
{{ $sourceTitle := "" }}
|
||||
{{ $parsedURL := urls.Parse .url }}
|
||||
{{ if strings.Contains $parsedURL.Hostname "instagram.com" }}
|
||||
{{ $sourceTitle = i18n "instagram" }}
|
||||
{{ end }}
|
||||
|
||||
{{ if gt (len $sourceTitle) 0 }}
|
||||
{{ i18n "source" }}: <a href="{{ .url }}">{{ $sourceTitle }}</a>
|
||||
{{ else }}
|
||||
<a href="{{ .url }}">{{ i18n "source" }}</a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</span>
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
{{- $image := .resource -}}
|
||||
|
||||
{{-
|
||||
$resizedImages := dict
|
||||
"2x" ($image.Fit "960x960")
|
||||
"1x" ($image.Fit "480x480")
|
||||
-}}
|
||||
|
||||
<figure class="figure figure--image figure--small">
|
||||
{{ if .linksToFullSizeImage -}}
|
||||
<a href="{{ $image.RelPermalink }}">
|
||||
{{- end -}}
|
||||
<img
|
||||
src="{{ (index $resizedImages "2x").RelPermalink }}"
|
||||
srcset="
|
||||
{{ (index $resizedImages "2x").RelPermalink }} 960w,
|
||||
{{ (index $resizedImages "1x").RelPermalink }} 480w,
|
||||
"
|
||||
{{ with $image.Params.alt | default $image.Title }} alt="{{ . }}"{{ end }}
|
||||
{{ with $image.Title }} title="{{ . }}"{{ end }}>
|
||||
{{ if .linksToFullSizeImage -}}
|
||||
</a>
|
||||
{{- end -}}
|
||||
{{ if .shouldShowTitle }}
|
||||
{{ partial "page/figures/caption.html" . }}
|
||||
{{ end }}
|
||||
</figure>
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
{{- $page := .page -}}
|
||||
{{- $shouldShowTitle := .shouldShowTitle -}}
|
||||
|
||||
{# TODO: Accommodate multiple images here. #}
|
||||
{{- $resource := index .images 0 -}}
|
||||
{{- if not $resource }}
|
||||
{{ errorf "No resource named '%s'. %s" .name .page.Permalink }}
|
||||
{{ end -}}
|
||||
|
||||
{{- if eq $resource.ResourceType "image" -}}
|
||||
{{ partial "page/figures/small-image.html" (merge . (dict "resource" $resource)) }}
|
||||
{{- end -}}
|
||||
|
|
@ -1,18 +1,18 @@
|
|||
{{ if .FirstSection }}
|
||||
{{- $pages := (where .FirstSection.RegularPagesRecursive "Draft" "eq" false).ByDate -}}
|
||||
{{- $pages := where .FirstSection.RegularPagesRecursive "Draft" "eq" false -}}
|
||||
{{- $previousInSection := $pages.Prev . -}}
|
||||
{{- $nextInSection := $pages.Next . -}}
|
||||
|
||||
{{ if or $previousInSection $nextInSection }}
|
||||
<ul class="page-navigation">
|
||||
{{ with $nextInSection -}}
|
||||
<li class="prev">
|
||||
<li class="previous-page">
|
||||
<a href="{{ .Permalink }}">{{ .LinkTitle | markdownify }}</a>
|
||||
</li>
|
||||
{{- end }}
|
||||
|
||||
{{ with $previousInSection -}}
|
||||
<li class="next">
|
||||
<li class="next-page">
|
||||
<a href="{{ .Permalink }}">{{ .LinkTitle | markdownify }}</a>
|
||||
</li>
|
||||
{{- end }}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
{{- $years := .years -}}
|
||||
{{- $includeCollapsedYearItem := .includeCollapsedYearItem -}}
|
||||
<nav class="year-nav tag">
|
||||
<span class="tag__name">{{ i18n "yearsTagTitle" }}</span>
|
||||
<ul class="tag__value--list">
|
||||
{{ range .years -}}
|
||||
<li class="tag__list-item"><a href="#{{ .Date | time.Format "2006" }}">{{ .LinkTitle }}</a></li>
|
||||
{{ range $years -}}
|
||||
<li class="tag__value__list-item"><a href="#{{ .Date | time.Format "2006" }}">{{ .LinkTitle }}</a></li>
|
||||
{{ end }}
|
||||
{{ if .includeCollapsedYearItem -}}
|
||||
<li class="tag__list-item"><a href="#older">{{ i18n "olderPagesSectionTitle" }}</a></li>
|
||||
{{ if $includeCollapsedYearItem -}}
|
||||
<li class="tag__value__list-item"><a href="#older">{{ i18n "olderPagesSectionTitle" }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -16,9 +16,7 @@
|
|||
<div class="tag">
|
||||
<span class="tag__name">{{ $name }}</span>
|
||||
<ul class="tag__value--list" data-name="{{ $name }}">
|
||||
{{ range . -}}
|
||||
<li class="tag__list-item"><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></li>
|
||||
{{- end -}}
|
||||
{{ range . }}<li class="tag__value__list-item"><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>{{ end }}
|
||||
</ul>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
{{- end }}
|
||||
|
||||
{{ if not .page.IsNode }}
|
||||
{{- with .page.PublishDate -}}
|
||||
{{- with .page.Date -}}
|
||||
<time class="page-date" datetime="{{ . | time.Format "2006-01-02" }}">
|
||||
{{- . | time.Format "January 02, 2006" -}}
|
||||
</time>
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
{{- $size := .Get 0 | default "main" -}}
|
||||
|
||||
{{- $classes := slice "two-column" -}}
|
||||
{{- if eq $size "wide" -}}
|
||||
{{- $classes = $classes | append "wide" -}}
|
||||
{{- end -}}
|
||||
|
||||
<div class="{{ delimit $classes " " }}">
|
||||
{{ .Inner }}
|
||||
</div>
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
{{- $columns := .Get "columns" -}}
|
||||
<div class="content-grid" style="--columns: {{ $columns }};">
|
||||
{{ .Inner }}
|
||||
</div>
|
||||
|
|
@ -4,7 +4,7 @@
|
|||
{{- $id := .Get "id" | default (.Get 0) -}}
|
||||
{{- $class := .Get "class" | default (.Get 1) -}}
|
||||
{{- $title := .Get "title" | default "YouTube Video" }}
|
||||
<figure class="figure{{ with $class }} {{ . }}{{ end }}">
|
||||
<figure class="figure--youtube{{ with $class }} {{ . }}{{ end }}">
|
||||
<div class="youtube">
|
||||
<iframe src="https://{{ $ytHost }}/embed/{{ $id }}{{ with .Get "autoplay" }}{{ if eq . "true" }}?autoplay=1{{ end }}{{ end }}" allowfullscreen frameborder=0 title="{{ $title }}"></iframe>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue