From 0a4d4ed9354f81f9cf21ab41586b3271cc6eba33 Mon Sep 17 00:00:00 2001 From: Michal Wolny Date: Wed, 13 Jan 2021 20:00:27 +0100 Subject: [PATCH 1/7] [dev-form-helpers] fix data-content and data-html attributes --- src/js/tabler.js | 4 ++-- src/pages/_docs/form-helpers.md | 2 +- src/pages/_docs/tooltips.md | 2 +- src/pages/_includes/forms/form-elements-1.html | 4 ++-- 4 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/js/tabler.js b/src/js/tabler.js index f221ae301..40617cc0d 100644 --- a/src/js/tabler.js +++ b/src/js/tabler.js @@ -11,7 +11,7 @@ import './dropdown'; tooltipTriggerList.map(function (tooltipTriggerEl) { let options = { delay: {show: 50, hide: 50}, - html: true, + html: tooltipTriggerEl.getAttribute("data-bs-html") === "true" ?? false, placement: tooltipTriggerEl.getAttribute('data-bs-placement') ?? 'auto' }; return new bootstrap.Tooltip(tooltipTriggerEl, options); @@ -23,7 +23,7 @@ import './dropdown'; popoverTriggerList.map(function (popoverTriggerEl) { let options = { delay: {show: 50, hide: 50}, - html: popoverTriggerEl.getAttribute('data-bs-html') ?? false, + html: popoverTriggerEl.getAttribute('data-bs-html') === "true" ?? false, placement: popoverTriggerEl.getAttribute('data-bs-placement') ?? 'auto' }; return new bootstrap.Popover(popoverTriggerEl, options); diff --git a/src/pages/_docs/form-helpers.md b/src/pages/_docs/form-helpers.md index cc9a2f4b4..8aaf45d50 100644 --- a/src/pages/_docs/form-helpers.md +++ b/src/pages/_docs/form-helpers.md @@ -10,6 +10,6 @@ menu: docs.components.form-helpers Use an input helper to display additional information about a form element. The text label will appear once a user hovers over the helper. {% capture code %} -? +? {% endcapture %} {% include example.html code=code %} diff --git a/src/pages/_docs/tooltips.md b/src/pages/_docs/tooltips.md index f311d0607..34980f842 100644 --- a/src/pages/_docs/tooltips.md +++ b/src/pages/_docs/tooltips.md @@ -32,7 +32,7 @@ Use the default markup to create tooltips that will help users understand partic If the default tooltip is not enough, you can add the option to use HTML code in the text to highlight particular bits of information and make the content more attractive. {% capture code %} - {% endcapture %} diff --git a/src/pages/_includes/forms/form-elements-1.html b/src/pages/_includes/forms/form-elements-1.html index d15c293fe..fa56d5d26 100644 --- a/src/pages/_includes/forms/form-elements-1.html +++ b/src/pages/_includes/forms/form-elements-1.html @@ -60,8 +60,8 @@
? + data-bs-content="

ZIP Code must be US or CDN format. You can use an extended ZIP+4 code to determine address more accurately.

USP ZIP codes lookup tools

" + data-bs-html="true">?
From 5e1f480c1be8d756c77685ae9c9c31e98187d0c8 Mon Sep 17 00:00:00 2001 From: Michal Wolny Date: Wed, 13 Jan 2021 20:09:30 +0100 Subject: [PATCH 2/7] [dev-toasts-initialization] initialize toasts on app start --- src/js/tabler.js | 5 +++++ src/pages/_includes/ui/toast.html | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/src/js/tabler.js b/src/js/tabler.js index f221ae301..fe8e52a4b 100644 --- a/src/js/tabler.js +++ b/src/js/tabler.js @@ -44,4 +44,9 @@ import './dropdown'; }); }); + let toastsTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="toast"]')); + toastsTriggerList.map(function (toastTriggerEl) { + return new bootstrap.Toast(toastTriggerEl); + }); + })(); diff --git a/src/pages/_includes/ui/toast.html b/src/pages/_includes/ui/toast.html index ba1904696..cec8a2764 100644 --- a/src/pages/_includes/ui/toast.html +++ b/src/pages/_includes/ui/toast.html @@ -1,6 +1,6 @@ {% assign person-id = include.person-id | default: 2 %} {% assign person = site.data.people[person-id] %} -