appscms-tools-theme 4.7.0 → 4.7.2

data/assets/css/appscms-theme.css

@@ -136,7 +136,7 @@ body {
   left: 0px;
   position: fixed;
   top: 100px;
-  min-width: 500px;
+  min-width: 100%;
   max-height: 500px;
   overflow-y: auto;
   width: 90vw;
@@ -1943,8 +1943,8 @@ select:focus {
 
   .toolfilters {
     font-size: 10px;
-    height: 30px;
     padding: 3px;
+    min-width: auto !important;
   }
   .toolfilter {
     margin: auto;
@@ -2034,7 +2034,7 @@ select:focus {
 @media (min-width: 576px) and (max-width: 767.98px) {
   .toolfilters {
     font-size: 10px;
-    height: 40px;
+    min-width: none !important;
     padding: 1px;
   }
   #searchbar-placeholder {

data/assets/images/menu.svg

@@ -0,0 +1 @@
+<svg viewBox="-0.5 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path d="M19 3.32001H16C14.8954 3.32001 14 4.21544 14 5.32001V8.32001C14 9.42458 14.8954 10.32 16 10.32H19C20.1046 10.32 21 9.42458 21 8.32001V5.32001C21 4.21544 20.1046 3.32001 19 3.32001Z" stroke="#525658" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M8 3.32001H5C3.89543 3.32001 3 4.21544 3 5.32001V8.32001C3 9.42458 3.89543 10.32 5 10.32H8C9.10457 10.32 10 9.42458 10 8.32001V5.32001C10 4.21544 9.10457 3.32001 8 3.32001Z" stroke="#525658" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M19 14.32H16C14.8954 14.32 14 15.2154 14 16.32V19.32C14 20.4246 14.8954 21.32 16 21.32H19C20.1046 21.32 21 20.4246 21 19.32V16.32C21 15.2154 20.1046 14.32 19 14.32Z" stroke="#525658" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> <path d="M8 14.32H5C3.89543 14.32 3 15.2154 3 16.32V19.32C3 20.4246 3.89543 21.32 5 21.32H8C9.10457 21.32 10 20.4246 10 19.32V16.32C10 15.2154 9.10457 14.32 8 14.32Z" stroke="#525658" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </g></svg>

data/assets/js/appscms-theme.js

@@ -211,75 +211,101 @@ if (processingBtn) {
     });
 }
 
-if ("{{ site.navigationSearch }}" === "true") {
-  // Fetch data from data.json
-async function fetchData() {
-  const response = await fetch('/alllinks.json');
-  const data = await response.json();
-  return data.featuredLinks;
-}
-
-// Filter data based on search query
-function filterData(data, query) {
-  return data.filter(item => item.name.toLowerCase().includes(query.toLowerCase()));
-}
-
-// Display filtered results
-function displayResults(results) {
-  const resultsContainer = document.getElementById('results');
-  resultsContainer.style.display = results.length ? 'block' : 'none';
-  resultsContainer.innerHTML = results.length
-    ? results.map(result => `<div class="result-item"><a href="${result.url}" target="_blank">${result.name}</a></div>`).join('')
-    : '<p>No results found</p>';
-}
-function mobileDisplayResults(results) {
-  const mobileResultsContainer = document.querySelector('.mobile-searchbarResults');
-  mobileResultsContainer.style.display = results.length ? 'block' : 'none';
-  mobileResultsContainer.innerHTML = results.length
-    ? results.map(result => `<div class="mobile-result-item"><a href="${result.url}" target="_blank">${result.name}</a></div>`).join('')
-    : '<p>No results found</p>';
-}
+if ("{{ site.navigationSearch }}" === "true" ) {
 
-// Handle search input
-const searchInput = document.querySelector('.search-input');
-const mobileSearchInput = document.querySelector('.mobile-search-input');
-searchInput.addEventListener('input', async (event) => {
-  const query = event.target.value;
-  const data = await fetchData();
-  const filteredResults = filterData(data, query);
-  displayResults(filteredResults);
+     // Fetch data from data.json
+  const worker = new Worker('/search-worker.js');
 
-  gtag('event', 'search', {
-    'event_category': 'engagement',
-    'event_label': 'Search Box',
-    'value': query
+  worker.onmessage = function(event) {
+    if (event.data.error) {
+      console.error('Error fetching data:', event.data.error);
+    } else {
+      // Store fetched data globally for reuse
+      window.fetchedData = event.data;
+    }
+  };
+  
+  worker.onerror = function(error) {
+    console.error('Worker error:', error.message);
+  };
+  
+  // Send a message to the worker to start fetching the data
+  worker.postMessage('fetchData');
+  
+  // Filter data based on search query
+  function filterData(data, query) {
+    return data.filter(item => item.name.toLowerCase().includes(query.toLowerCase()));
+  }
+  
+  // Display filtered results
+  function displayResults(results) {
+    const resultsContainer = document.getElementById('results');
+    resultsContainer.style.display = results.length ? 'block' : 'none';
+    resultsContainer.innerHTML = results.length
+      ? results.map(result => `<div class="result-item"><a href="${result.url}" target="_blank">${result.name}</a></div>`).join('')
+      : '<p>No results found</p>';
+  }
+  
+  function mobileDisplayResults(results) {
+    const mobileResultsContainer = document.querySelector('.mobile-searchbarResults');
+    mobileResultsContainer.style.display = results.length ? 'block' : 'none';
+    mobileResultsContainer.innerHTML = results.length
+      ? results.map(result => `<div class="mobile-result-item"><a href="${result.url}" target="_blank">${result.name}</a></div>`).join('')
+      : '<p>No results found</p>';
+  }
+  
+  // Handle search input
+  const searchInput = document.querySelector('.search-input');
+  ;
+  
+  searchInput.addEventListener('input', (event) => {
+    const query = event.target.value;
+    const data = window.fetchedData || [];
+    const filteredResults = filterData(data, query);
+    displayResults(filteredResults);
+  
+    gtag('event', 'search', {
+      'event_category': 'engagement',
+      'event_label': 'Search Box',
+      'value': query
+    });
   });
+  
+  if ("{{ page.lang }}" === "en") {
+    const mobileSearchInput = document.querySelector('.mobile-search-input')
+    mobileSearchInput.addEventListener('input', (event) => {
+      const query = event.target.value;
+      const data = window.fetchedData || [];
+      const filteredResults = filterData(data, query);
+      mobileDisplayResults(filteredResults);
+    
+      gtag('event', 'search', {
+        'event_category': 'engagement',
+        'event_label': 'Search Box',
+        'value': query
+      });
+    });
+    
+  }
+  
+  // Hide results when clicking outside search input and results container
+  document.addEventListener('click', (event) => {
+    const resultsContainer = document.getElementById('results');
+   
+  
+    if (!searchInput.contains(event.target) && !resultsContainer.contains(event.target)) {
+      resultsContainer.style.display = 'none';
+    }
+    if ("{{ page.lang }}" === "en") {
+      const mobileResultsContainer = document.querySelector('.mobile-searchbarResults');
+    if (!mobileSearchInput.contains(event.target) && !mobileResultsContainer.contains(event.target)) {
+      mobileResultsContainer.style.display = 'none';
+    }
+    }
 
-});
-mobileSearchInput.addEventListener('input', async (event) => {
-  const query = event.target.value;
-  const data = await fetchData();
-  const filteredResults = filterData(data, query);
-  mobileDisplayResults(filteredResults);
-
-  gtag('event', 'search', {
-    'event_category': 'engagement',
-    'event_label': 'Search Box',
-    'value': query
+    
   });
+  
+ 
 
-});
-
-// Hide results when clicking outside search input and results container
-document.addEventListener('click', (event) => {
-  const resultsContainer = document.getElementById('results');
-  const mobileResultsContainer = document.querySelector('.mobile-searchbarResults');
-
-  if (!searchInput.contains(event.target) && !resultsContainer.contains(event.target)) {
-    resultsContainer.style.display = 'none';
-  }
-  if (!mobileSearchInput.contains(event.target) && !mobileResultsContainer.contains(event.target)) {
-    mobileResultsContainer.style.display = 'none';
-  }
-});
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: appscms-tools-theme
 version: !ruby/object:Gem::Version
-  version: 4.7.0
+  version: 4.7.2
 platform: ruby
 authors:
 - vivek-appscms
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-07-06 00:00:00.000000000 Z
+date: 2024-07-13 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -139,7 +139,6 @@ files:
 - _includes/appscms/navbars/devtool-navbar.html
 - _includes/appscms/navbars/devtool-toolbar.html
 - _includes/appscms/navbars/navbar.html
-- _includes/appscms/navbars/new-toolbar.html
 - _includes/appscms/navbars/toolbar.html
 - _includes/appscms/recent-posts/recent_posts.html
 - _includes/appscms/recent-posts/related_categories_post.html
@@ -479,6 +478,7 @@ files:
 - assets/images/mahika.webp
 - assets/images/manthink.svg
 - assets/images/mega.png
+- assets/images/menu.svg
 - assets/images/paavan.webp
 - assets/images/pallavi.jpeg
 - assets/images/pallavi.webp

data/_includes/appscms/navbars/new-toolbar.html

@@ -1,160 +0,0 @@
-<div class="appscms-toolbar">
-  <div class="row">
-    <div class="col-11 mx-auto">
-      <div class="appscms-toolbar-list">
-        <div id="close-nav-ham" data-open="1" class="close-nav-ham">
-          <img
-            class="mt-3"
-            style="cursor: pointer"
-            height="30px"
-            width="30px"
-            src="/assets/images/close-button.svg"
-            alt="close-button"
-          />
-        </div>
-        {%- if Data.megaMenu -%} {%- for item in Data.megaMenu.dropdown -%}
-        <li class="appscms-toolbar-list-item">
-          <span
-            class="appscms-toolbar-list-item-span d-flex justify-content-between"
-          >
-            {{ item.categoryName }}
-          </span>
-          <div class="list-item-dropdown">
-            <div class="row">
-              <div class="col-lg-4 col-md-6">
-                <div class="appscms-featured-tools">
-                  <div class="category-tools">
-                    <h4 class="expand_menu-name-categiry">FEATURED TOOLS</h4>
-                    {%- for i in item.featuredLinks -%}
-                    <a href="{{i.url}}" class="category-tools__item">
-                      <div class="icon_box v_2 v2">
-                        <img src="{{i.iconSrc}}" alt="icon-img" />
-                      </div>
-                      <div class="category-tools__content">
-                        <h4>{{i.name}}</h4>
-                        <p class="category-tools__descr gray">{{i.name}}</p>
-                      </div>
-                    </a>
-                    {%- endfor -%}
-                  </div>
-                </div>
-              </div>
-              <div class="col-md-8">
-                <div class="appscms-other-tools">
-                  <div class="expand_menu-name-categiry">OTHER TOOLS</div>
-                  {% assign link_count = item.links | size %} {% if link_count >
-                  0 %} {% assign half = link_count | divided_by: 2 %} {% assign
-                  remainder = link_count | modulo: 2 %}
-
-                  <div class="row">
-                    <div class="col-md-6">
-                      <ul class="mega_menu">
-                        {%- for i in item.links | slice: 0, half -%}
-                        <li>
-                          <a href="{{ i.url }}">{{ i.name }}</a>
-                          <ul class=""></ul>
-                        </li>
-                        {%- endfor -%} {%- if remainder != 0 -%}
-                        <li>
-                          <a href="{{ item.links[half].url }}"
-                            >{{ item.links[half].name }}</a
-                          >
-                          <ul class=""></ul>
-                        </li>
-                        {%- endif -%}
-                      </ul>
-                    </div>
-                    <div class="col-md-6">
-                      <ul class="mega_menu">
-                        {%- for i in item.links | slice: half | plus: remainder,
-                        link_count - half - remainder -%}
-                        <li>
-                          <a href="{{ i.url }}">{{ i.name }}</a>
-                          <ul class=""></ul>
-                        </li>
-                        {%- endfor -%}
-                      </ul>
-                    </div>
-                  </div>
-                  {% endif %}
-                </div>
-              </div>
-            </div>
-          </div>
-        </li>
-        {%- endfor -%} {%- endif -%} {%- for item in siteData.megaMenu.dropdown
-        -%}
-        <li class="appscms-toolbar-list-item">
-          <span
-            class="appscms-toolbar-list-item-span d-flex justify-content-between"
-          >
-            {{ item.categoryName }}
-          </span>
-          <div class="list-item-dropdown">
-            <div class="row">
-              <div class="col-lg-4 col-md-6">
-                <div class="appscms-featured-tools">
-                  <div class="category-tools">
-                    <h4 class="expand_menu-name-categiry">FEATURED TOOLS</h4>
-                    {%- for i in item.featuredLinks -%}
-                    <a href="{{i.url}}" class="category-tools__item">
-                      <div class="icon_box v_2 v2">
-                        <img src="{{i.iconSrc}}" alt="icon-img" />
-                      </div>
-                      <div class="category-tools__content">
-                        <h4>{{i.name}}</h4>
-                        <p class="category-tools__descr gray">{{i.name}}</p>
-                      </div>
-                    </a>
-                    {%- endfor -%}
-                  </div>
-                </div>
-              </div>
-              <div class="col-lg-6">
-                <div class="appscms-other-tools">
-                  <div class="expand_menu-name-categiry">OTHER WRITE TOOLS</div>
-                  {% assign link_count = item.links | size %} {% if link_count >
-                  0 %} {% assign half = link_count | divided_by: 2 %} {% assign
-                  remainder = link_count | modulo: 2 %}
-
-                  <div class="row">
-                    <div class="col-lg-6">
-                      <ul class="mega_menu">
-                        {%- for i in item.links | slice: 0, half -%}
-                        <li>
-                          <a href="{{ i.url }}">{{ i.name }}</a>
-                          <ul class=""></ul>
-                        </li>
-                        {%- endfor -%} {%- if remainder != 0 -%}
-                        <li>
-                          <a href="{{ item.links[half].url }}"
-                            >{{ item.links[half].name }}</a
-                          >
-                          <ul class=""></ul>
-                        </li>
-                        {%- endif -%}
-                      </ul>
-                    </div>
-                    <div class="col-lg-6">
-                      <ul class="mega_menu">
-                        {%- for i in item.links | slice: half | plus: remainder,
-                        link_count - half - remainder -%}
-                        <li>
-                          <a href="{{ i.url }}">{{ i.name }}</a>
-                          <ul class=""></ul>
-                        </li>
-                        {%- endfor -%}
-                      </ul>
-                    </div>
-                  </div>
-                  {% endif %}
-                </div>
-              </div>
-            </div>
-          </div>
-        </li>
-        {%- endfor -%}
-      </div>
-    </div>
-  </div>
-</div>