From a7305f7eeb72df69e80f6a4a6cdab48dceb6f348 Mon Sep 17 00:00:00 2001
From: Jieiku
Date: Tue, 31 May 2022 01:11:55 -0700
Subject: ImageHover Shortcode, Font Resources

---
 templates/macros/head.html           |  6 +++---
 templates/shortcodes/imagehover.html | 26 ++++++++++++++++++++++++++
 2 files changed, 29 insertions(+), 3 deletions(-)
 create mode 100644 templates/shortcodes/imagehover.html

(limited to 'templates')

diff --git a/templates/macros/head.html b/templates/macros/head.html
index 3ea785a..2c18807 100644
--- a/templates/macros/head.html
+++ b/templates/macros/head.html
@@ -4,11 +4,11 @@
 
 
 {%- macro resource() %}
-{%- if config.extra.fonts_load and config.extra.fonts %}{%- for i in config.extra.fonts %}
+{%- if config.extra.fonts %}{%- for i in config.extra.fonts %}
   {%- if i.url is matching("^http[s]?://") %}
-  <link rel="preload" href="{{ i.url | safe }}" as="style" onload="this.onload=null;this.rel='stylesheet'" crossorigin="anonymous">
+  <link rel="preload" as="style" href="{{ i.url | safe }}" onload="this.onload=null;this.rel='stylesheet'" crossorigin="anonymous">
   {%- else %}
-  <link rel="preload" href="{{ get_url(path=i.url, trailing_slash=false) }}" as="style" onload="this.onload=null;this.rel='stylesheet'" crossorigin="anonymous">
+  <link rel="preload" as="font" href="{{ get_url(path=i.url, trailing_slash=false) | safe }}" type="font/woff2" crossorigin>
   {%- endif %}
 {%- endfor %}{%- endif %}
 
diff --git a/templates/shortcodes/imagehover.html b/templates/shortcodes/imagehover.html
new file mode 100644
index 0000000..350506c
--- /dev/null
+++ b/templates/shortcodes/imagehover.html
@@ -0,0 +1,26 @@
+{%- set_global bg = " " %}
+{%- for source in sources %}
+  {%- if not loop.first %}
+    ## {{ source | safe }}
+    <div id="hoverimage{{loop.index}}"> </div>
+  {%- else %}
+    {% set_global bg = source %}
+  {%- endif %}
+{%- endfor %}
+
+<style>
+  {%- for source in sources %}
+    {%- if not loop.first %}
+      #hoverimage{{loop.index}} {
+        background-image: url('{{ get_url(path="/", trailing_slash=false) }}{{ page.path | safe }}{{ source | safe }}');
+        width: 560px;
+        height: 650px;
+      }
+      #hoverimage{{loop.index}}:hover {
+        background-image: url('{{ get_url(path="/", trailing_slash=false) }}{{ page.path | safe }}{{ bg | safe }}');
+        width: 560px;
+        height: 650px;
+      }
+    {%- endif %}
+  {%- endfor %}
+</style>
-- 
cgit v1.3.1