add new decoration

This commit is contained in:
jiaming 2018-12-07 18:28:09 +08:00
parent 85e3dddf2e
commit 5dc6cf53c5
3 changed files with 25 additions and 3 deletions

View File

@ -34,23 +34,25 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@import url('../../assets/style/index.less');
.decoration-2 { .decoration-2 {
.reverse, .normal { .reverse, .normal {
background-color: #3faacb; background-color: @D2LC;
} }
.normal { .normal {
width: 0%; width: 0%;
height: 1px; height: 1px;
border-right: 1px solid #fff; border-right: 1px solid @D2TC;
animation: normal-amt 6s ease-in-out infinite; animation: normal-amt 6s ease-in-out infinite;
} }
.reverse { .reverse {
width: 1px; width: 1px;
height: 0%; height: 0%;
border-bottom: 1px solid #fff; border-bottom: 1px solid @D2TC;
animation: reverse-amt 6s ease-in-out infinite; animation: reverse-amt 6s ease-in-out infinite;
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 86 KiB

View File

@ -0,0 +1,20 @@
<template>
<div class="decoration-3">
<img src="./img/decoration.gif" />
</div>
</template>
<script>
export default {
name: 'Decoration3'
}
</script>
<style lang="less">
.decoration-3 {
img {
width: 100%;
}
}
</style>