Merge branch 'main' of https://github.com/WWWPiramalFinanceCOM/pirama…

…lfinance
WWWPiramalFinanceCOM · Jul 9, 2024 · 118708c · 118708c
2 parents e842f89 + f61028b
commit 118708c
Show file tree

Hide file tree

Showing 10 changed files with 335 additions and 25 deletions.
diff --git a/blocks/accordion/accordion.css b/blocks/accordion/accordion.css
@@ -360,6 +360,11 @@ ol .accordion ul {
     font-size: 18px;
 }
 
+.faq-accordion-css-with-orange-heading .accordion-group-wrapper .accordion-group.block.shade-box .accordion.block summary>div,
+.faq-accordion-css-with-orange-heading .accordion-group-wrapper .accordion-group.block.shade-box .accordion.block summary>div>p {
+    margin: 0;
+}
+
 /* .faq-accordion-css-with-orange-heading .accordion-group-wrapper .accordion-group.block.shade-box .accordion.block details>div>article>div,
 .faq-accordion-css-with-orange-heading .accordion-group-wrapper .accordion-group.block.shade-box .accordion.block details>div>article>div>article>div {
     margin: 0;
@@ -370,11 +375,18 @@ ol .accordion ul {
 } */
 
 /* End */
-@media screen and (max-width:768px) {
+@media screen and (max-width:767px) {
     .faq-section-wrapper .default-content-wrapper .button-container{
         width: 100%;
         font-size: 16px;
     }
+    .faq-section-wrapper.faq-accordion-css-with-orange-heading {
+        padding-top: 40px;
+        padding-bottom: 40px;
+    }
+    .faq-accordion-css-with-orange-heading .accordion-group-wrapper .accordion-group.block.shade-box .accordion.block summary>div {
+        width: 95%;
+    }
 }
 @media screen and (max-width:1024px) {
     .faq-accordion-css .accordion-group-wrapper {

diff --git a/blocks/footer/footer.js b/blocks/footer/footer.js
@@ -1,4 +1,6 @@
+import { footerInteraction } from '../../dl.js';
 import { getMetadata } from '../../scripts/aem.js';
+import { targetObject } from '../../scripts/scripts.js';
 import { loadFragment } from '../fragment/fragment.js';
 
 /**
@@ -17,4 +19,16 @@ export default async function decorate(block) {
   while (fragment.firstElementChild) footer.append(fragment.firstElementChild);
 
   block.append(footer);
+  block.querySelectorAll("li,p").forEach(function (el) {
+    el.addEventListener("click", function (e) {
+      e.stopPropagation();
+      if (e.target.closest(".footer-section-first") || e.target.closest(".footer-section-second")) {
+        console.log("click_text :: ", e.target.innerText);
+        console.log("menu_category :: ", e.target.closest("ul")?.closest("li")?.querySelector("p")?.innerText);
+        const click_text = e.target.innerText
+        const menu_category = e.target.closest("ul")?.closest("li")?.querySelector("p")?.innerText
+        footerInteraction(click_text, menu_category, null, targetObject.pageName);
+      }
+    })
+  })
 }
diff --git a/blocks/header/header.js b/blocks/header/header.js
@@ -1,4 +1,4 @@
-import { headerInteraction } from '../../dl.js';
+import { headerInteraction, navlogin } from '../../dl.js';
 import { getMetadata } from '../../scripts/aem.js';
 import { targetObject } from '../../scripts/scripts.js';
 import { loadFragment } from '../fragment/fragment.js';
@@ -129,16 +129,18 @@ export default async function decorate(block) {
           const expanded = navSection.getAttribute('aria-expanded') === 'true';
           toggleAllNavSections(navSections);
           navSection.setAttribute('aria-expanded', expanded ? 'false' : 'true');
-
-
-          const click_text = e.target.innerText;
-          const menu_category = e.target.closest("ul").closest("li")?.querySelector("p")?.innerText;
-          // console.log("click_text :: ", e.target.innerText);
-          // console.log("menu_category :: ", e.target.closest("ul").closest("li")?.querySelector("p")?.innerText);
-          // console.log("menu_category :: ", e.target.closest(".navigation-level-active")?.querySelector("p")?.innerText);
-          console.log(targetObject.ctaPosition);
-          console.log(targetObject.pageName);
-          headerInteraction(click_text, menu_category, targetObject.ctaPosition, targetObject.pageName);
+          try {
+            const click_text = e.target.innerText;
+            const menu_category = e.target.closest("ul").closest("li")?.querySelector("p")?.innerText;
+            // console.log("click_text :: ", e.target.innerText);
+            // console.log("menu_category :: ", e.target.closest("ul").closest("li")?.querySelector("p")?.innerText);
+            // console.log("menu_category :: ", e.target.closest(".navigation-level-active")?.querySelector("p")?.innerText);
+            // console.log(targetObject.ctaPosition);
+            // console.log(targetObject.pageName);
+            headerInteraction(click_text, menu_category, targetObject.ctaPosition, targetObject.pageName);
+          } catch (error) {
+            console.warn(error);
+          }
         } else if (isMobile.matches) {
           // Custom Event Function 
           const expanded = navSection.getAttribute('aria-expanded') === 'true';
@@ -208,6 +210,13 @@ export default async function decorate(block) {
   } catch (error) {
     console.warn(error);
   }
+  try {
+    block.querySelector(".nav-tools").addEventListener("click", function (e) {
+      navlogin(targetObject.pageName);
+    })
+  } catch (error) {
+    console.warn(error);
+  }
 }
 
 

diff --git a/blocks/imgwithlink/imgwithlink.js b/blocks/imgwithlink/imgwithlink.js
@@ -1,3 +1,6 @@
+import { outboundClick } from "../../dl.js";
+import { targetObject } from "../../scripts/scripts.js";
+
 export default function decorate(block) {
   const newDiv = createImageWithLink(block);
   if (newDiv) {
@@ -10,8 +13,12 @@ export default function decorate(block) {
 function createImageWithLink(block) {
   const isMobile = window.matchMedia("(max-width: 767px)").matches;
   const blockDiv = document.createElement("div");
+  const len = block.children.length;
+  const click_textel = block.children[len - 2];
+  const menu_categoryel = block.children[len - 1];
+  click_textel.remove();
+  menu_categoryel.remove();
   blockDiv.innerHTML = block.innerHTML.trim();
-
   const pictureIndex = isMobile ? 3 : 0;
   const textIndex = isMobile ? 5 : 2;
   const blockPic = blockDiv.children[pictureIndex]?.querySelector("picture") || blockDiv.children[0]?.querySelector("picture");
@@ -32,6 +39,12 @@ function createImageWithLink(block) {
   createDiv.classList.add(isMobile ? "image-href-mobile" : "image-href-desktop");
   createDiv.appendChild(createHref);
 
+  createDiv.addEventListener("click", function (e) {
+    debugger;
+    const click_text = click_textel.innerText.trim();
+    const menu_category = menu_categoryel.innerText.trim();
+    if (block.closest(".footer") && click_text && menu_category) outboundClick(click_text, menu_category, "footer", targetObject.pageName);
+  })
   return createDiv;
 }
 

diff --git a/component-models.json b/component-models.json
@@ -255,6 +255,20 @@
         "name": "href2",
         "value": "#",
         "label": "Link Mobile"
+      },
+      {
+        "component": "text",
+        "valueType": "string",
+        "name": "click_text",
+        "value": "",
+        "label": "click_text"
+      },
+      {
+        "component": "text",
+        "valueType": "string",
+        "name": "menu_category",
+        "value": "",
+        "label": "menu_category"
       }
     ]
   },

diff --git a/dl.js b/dl.js
@@ -1,10 +1,52 @@
 window.dataLayer = window.dataLayer || [];
 export function headerInteraction(click_text, menu_category, cta_position, page_type) {
-    window.dataLayer.push({
-        'event': 'header_interaction',
-        'click_text': click_text,
-        'menu_category': menu_category || click_text,
-        'cta_position': cta_position,
-        'page_type': page_type
-    });
+    try {
+        window.dataLayer.push({
+            'event': 'header_interaction',
+            'click_text': click_text,
+            'menu_category': menu_category || click_text,
+            'cta_position': cta_position,
+            'page_type': page_type
+        });
+    } catch (error) {
+        console.warn(error);
+    }
+}
+export function footerInteraction(click_text, menu_category, cta_position, page_type) {
+    try {
+        window.dataLayer.push({
+            'event': 'footer_interaction',
+            'click_text': click_text,
+            'menu_category': menu_category || click_text,
+            'cta_position': 'footer',
+            'page_type': page_type
+        });
+    } catch (error) {
+        console.warn(error);
+    }
+}
+
+export function outboundClick(click_text, menu_category, cta_position, page_type) {
+    try {
+        window.dataLayer.push({
+            'event': 'outbound_click',
+            'click_text': click_text,
+            'menu_category': menu_category,
+            'cta_position': cta_position,
+            'page_type': page_type
+        });
+    } catch (error) {
+        console.warn(error);
+    }
+}
+
+export function navlogin(page_type) {
+    try {
+        window.dataLayer.push({
+            'event': 'nav_login',
+            'page_type': page_type
+        });
+    } catch (error) {
+        console.warn(error);
+    }
 }
diff --git a/scripts/scripts.js b/scripts/scripts.js
@@ -461,6 +461,7 @@ async function loadingCustomCss() {
     `${window.hlx.codeBasePath}/styles/available-facilities/available-facilities.css`,
     `${window.hlx.codeBasePath}/styles/nearest-branches/nearest-branches.css`,
     `${window.hlx.codeBasePath}/styles/steps-for-apply/steps-for-apply.css`,
+    `${window.hlx.codeBasePath}/styles/csr-committee/csr-committee.css`,
     `${window.hlx.codeBasePath}/styles/grievance-redressal/grievance-redressal.css`,
   ]
 
@@ -478,6 +479,7 @@ body?.addEventListener("click", function (e) {
     document.body.style.overflow = "scroll";
     document.querySelector(".modal-overlay").classList.remove("overlay");
     document.querySelector(".modal-overlay").classList.add("dp-none");
+    document.querySelector(".modal-overlay").style.zIndex = 0;
   } else if (!e.target.closest('.nav-drop')) {
     console.log("don't close nav");
 
@@ -488,7 +490,7 @@ body?.addEventListener("click", function (e) {
       navSection.setAttribute('aria-expanded', 'false');
     });
   }
-   if (!e.target.closest(".stake-pop-up")) {
+  if (!e.target.closest(".stake-pop-up")) {
     document.querySelectorAll(".stake-pop-up").forEach((ele) => {
       ele.classList.remove("dp-block");
       ele.classList.add("dp-none");

diff --git a/styles/annualreports/annualreports.css b/styles/annualreports/annualreports.css
@@ -81,7 +81,62 @@
 
 /* offer documents start */
 
-.section.offer-documents-wrapper .default-content-wper ul>li>a::after {
+.section.offer-documents-wrapper .default-content-wrapper ul>li>p ,
+.section.offer-documents-wrapper .wrappercreation-wrapper .wrappercreation .wrapper-creation-container .offer-documents-wrapper .offer-documents .richtext .cmp-text >p{
+    background-color: #f8f8f8;
+    border-radius: 4px;
+    color: #333;
+    cursor: pointer;
+    display: block;
+    display: flex;
+    align-items: center;
+    font-family: Nunito-Regular, sans-serif;
+    font-size: 16px;
+    font-weight: 400;
+    line-height: 24px;
+    margin-bottom: 12px;
+    padding: 20px 61px 20px 24px;
+    position: relative;
+    width: 100%;
+}
+
+.section.offer-documents-wrapper .default-content-wrapper ul>li:first-child > p {
+    padding: 0;
+}
+
+.section.offer-documents-wrapper .default-content-wrapper ul>li>p>a{
+    color: #333;
+    margin: 0;
+    border: unset;
+    font-weight: 400;
+    background-color: unset;
+    border-radius: unset;
+    font-family: Nunito-Regular, sans-serif;
+    padding: 20px 61px 20px 24px;
+    text-align: unset;
+    width: 100%;
+}
+
+.section.offer-documents-wrapper .default-content-wrapper ul>li>p:hover,
+.section.offer-documents-wrapper .default-content-wrapper ul>li>p:hover > a,
+.section.offer-documents-wrapper .wrappercreation-wrapper .wrappercreation .wrapper-creation-container .offer-documents-wrapper .offer-documents .richtext .cmp-text:hover >p {
+    background: var(--orange);
+    color: var(--white);
+    text-decoration: none;
+}
+
+.section.offer-documents-wrapper .wrappercreation-wrapper .wrappercreation .wrapper-creation-container {
+    display: unset;
+    margin: 0;
+}
+
+.section.offer-documents-wrapper .wrappercreation-wrapper .wrappercreation .wrapper-creation-container .offer-documents-wrapper .offer-documents .richtext .cmp-text{
+   padding: 0;
+   box-shadow: unset;
+}
+
+.section.offer-documents-wrapper .default-content-wrapper ul>li>a::after,
+.section.offer-documents-wrapper .wrappercreation-wrapper .wrappercreation .wrapper-creation-container .offer-documents-wrapper .offer-documents .richtext .cmp-text >p::after {
     content: "";
     background-image: url('https://publish-p133703-e1305981.adobeaemcloud.com/content/dam/piramalfinance/company/stakeholders/download-icon.png');
     position: absolute;
@@ -94,7 +149,8 @@
     color: #333;
 }
 
-.section.offer-documents-wrapper .default-content-wrapper ul>li>a:hover::after {
+.section.offer-documents-wrapper .default-content-wrapper ul>li>a:hover::after,
+.section.offer-documents-wrapper .wrappercreation-wrapper .wrappercreation .wrapper-creation-container .offer-documents-wrapper .offer-documents .richtext .cmp-text:hover >p::after {
     content: "";
     background-image: url('https://publish-p133703-e1305981.adobeaemcloud.com/content/dam/piramalfinance/company/stakeholders/download-icon-white.png');
     position: absolute;
@@ -145,7 +201,7 @@
     overflow-y: auto;
     border-radius: unset;
     overflow-y: auto;
-    padding: 24px 77px 0 93px;
+    margin: 24px 77px 0 93px;
 }
 
 .section.offer-documents-wrapper .wrappercreation-wrapper .offer-documents-wrapper .offer-documents.block .richtext.text .stake-pop-up .popup .popupText .cmp-text .popup-parent-cont {
@@ -202,7 +258,7 @@
 
 @media screen and (max-width:1024px) {
     .section.offer-documents-wrapper .wrappercreation-wrapper .offer-documents-wrapper .offer-documents.block .richtext.text .stake-pop-up .popup .popupText .cmp-text {
-        padding: 24px 1pc 0;
+        margin: 24px 1pc 0;
     }
 }