refactor youtube shortocde with direct site keys - add before/after padding
parent
7667e7d097
commit
644649597d
|
@ -1,21 +1,18 @@
|
|||
{{ if .IsNamedParams }}
|
||||
{{ with $.Site.Params.youtube }}{{ $.Scratch.Set "maxwidth" .maxwidth }}{{ end }}
|
||||
{{ with .Get "maxwidth" }}{{ $.Scratch.Set "maxwidth" . }}{{ end }}
|
||||
{{ with $.Site.Params.youtube }}{{ $.Scratch.Set "wpad" .wpad }}{{ end }}
|
||||
{{ with .Get "wpad" }}{{ $.Scratch.Set "wpad" . }}{{ end }}
|
||||
{{ with $.Site.Params.youtube }}{{ $.Scratch.Set "noThumb" .disable_thumb }}{{ end }}
|
||||
{{ with .Get "nothumb" }}{{ $.Scratch.Set "noThumb" . }}{{ end }}
|
||||
<div class="box box--column">
|
||||
{{ $.Scratch.Set "maxwidth" ( $.Page.Site.Params.youtube.maxwidth | .Get "maxwidth" ) }}
|
||||
{{ $.Scratch.Set "wpad" ( $.Page.Site.Params.youtube.wpad | .Get "wpad" ) }}
|
||||
{{ $.Scratch.Set "nothumb" ( $.Page.Site.Params.youtube.disable_thumb | .Get "nothumb" ) }}
|
||||
<div class="box box--embed box--column box--youtube">
|
||||
{{ with .Get "title" }}
|
||||
<div class="box__title">{{ . }}</div>
|
||||
{{ end }}
|
||||
<div class="box box--embed box--youtube"
|
||||
<div
|
||||
youtube_id="{{ .Get "id" }}"
|
||||
{{ with .Get "start"}} start="{{ . }}"{{ end }}
|
||||
{{ with .Get "plist"}} list="{{ . }}"{{ end }}
|
||||
{{ with $.Scratch.Get "maxwidth"}} maxWidth="{{ . }}"{{ end }}
|
||||
{{ with $.Scratch.Get "wpad"}} wPad="{{ . }}"{{ end }}
|
||||
{{ with $.Scratch.Get "noThumb"}} nothumb="yes" {{ end }}
|
||||
{{ with $.Scratch.Get "nothumb"}} nothumb="yes" {{ end }}
|
||||
>
|
||||
<!-- thumb and video get put here -->
|
||||
</div>
|
||||
|
@ -25,11 +22,10 @@
|
|||
</div>
|
||||
{{ else }}
|
||||
{{ $numOfParams := ( len .Params ) }}
|
||||
{{ with $.Site.Params.youtube }}{{ $.Scratch.Set "noThumb" .disable_thumb }}{{ end }}
|
||||
<div class="box box--embed box--youtube"
|
||||
youtube_id="{{ .Get 0 }}"
|
||||
{{ if eq $numOfParams 2 }} start="{{ .Get 1 }}"{{ end }}
|
||||
{{ with $.Scratch.Get "noThumb"}} nothumb="yes" {{ end }}
|
||||
{{ with $.Page.Site.Params.youtube.disable_thumb }} nothumb="yes" {{ end }}
|
||||
>
|
||||
<!-- image or iframe injected here -->
|
||||
</div>
|
||||
|
|
|
@ -176,6 +176,22 @@
|
|||
flex-flow: wrap;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
||||
.box--embed::before {
|
||||
content: "";
|
||||
height: 0.5em;
|
||||
}
|
||||
|
||||
.box--embed::after {
|
||||
content: "";
|
||||
height: 0.5em;
|
||||
}
|
||||
|
||||
.box--btn-bar {
|
||||
padding-top: 0.5em;
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
|
||||
|
@ -184,6 +200,15 @@
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.box__caption {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.box__title {
|
||||
text-transform: capitalize;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.box--image {
|
||||
max-width: 450px;
|
||||
padding: 0.5em;
|
||||
|
@ -197,12 +222,10 @@
|
|||
|
||||
.box--btn {
|
||||
padding: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.box--btn-bar > .box--btn {
|
||||
margin-right: 0.2em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.btn__text {
|
||||
|
@ -246,7 +269,7 @@
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
/*may get rid of thise*/
|
||||
/*may get rid of this after fixing embed shortcode */
|
||||
.box__embed {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
@ -259,6 +282,7 @@
|
|||
.box--embed {
|
||||
flex-direction: column;
|
||||
flex-wrap: nowrap;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.thumb--yt {
|
||||
|
@ -267,26 +291,18 @@
|
|||
justify-content: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
-webkit-filter: brightness(.8);
|
||||
}
|
||||
|
||||
.thumb--yt:hover {
|
||||
-webkit-filter: brightness(1.2);
|
||||
-webkit-filter: brightness(1);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.thumb--yt > .play-button {
|
||||
font-size: 4em;
|
||||
}
|
||||
|
||||
.box__caption {
|
||||
text-transform: capitalize;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.box__title {
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
padding-top: 0.75em;
|
||||
font-size: 3.5em;
|
||||
color: red;
|
||||
text-shadow: 3px 3px black;
|
||||
}
|
||||
|
||||
.box__embed--disqus {
|
||||
|
|
Loading…
Reference in New Issue