Drawer

<div class="drawer js-drawer">
    <div class="find-model" id="find-model">
        <h4 class="find-model__title">Find your style model</h4>
        <p class="find-model__content">Refer to the right temple of your sunglasses (refer to image below) for the Style Number. Style Number begins with ZL-</p>
        <img class="find-model__image" alt="An image displaying the model number on the right temple of the sunglasses" src="/assets/images/zeal-find-model.jpg">
    </div>

</div>
<div class="drawer js-drawer">
  {{#if mauijim}}
  {{render '@find-model'}}
  {{else}}
  {{render '@find-model--zeal'}}
  {{/if}}
</div>
/* No context defined for this component. */
  • Content:
    (function (window) {
      'use strict';
    
      const drawerOpenClass = 'drawer--open';
    
      function handleOpenDrawer(ev) {
        ev.preventDefault();
    
        const openDrawer = document.querySelectorAll(`.${drawerOpenClass}`);
        const drawer = this.parentElement.nextElementSibling;
    
        if (drawer.classList.contains(drawerOpenClass)) {
          for (let i = 0; i < openDrawer.length; i++) {
            openDrawer[i].classList.remove(drawerOpenClass);
          }
        }
        else {
          drawer.classList.add(drawerOpenClass);
        }
      }
    
      function init() {
        const drawerLinks = document.querySelectorAll('.js-tooltip-drawer-open-link');
    
        for (let i = 0; i < drawerLinks.length; i++) {
          drawerLinks[i].addEventListener('click', handleOpenDrawer);
        }
      }
    
      // Allow application JS to reinitialize any instances added with Ajax, etc.
      if (typeof componentEvents !== 'undefined') {
        componentEvents.on('component-init', init);
      }
    
      init();
    
    })(this);
    
  • URL: /components/raw/drawer/drawer.js
  • Filesystem Path: src/components/01-elements/drawer/drawer.js
  • Size: 949 Bytes
  • Content:
    .drawer {
      display: none;
    }
    
    .drawer--open {
      display: block;
    }
    
  • URL: /components/raw/drawer/drawer.scss
  • Filesystem Path: src/components/01-elements/drawer/drawer.scss
  • Size: 66 Bytes

There are no notes for this item.