From 644649597d20cac9d27ed62ead9415858730ff7d Mon Sep 17 00:00:00 2001 From: David Kebler Date: Wed, 12 Apr 2017 12:32:04 -0700 Subject: [PATCH] refactor youtube shortocde with direct site keys - add before/after padding --- layouts/shortcodes/youtube.html | 18 +++++-------- static/css/page.css | 48 ++++++++++++++++++++++----------- 2 files changed, 39 insertions(+), 27 deletions(-) diff --git a/layouts/shortcodes/youtube.html b/layouts/shortcodes/youtube.html index 456f1cc..915ef98 100644 --- a/layouts/shortcodes/youtube.html +++ b/layouts/shortcodes/youtube.html @@ -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 }} -
+{{ $.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" ) }} +
{{ with .Get "title" }}
{{ . }}
{{ end }} -
@@ -25,11 +22,10 @@
{{ else }} {{ $numOfParams := ( len .Params ) }} -{{ with $.Site.Params.youtube }}{{ $.Scratch.Set "noThumb" .disable_thumb }}{{ end }}
diff --git a/static/css/page.css b/static/css/page.css index 1b20d1a..f17ae1d 100644 --- a/static/css/page.css +++ b/static/css/page.css @@ -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 {