Bachana123

.uppercase {
  font-feature-settings: 'case' on;
}

Bachana123

/////// install first
npm i -D scrollmagic gsap scrollmagic-plugin-gsap


/////// plugin
/* eslint-disable import/no-webpack-loader-syntax */
import Vue from 'vue'
import { TweenMax, TimelineMax } from 'gsap'
import * as ScrollMagic from 'scrollmagic'

Bachana123

mounted() {
    const pixelScript = this.shareInfo.pixelScript
    const analyticsScript = this.shareInfo.analyticsScript

    if (pixelScript.includes('<script>')) {
      document.body.appendChild(this.htmlToElements(pixelScript))
    }
    if (analyticsScript.includes('<script>')) {
      document.body.appendChild(this.htmlToElements(analyticsScript))
    }

Bachana123

import Vue from 'vue'

Vue.directive('mouse-down', {
  bind: function (el, binding, vnode) {
    el.clickOutsideEvent = function (event) {
      // here I check that click was outside the el and his childrens
      if (!(el == event.target || el.contains(event.target))) {
        // and if it did, call method provided in attribute value
        vnode.context[binding.expression](event);
      }

Bachana123

chooseWithArrows(e) {
        const SCROLL_BOX = this.$refs.scrollWithArrow
        let scrollDiv;
          if (e.keyCode == '38') {
            //check if i is smaller than 0
            this.i - 1 < 0 ? this.i = this.searchHendler.length-1 : this.i -=1;
            //add animation using this variable
            this.scrollTo = this.searchHendler[this.i][this.name]
            //check offset of child component
            scrollDiv = SCROLL_BOX.childNodes[this.i].offsetTop

Bachana123

this.$nextTick(() => {
  this.$refs.searchInput.focus();
})

Bachana123

```  
answer() {
      const answer = this.text.answer
      const splitedAnswer = answer.split(';')
      if (splitedAnswer.length > 1) {
        const createNode = (x) => '<li>' + x + '</li>'
        const list = splitedAnswer.map(createNode)
        return '<ul>' + list.join('') + '</ul>'
      }
      return answer

Bachana123

<template>
  <section>
    <svg class="" height="20" width="20" viewBox="0 0 20 20">
      <circle r="10" cx="10" cy="10" fill="white" />
      <circle v-for="(item, index) in pie" :key="index" r="5" cx="10" cy="10" fill="transparent"
          stroke="tomato"
          stroke-width="10"
          :stroke-dasharray="item.width + ' 31.42'"
          :transform="'rotate(' + item.rotate + ')'" />
      <circle r="5" cx="10" cy="10" fill="white" stroke-width="0"/>

Bachana123

:style="`display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; text-overflow: ellipsis; -webkit-line-clamp: ${};`"

Bachana123

var checkScrollSpeed = (function(settings){
    settings = settings || {};

    var lastPos, newPos, timer, delta, 
        delay = settings.delay || 50; // in "ms" (higher means lower fidelity )

    function clear() {
      lastPos = null;
      delta = 0;
    }