Merge pull request #536 from WWWPiramalFinanceCOM/feature/optimization

Feature/optimization
WWWPiramalFinanceCOM · Oct 10, 2024 · a66817c · a66817c
2 parents b918494 + d7f7090
commit a66817c
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 86 deletions.
diff --git a/blocks/code/code.js b/blocks/code/code.js
@@ -1,18 +1,20 @@
-import { decoratePlaceholder } from '../../scripts/scripts.js';
-import { mobileHeaderAnalytics } from './code-analytics.js';
+import { decoratePlaceholder } from "../../scripts/scripts.js";
+import { mobileHeaderAnalytics } from "./code-analytics.js";
+import { decorateTable } from "./table.js";
 
 export default async function decorate(block) {
-  block.innerHTML = await decoratePlaceholder(block);
-  if (block.classList.add('table')) {
-    decorateTable(block);
-  }
-  const titleData = block.children[0]?.querySelector('p')?.textContent.trim() || '';
-  block.innerHTML = '';
-  if (titleData) {
-    const titleElement = document.createElement('div');
-    titleElement.innerHTML = titleData;
-    block.append(titleElement);
-  }
+    block.innerHTML = await decoratePlaceholder(block);
+    if(block.classList.contains('table')){
+        decorateTable(block)
+        return block
+    }
+    const titleData = block.children[0]?.querySelector('p')?.textContent.trim() || '';
+    block.innerHTML = '';
+    if (titleData) {
+        const titleElement = document.createElement('div');
+        titleElement.innerHTML = titleData;
+        block.append(titleElement);
+    }
 
   const iframe = block.querySelectorAll('iframe');
   if (iframe.length != 0) {

diff --git a/blocks/code/table.js b/blocks/code/table.js
@@ -5,49 +5,49 @@
  */
 
 function buildCell(rowIndex) {
-  const cell = rowIndex ? document.createElement('td') : document.createElement('th');
-  if (!rowIndex) cell.setAttribute('scope', 'col');
-  return cell;
+    const cell = rowIndex ? document.createElement('td') : document.createElement('th');
+    if (!rowIndex) cell.setAttribute('scope', 'col');
+    return cell;
 }
 
 export function decorateTable(block) {
-  block.classList.add('code');
-  block.parentElement.classList.add('code-wrapper');
-  const table = document.createElement('table');
-  const div = document.createElement('div');
-  const thead = document.createElement('thead');
-  const tbody = document.createElement('tbody');
+    block.classList.add('code');
+    block.parentElement.classList.add('code-wrapper');
+    const table = document.createElement('table');
+    const div = document.createElement('div');
+    const thead = document.createElement('thead');
+    const tbody = document.createElement('tbody');
 
-  const header = !block.classList.contains('no-header');
-  // if (header) table.append(thead);
-  table.append(tbody);
+    const header = !block.classList.contains('no-header');
+    // if (header) table.append(thead);
+    table.append(tbody);
 
-  [...block.children].forEach((child, i) => {
-    const row = document.createElement('tr');
-    // if (header && i === 0) thead.append(row);
-    // else
-    tbody.append(row);
-    [...child.firstElementChild?.firstElementChild?.children]?.forEach((col) => {
-      // [...child.children].forEach((col) => {
-      const cell = buildCell(header ? i : i + 1);
-      if (col.innerHTML.includes('img') && col.textContent.trim()) {
-        col.remove();
-        const p = document.createElement('p');
-        const span = document.createElement('span');
-        span.append(col.textContent.trim());
-        p.append(col.querySelector('img'));
-        p.append(span);
-        cell.append(p);
-      } else if (col.innerHTML.includes('img')) {
-        col.remove();
-        cell.append(col.querySelector('img'));
-      } else {
-        cell.innerHTML = col.innerHTML;
-      }
-      row.append(cell);
+    [...block.querySelector('ul')?.children].forEach((child, i) => {
+        const row = document.createElement('tr');
+        // if (header && i === 0) thead.append(row);
+        // else 
+        tbody.append(row);
+        // [...child.firstElementChild?.firstElementChild?.children]?.forEach((col) => {
+        [...child.querySelector('ul')?.children].forEach((col) => {
+            const cell = buildCell(header ? i : i + 1);
+            if (col.innerHTML.includes('img') && col.textContent.trim()) {
+                col.remove();
+                const p = document.createElement('p');
+                const span = document.createElement('span');
+                span.append(col.textContent.trim());
+                p.append(col.querySelector('img'))
+                p.append(span)
+                cell.append(p);
+            } else if (col.innerHTML.includes('img')) {
+                col.remove();
+                cell.append(col.querySelector('img'));
+            } else {
+                cell.innerHTML = col.innerHTML;
+            }
+            row.append(cell);
+        });
     });
-  });
-  block.innerHTML = '';
-  div.append(table);
-  block.append(div);
+    block.innerHTML = '';
+    div.append(table);
+    block.append(div);
 }
diff --git a/blocks/columns/columns.js b/blocks/columns/columns.js
@@ -2,13 +2,8 @@ import { decorateViewMore } from '../../scripts/scripts.js';
 import { statemasterGetStatesApi } from '../applyloanform/statemasterapi.js';
 import { validationJSFunc } from '../applyloanform/validation.js';
 import { formOpen } from '../applyloanform/applyloanforms.js';
-import decorateTable from '../boards/boards.js';
 
 export default function decorate(block) {
-  if (block.classList.contains('table')) {
-    decorateTable(block);
-    return block;
-  }
   decorateViewMore(block);
   const cols = [...block.firstElementChild.children];
   block.classList.add(`columns-${cols.length}-cols`);

diff --git a/component-models.json b/component-models.json
@@ -143,23 +143,6 @@
   {
     "id": "columns",
     "fields": [
-      {
-        "component": "multiselect",
-        "name": "classes",
-        "label": "Style",
-        "valueType": "string",
-        "options": [
-          {
-            "name": "Type",
-            "children": [
-              {
-                "name": "Table",
-                "value": "table"
-              }
-            ]
-          }
-        ]
-      },
       {
         "component": "text",
         "valueType": "number",
@@ -2212,6 +2195,10 @@
               {
                 "name": "Table",
                 "value": "table"
+              },
+              {
+                "name": "test",
+                "value": "test"
               }
             ]
           }

diff --git a/styles/fixed-headset/fixed-headset.css b/styles/fixed-headset/fixed-headset.css
@@ -8,14 +8,14 @@
     width: 56px;
     overflow: hidden;
     transition: width .1s;
-    background-color: #20303f;
+    background-color: var(--midnight);
     border-radius: 100px;
     cursor: pointer;
     z-index: 12;
 }
 
 .section.fixed-headset-wrapper .default-content-wrapper p {
-    background-color: #20303f;
+    background-color: var(--midnight);
     height: 56px;
     width: 56px;
     border-radius: 100px;
@@ -30,7 +30,7 @@
     height: 32px;
 }
 .section.fixed-headset-wrapper .default-content-wrapper:hover p {
-    border: 1px solid #999;
+    border: 1px solid var(--dustygrey);
 }
 
 .section.fixed-headset-wrapper .default-content-wrapper ul {
@@ -44,17 +44,17 @@
     font-size: 14px;
     padding-left: 12px;
     font-weight: 700;
-    color: #fff;
-    font-family: Nunito-Regular, 'sans-serif';
+    color: var(--white);
+    font-family: 'Nunito-Regular', 'sans-serif';
 }
 
 .section.fixed-headset-wrapper .default-content-wrapper ul li a {
-    color: #fff;
+    color: var(--white);
     text-decoration: none;
-    font-family: Nunito-Bold, 'sans-serif';
+    font-family: 'Nunito-Bold', 'sans-serif';
 }
 .section.fixed-headset-wrapper .default-content-wrapper ul li:first-child a {
-    color: #f58667;
+    color: var(--orange);
     text-decoration: underline;
 }
 .section.fixed-headset-wrapper .default-content-wrapper:hover {
@@ -64,7 +64,7 @@
 
 .section.fixed-headset-wrapper:hover .default-content-wrapper ul {
     display: flex;
-    background-color: #20303f;
+    background-color: var(--midnight);
 }
 
 @media screen and (max-width: 768px) {

diff --git a/styles/table/table.css b/styles/table/table.css
@@ -496,8 +496,8 @@
     .section.fees-charges-wrapper.three-col-table .code-wrapper .code>div>table>tbody>tr>td>p>img {
         width: 12px;
         height: 12px;
-        left: -12px;
-        top: 2px;
+        left: -14px;
+        top: 6px;
         border-radius: unset;
     }
 }
@@ -507,7 +507,7 @@
     .section.fees-charges-wrapper.three-col-table .code-wrapper .code>div>table>tbody>tr>td>p>img {
         width: 12px;
         height: 12px;
-        left: 39%;
+        left: 35%;
         top: -12px;
         border-radius: unset;
     }