diff --git a/_includes/tabs.html b/_includes/tabs.html index 128d57a28..7f0c87a32 100644 --- a/_includes/tabs.html +++ b/_includes/tabs.html @@ -1,6 +1,7 @@ {%- comment -%} **Parameters -tab_list(required): An array with items having the attributes title(required), content (required), include_src(optional) +tab_list(required): An array with items having the attributes title(required), content_text (required), +content_src(optional) active_tab_index(optional): Index of the tab to be active by default {%- endcomment -%} @@ -16,13 +17,14 @@ {% endfor %} + {% for tab in tabs %}

- {{ tab.content }} - {% if tab.include_src %} - {{ tab.include_src }} - - + {{ tab.content_text }} + {% if tab.content_src %} +

+ {% include {{tab.content_src}} %} +
{% endif %}

{% endfor %} @@ -31,16 +33,23 @@ $("#tabs-container ul li a").click(function () { const tabTitles = $(".tab-title"); for (let index = 0; index < tabTitles.length; index++) { + console.log("tabTitles[index]", tabTitles[index]); const tab = tabTitles[index]; tab.classList.remove("active"); } $(this).parent().addClass("active"); const tabContentId = $(this).attr("id").replace("tab-title-", "tab-content-"); + const tabSrcId = $(this).attr("id").replace("tab-title-", "tab-src-"); + console.log("tabContentId", tabContentId); + console.log("tabSrcId", tabSrcId); let tabContents = $(".tab-content"); + console.log("tabContents", tabContents); + for (let index = 0; index < tabContents.length; index++) { const tabContent = tabContents[index]; + console.log("tabContent", tabContent); switch (tabContent.id) { case tabContentId: @@ -52,5 +61,22 @@ break; } } + let tabSrcs = $(".tab-src"); + console.log("tabSrcs", tabSrcs); + + for (let index = 0; index < tabSrcs.length; index++) { + const tabSrc = tabSrcs[index]; + console.log("tabSrc", tabSrc); + + switch (tabSrc.id) { + case tabSrcId: + tabSrc.classList.remove("d-none"); + break; + default: + if (!tabSrc.classList.contains("d-none")) + tabSrc.classList.add("d-none"); + break; + } + } }); \ No newline at end of file diff --git a/checkout/v3/index.md b/checkout/v3/index.md index 9b07d0c33..356ffc6cf 100644 --- a/checkout/v3/index.md +++ b/checkout/v3/index.md @@ -32,36 +32,6 @@ table_content_authenticated: swedbankPay: true - label: PSP swedbankPay: true - -table_content_mac: - - label: Authentication - merchantSide: true - - label: Delivery Info - merchantSide: true - - label: Consumer Info - swedbankPay: true - - label: PSP - swedbankPay: true - -table_content_payments: - - label: Authentication - merchantSide: true - - label: Delivery Info - merchantSide: true - - label: Consumer Info - merchantSide: true - - label: PSP - swedbankPay: true - -tab_list: -- title: Checkout v2 - content: Checkout v2 was the generally available version of Checkout between 2018 - and 2021. Choose this if you have an **existing Checkout v2 - integration**. -- title: Checkout v3 - content: Coming soon… -- title: Checkout v3.1 - content: Even more new and fantastic --- ## Choose The Right Implementation For Your Business @@ -95,5 +65,3 @@ or two if that makes more sense for your business. - **PSP:** The service of providing payment methods in the checkout or payment menu. - -{% include tabs.html tab_list=page.tab_list active_tab_index=2 %} diff --git a/index.md b/index.md index fc3344385..93e4c9461 100644 --- a/index.md +++ b/index.md @@ -7,7 +7,35 @@ description: | scrambled it to make a type specimen book. menu_order: 0 sidebar_icon: home - +table_content_mac: + - label: Authentication + merchantSide: true + - label: Delivery Info + merchantSide: true + - label: Consumer Info + swedbankPay: true + - label: PSP + swedbankPay: true + +table_content_payments: + - label: Authentication + merchantSide: true + - label: Delivery Info + merchantSide: true + - label: Consumer Info + merchantSide: true + - label: PSP + swedbankPay: true + +tab_list: +- title: Checkout v2 + content_text: Checkout v2 was the generally available version of Checkout between 2018 + and 2021. Choose this if you have an **existing Checkout v2 + integration**. +- title: Checkout v3 + content_text: Coming soon… +- title: Checkout v3.1 + content_text: Even more new and fantastic --- {% include card-list.html card_list=page.card_list col_class="col-lg-4" %} @@ -161,6 +189,10 @@ Here we have also formatted the content as two paragraphs with padding. +## Tabs + +{% include tabs.html tab_list=page.tab_list active_tab_index=2 %} + ## Table Here's a nice table.