Revert "Original fade in transitions, PR now made into dev."

This reverts commit 1397e0bebc.
This commit is contained in:
Haydon Curteis-Lateo
2019-10-04 11:22:26 +01:00
parent 1397e0bebc
commit e67efc027e
2 changed files with 7 additions and 47 deletions

View File

@@ -99,35 +99,6 @@ h1 {
grid-gap: 1rem;
}
// Fade in title and cards and rows
.fade-title {
&-enter {
opacity: 0;
&-to {
opacity: 1;
}
&-active {
transition: opacity .1s ease-in-out;
}
}
}
.fade-card {
&-enter {
opacity: 0;
&-to {
opacity: 1;
}
&-active {
transition: opacity .1s ease-in-out;
}
}
}
@media (max-width: 400px) {
.layout {

View File

@@ -1,15 +1,12 @@
<template lang="pug">
div
transition(name="fade-title" @after-enter="afterEnter")
h1(v-if="showTitle") {{ category.title }}
transition(name="fade-card")
.cards(v-if="areCardsVisible && showCards")
template(v-for='resource in category.resources' )
Card(:resource='resource' :key='resource.title' :createCopyUrl="createCopyUrl" :isActive='activeCard === resource.cleanTitle')
transition(name="fade-card")
table(v-if="!areCardsVisible && showCards")
template(v-for='resource in category.resources' )
TableRow(:resource='resource' :key='resource.title' :createCopyUrl="createCopyUrl" :isActive='activeCard === resource.cleanTitle')
h1 {{ category.title }}
.cards(v-if="areCardsVisible")
template(v-for='resource in category.resources' )
Card(:resource='resource' :key='resource.title' :createCopyUrl="createCopyUrl" :isActive='activeCard === resource.cleanTitle')
table(v-if="!areCardsVisible")
template(v-for='resource in category.resources' )
TableRow(:resource='resource' :key='resource.title' :createCopyUrl="createCopyUrl" :isActive='activeCard === resource.cleanTitle')
</template>
<script>
@@ -22,8 +19,6 @@ export default {
categoryRouteTitle: this.$route.params.category,
index: '',
activeCard: '',
showTitle: false,
showCards: false,
};
},
computed: {
@@ -47,14 +42,8 @@ export default {
} catch (e) {
console.error(e);
}
},
afterEnter(el) {
this.showCards = true;
}
},
mounted() {
this.showTitle = true;
},
created() {
this.activeCard = this.$route.query.card || ''
},