daily pastebin goal
1%
SHARE
TWEET

Untitled

a guest Jan 20th, 2019 48 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <div id="app">
  2.     <div class="title-container">
  3.         <div>
  4.             <h3 class="title">
  5.                 Our Projects
  6.             </h3>
  7.         </div>
  8.         <div class="filters">
  9.             <span class="filter" v-bind:class="{ active: currentFilter === 'ALL' }" v-on:click="setFilter('ALL')">ALL</span>
  10.             <span class="filter" v-bind:class="{ active: currentFilter === 'ART' }" v-on:click="setFilter('ART')">ART</span>
  11.             <span class="filter" v-bind:class="{ active: currentFilter === 'WORKSHOPS' }" v-on:click="setFilter('WORKSHOPS')">WORKSHOPS</span>
  12.             <span class="filter" v-bind:class="{ active: currentFilter === 'FUN' }" v-on:click="setFilter('FUN')">FUN</span>
  13.         </div>
  14.     </div>
  15.  
  16.     <transition-group class="projects" name="projects" >
  17.         <div class="project" v-if="currentFilter === project.category || currentFilter === 'ALL'" v-bind:key="project.title" v-for="project in projects">
  18.             <div class="project-image-wrapper">
  19.                 <img class="project-image" v-bind:src="project.image">
  20.                 <div class="gradient-overlay"></div>
  21.                 <div class="circle">
  22.                 <span class="project-title">{{project.title}}</span>
  23.             </div>
  24.             </div>
  25.         </div>
  26.     </transition-group>
  27. </div>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top