diff options
| author | Jieiku | 2022-05-31 01:45:54 -0700 |
|---|---|---|
| committer | Jieiku | 2022-05-31 01:45:54 -0700 |
| commit | d4a052e86f33ced79b9f4d09aeee0b1c43ef1f23 (patch) | |
| tree | 68b40eed2c6047850d25f5d812d596cb74a2cd96 /templates/shortcodes | |
| parent | 6719a3b149ec630aacec164df325de1b61221761 (diff) | |
| download | abridge-d4a052e86f33ced79b9f4d09aeee0b1c43ef1f23.tar.gz abridge-d4a052e86f33ced79b9f4d09aeee0b1c43ef1f23.tar.bz2 abridge-d4a052e86f33ced79b9f4d09aeee0b1c43ef1f23.zip | |
Improve imghover shortcode, examples, page scores
Diffstat (limited to 'templates/shortcodes')
| -rw-r--r-- | templates/shortcodes/imagehover.html | 21 | ||||
| -rw-r--r-- | templates/shortcodes/vm.html | 2 | ||||
| -rw-r--r-- | templates/shortcodes/yt.html | 2 |
3 files changed, 18 insertions, 7 deletions
diff --git a/templates/shortcodes/imagehover.html b/templates/shortcodes/imagehover.html index 68f25be..99dd4e4 100644 --- a/templates/shortcodes/imagehover.html +++ b/templates/shortcodes/imagehover.html @@ -8,22 +8,33 @@ {%- else %} <div id="{{ sourcename }}">## {{ sourcename }} </div> - <a onmouseover="document.getElementById('{{ sourcename }}').innerHTML='{{ bgname }}';" onmouseout="document.getElementById('{{ sourcename }}').innerHTML='{{ sourcename }}';" href="#"><div id="{{ sourcename }}image"> </div></a> + <div id="{{ sourcename }}image" alt="{{ sourcename }}"> </div> {%- endif %} {%- endfor %} +{%- if w and h and p %} + {%- set padding = h / w * p %} +{%- elif w and h %} + {%- set padding = h / w * 50 %} +{%- else %} + {%- set padding = 50 %} +{%- endif %} + <style> {%- for source in sources %} {%- set sourcename = source | split(pat=".") | first %} {%- if not loop.first %} #{{ sourcename | safe }}image { - background-image: url('{{ get_url(path="/", trailing_slash=false) }}{{ page.path | safe }}{{ source | safe }}'); - width: 560px; - height: 650px; + background-image: url('{{ get_url(path="/", trailing_slash=false) }}{{ page.path | safe }}{{ bg | safe }}'); + background-size: contain; + background-repeat: no-repeat; + width: {{ p | default(value=50) }}%; + height: 0; + padding-top: {{ padding }}%; } #{{ sourcename | safe }}image:hover { - background-image: url('{{ get_url(path="/", trailing_slash=false) }}{{ page.path | safe }}{{ bg | safe }}'); + background-image: url('{{ get_url(path="/", trailing_slash=false) }}{{ page.path | safe }}{{ source | safe }}'); } {%- endif %} {%- endfor %} diff --git a/templates/shortcodes/vm.html b/templates/shortcodes/vm.html index 230e557..70230fe 100644 --- a/templates/shortcodes/vm.html +++ b/templates/shortcodes/vm.html @@ -1,3 +1,3 @@ <div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;"> - <iframe src="https://player.vimeo.com/video/{{id}}" style="position:absolute;top:0;left:0;"></iframe> + <iframe src="https://player.vimeo.com/video/{{id}}" title="{{title | default(value="Vimeo") }}" style="position:absolute;top:0;left:0;"></iframe> </div> diff --git a/templates/shortcodes/yt.html b/templates/shortcodes/yt.html index 7816bd8..9ee9d1f 100644 --- a/templates/shortcodes/yt.html +++ b/templates/shortcodes/yt.html @@ -1,3 +1,3 @@ <div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;"> - <iframe src="https://www.youtube.com/embed/{{id}}{% if autoplay %}?autoplay=1{% endif %}" style="position:absolute;top:0;left:0;"></iframe> + <iframe src="https://www.youtube.com/embed/{{id}}{% if autoplay %}?autoplay=1{% endif %}" title="{{title | default(value="Youtube") }}" style="position:absolute;top:0;left:0;"></iframe> </div> |