Skip to content
Snippets Groups Projects
Select Git revision
  • 99e1c17935af0275d7509fa52256a394848ed47b
  • test default protected
  • master protected
  • original
  • pirati-backup protected
  • beta-2
  • beta-1
  • v3.1.4
  • v3.1.3
  • v3.1.2
  • v3.1.1
  • v3.1.0
  • v3.0.16
  • v3.0.15
  • v3.0.14
  • v3.0.13
  • v3.0.12
  • v3.0.11
  • v3.0.10
  • v3.0.9
  • v3.0.8
  • v3.0.7
  • v3.0.6
  • v3.0.5
  • v3.0.4
25 results

view_utils.py

Blame
  • FooterCollapsible.vue 1.28 KiB
    <template>
      <div :class="[wrapperclass, 'footer-collapsible']">
        <span class="text-xl uppercase text-white footer-collapsible__toggle" :class="[labelclass, show ? 'footer-collapsible__toggle--open' : '']" @click="handleClick">{{ label }}</span>
        <div v-show="show || isLgScreenSize" :class="[slotwrapperclass]">
          <slot>
          </slot>
        </div>
      </div>
    </template>
    
    <script>
    import { isLgScreenSize } from "../../utils";
    
    export default {
      data() {
        return {
          isLgScreenSize: isLgScreenSize(),
          show: false,
          resizeHandler: () => {
            this.$data.isLgScreenSize = isLgScreenSize();
          },
        };
      },
      props: {
        href: {
          type: String,
        },
        label: {
          type: String,
        },
        labelclass: {
          type: String,
        },
        wrapperclass: {
          type: String,
          default: "",
        },
        slotwrapperclass: {
          type: String,
          default: "",
        }
      },
      methods: {
        handleClick() {
          if (this.$props.href) {
            window.location = this.$props.href;
          }
    
          this.$data.show = !this.$data.show;
        }
      },
      mounted() {
        this.$nextTick(() => {
          window.addEventListener("resize", this.$data.resizeHandler);
        });
      },
      beforeDestroy() {
        window.removeEventListener("resize", this.$data.resizeHandler);
      }
    }
    </script>