moritzruth/moritzruth.de
1
0
Fork 0
Code Activity Actions

beautify index page

Browse source
This commit is contained in:
Moritz Ruth 2019-03-09 21:17:45 +01:00
parent 0d834e2f57
commit 0c3548f9e1
5 changed files with 53 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

18
components/CtexxxLogo.vue
View file

@ -1,5 +1,5 @@
<template>
<div class="full-width">
<div>
<transition name="slide-vertical" mode="out-in">
<div class="logo" :key="debouncedLogoText">
<span class="text">{{ debouncedLogoText }}</span>
@ -14,7 +14,7 @@
const debounceLogoText = _debounce((self, newValue) => {
self.debouncedLogoText = newValue;
}, 200);
}, 100);
export default {
name: "CtexxxLogo",
@ -39,27 +39,21 @@
<style scoped lang="scss">
@import "~@/assets/_responsive";
@import url('https://fonts.googleapis.com/css?family=Montserrat+Alternates');
.slide-vertical-enter-active {
transition: all 0.5s ease-out;
transition: all 0.3s ease-out;
}
.slide-vertical-leave-active {
transition: all 0.5s ease-in;
transition: all 0.3s ease-in;
}
.slide-vertical-enter-to {
transform: translateY(0);
opacity: 1;
}
.slide-vertical-enter {
transform: translateY(-100px);
opacity: 0;
}
.slide-vertical-leave-to {
transform: translateY(100px);
.slide-vertical-enter, .slide-vertical-leave-to {
opacity: 0;
}