From 50cebc445cdc1184b06407b79ce25c2168956c27 Mon Sep 17 00:00:00 2001 From: "kam (from the studio)" Date: Wed, 16 Mar 2022 21:20:07 +0100 Subject: [PATCH] bleeding the images --- postit/static/contents | 2 +- postit/static/css/postit.css | 4 - postit/static/js/bleed.js | 12 +++ postit/templates/postit-single.html | 138 ++++++++++++++-------------- 4 files changed, 80 insertions(+), 76 deletions(-) create mode 100644 postit/static/js/bleed.js diff --git a/postit/static/contents b/postit/static/contents index 10ecbff..562939f 160000 --- a/postit/static/contents +++ b/postit/static/contents @@ -1 +1 @@ -Subproject commit 10ecbff65c004a9593ec92ba5e66cd0a870dfdcd +Subproject commit 562939fbe79e6b3a2200d127add45a40b03a1e87 diff --git a/postit/static/css/postit.css b/postit/static/css/postit.css index 793da56..c153653 100644 --- a/postit/static/css/postit.css +++ b/postit/static/css/postit.css @@ -20,10 +20,6 @@ body { box-sizing: border-box; } -.container { - font-size: 0; -} - .post-it { position: relative; vertical-align: middle; diff --git a/postit/static/js/bleed.js b/postit/static/js/bleed.js new file mode 100644 index 0000000..85574c9 --- /dev/null +++ b/postit/static/js/bleed.js @@ -0,0 +1,12 @@ +// Wait for Flask, Jinja2, and Paged.js to do their things +setTimeout(getImages, 2500); + +function getImages() { + const images = document.querySelectorAll("[data-image]"); + Array.from(images).forEach((img) => moveImage(img)); +} + +function moveImage(img) { + let parent = img.closest(".pagedjs_sheet"); + parent.prepend(img); +} diff --git a/postit/templates/postit-single.html b/postit/templates/postit-single.html index 5eedda2..3f7dddd 100644 --- a/postit/templates/postit-single.html +++ b/postit/templates/postit-single.html @@ -8,92 +8,88 @@ + -
- {% for content in contents %} + {% for content in contents %} -
- {%if content['img'] %} - {{content['description']}} -
{{content['description']}}
- {%elif content['card']%} +
+ {%if content['img'] %} + {{content['description']}} +
{{content['description']}}
+ {%elif content['card']%} -
{{content['card']}}
-
{{content['quote']}}
-
-
Motivation
-
{{content['motivation']}}
+
{{content['card']}}
+
{{content['quote']}}
+
+
Motivation
+
{{content['motivation']}}
-
Empathy
-
{{content['empathy']}}
+
Empathy
+
{{content['empathy']}}
-
Vision
-
{{content['vision']}}
+
Vision
+
{{content['vision']}}
-
Positivity
-
{{content['positivity']}}
-
+
Positivity
+
{{content['positivity']}}
+
- {%elif content['definition']%} + {%elif content['definition']%} -
{{content['start']}} {{content['category']}}
+
{{content['start']}} {{content['category']}}
-

- {{content['definition']}} -

+

+ {{content['definition']}} +

-
-

{{content['title']}}

- -
+
+

{{content['title']}}

+ +
- {%elif content['type'] == 'mimic-colophon'%} + {%elif content['type'] == 'mimic-colophon'%} -
-
{{content['original']}}
-
{{content['original-credits']}}
-
{{content['original-action']}}
-
{{content['original-date']}}
-
-
{{content['current']}}
-
{{content['current-credits']}}
- {{content['current-action']}} -
{{content['current-date']}}
-
-
-

{{content['title']}}

- -
- {%else%} +
+
{{content['original']}}
+
{{content['original-credits']}}
+
{{content['original-action']}}
+
{{content['original-date']}}
+
+
{{content['current']}}
+
{{content['current-credits']}}
+ {{content['current-action']}} +
{{content['current-date']}}
+
+
+

{{content['title']}}

+ +
+ {%else%} -

- {{content['description']}} -

+

+ {{content['description']}} +

-
-

{{content['title']}}

- -
- {%endif%} -
- {% endfor %} + + {%endif%}
+ {% endfor %}