diff options
| author | Aya Morisawa <AyaMorisawa4869@gmail.com> | 2019-01-27 19:12:45 +0900 |
|---|---|---|
| committer | syuilo <Syuilotan@yahoo.co.jp> | 2019-01-27 19:12:45 +0900 |
| commit | 62d41023e19dfb551e0d9fd28f1361efaced9765 (patch) | |
| tree | aaea0c571dec5eac8f81ce2e8264af36ba3b72d5 /src/client | |
| parent | [MFM] spinの中でflipを使えるように (diff) | |
| download | sharkey-62d41023e19dfb551e0d9fd28f1361efaced9765.tar.gz sharkey-62d41023e19dfb551e0d9fd28f1361efaced9765.tar.bz2 sharkey-62d41023e19dfb551e0d9fd28f1361efaced9765.zip | |
Add jump syntax (#4007)
* Add jump syntax
* Fix typo: spin -> jump
* Fix typo
Diffstat (limited to 'src/client')
| -rw-r--r-- | src/client/app/animation.styl | 8 | ||||
| -rw-r--r-- | src/client/app/common/views/components/mfm.ts | 11 |
2 files changed, 19 insertions, 0 deletions
diff --git a/src/client/app/animation.styl b/src/client/app/animation.styl index 9cbd3ec6c8..9a0ec2729c 100644 --- a/src/client/app/animation.styl +++ b/src/client/app/animation.styl @@ -31,3 +31,11 @@ 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } + +@keyframes jump { + 0% { transform: translateY(0); } + 25% { transform: translateY(-16px); } + 50% { transform: translateY(0); } + 75% { transform: translateY(-8px); } + 100% { transform: translateY(0); } +} diff --git a/src/client/app/common/views/components/mfm.ts b/src/client/app/common/views/components/mfm.ts index 199d6bb978..542f1e34c5 100644 --- a/src/client/app/common/views/components/mfm.ts +++ b/src/client/app/common/views/components/mfm.ts @@ -135,6 +135,17 @@ export default Vue.component('misskey-flavored-markdown', { }, genEl(token.children)); } + case 'jump': { + motionCount++; + const isLong = sumTextsLength(token.children) > 5 || countNodesF(token.children) > 3; + const isMany = motionCount > 3; + return (createElement as any)('span', { + attrs: { + style: (this.$store.state.settings.disableAnimatedMfm || isLong || isMany) ? 'display: inline-block;' : 'display: inline-block; animation: jump 0.75s linear infinite;' + }, + }, genEl(token.children)); + } + case 'flip': { return (createElement as any)('span', { attrs: { |