diff options
| author | futchitwo <74236683+futchitwo@users.noreply.github.com> | 2022-05-05 22:52:33 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-05-05 22:52:33 +0900 |
| commit | 3ea351d8a2f50f68dc695317062ba7f471ad7542 (patch) | |
| tree | e2d099950fa94adfeaad6238110a1f85c1bcc408 /packages/client/src | |
| parent | refactor(client): refactor settings/word-mute to use Composition API (#8597) (diff) | |
| download | misskey-3ea351d8a2f50f68dc695317062ba7f471ad7542.tar.gz misskey-3ea351d8a2f50f68dc695317062ba7f471ad7542.tar.bz2 misskey-3ea351d8a2f50f68dc695317062ba7f471ad7542.zip | |
Enhance(MFM): Allow speed changes in all animated MFMs (#8551)
* MFM: Allow speed changes in all animated MFMs
* Feature(MFM): Add speed property to cheat sheet
* Use template literal
Oops!
* Remove unnecessary template string
Co-authored-by: Johann150 <johann@qwertqwefsday.eu>
Co-authored-by: Johann150 <johann@qwertqwefsday.eu>
Diffstat (limited to 'packages/client/src')
| -rw-r--r-- | packages/client/src/components/mfm.ts | 12 | ||||
| -rw-r--r-- | packages/client/src/pages/mfm-cheat-sheet.vue | 16 |
2 files changed, 16 insertions, 12 deletions
diff --git a/packages/client/src/components/mfm.ts b/packages/client/src/components/mfm.ts index 37076652fd..6ac410762d 100644 --- a/packages/client/src/components/mfm.ts +++ b/packages/client/src/components/mfm.ts @@ -91,7 +91,8 @@ export default defineComponent({ let style; switch (token.props.name) { case 'tada': { - style = `font-size: 150%;` + (this.$store.state.animatedMfm ? 'animation: tada 1s linear infinite both;' : ''); + const speed = validTime(token.props.args.speed) || '1s'; + style = 'font-size: 150%;' + (this.$store.state.animatedMfm ? `animation: tada ${speed} linear infinite both;` : ''); break; } case 'jelly': { @@ -123,11 +124,13 @@ export default defineComponent({ break; } case 'jump': { - style = this.$store.state.animatedMfm ? 'animation: mfm-jump 0.75s linear infinite;' : ''; + const speed = validTime(token.props.args.speed) || '0.75s'; + style = this.$store.state.animatedMfm ? `animation: mfm-jump ${speed} linear infinite;` : ''; break; } case 'bounce': { - style = this.$store.state.animatedMfm ? 'animation: mfm-bounce 0.75s linear infinite; transform-origin: center bottom;' : ''; + const speed = validTime(token.props.args.speed) || '0.75s'; + style = this.$store.state.animatedMfm ? `animation: mfm-bounce ${speed} linear infinite; transform-origin: center bottom;` : ''; break; } case 'flip': { @@ -168,7 +171,8 @@ export default defineComponent({ }, genEl(token.children)); } case 'rainbow': { - style = this.$store.state.animatedMfm ? 'animation: mfm-rainbow 1s linear infinite;' : ''; + const speed = validTime(token.props.args.speed) || '1s'; + style = this.$store.state.animatedMfm ? `animation: mfm-rainbow ${speed} linear infinite;` : ''; break; } case 'sparkle': { diff --git a/packages/client/src/pages/mfm-cheat-sheet.vue b/packages/client/src/pages/mfm-cheat-sheet.vue index 83ae5741c3..aa35ec2158 100644 --- a/packages/client/src/pages/mfm-cheat-sheet.vue +++ b/packages/client/src/pages/mfm-cheat-sheet.vue @@ -325,20 +325,20 @@ export default defineComponent({ preview_inlineMath: '\\(x= \\frac{-b\' \\pm \\sqrt{(b\')^2-ac}}{a}\\)', preview_quote: `> ${this.$ts._mfm.dummy}`, preview_search: `${this.$ts._mfm.dummy} ๆค็ดข`, - preview_jelly: `$[jelly ๐ฎ]`, - preview_tada: `$[tada ๐ฎ]`, - preview_jump: `$[jump ๐ฎ]`, - preview_bounce: `$[bounce ๐ฎ]`, - preview_shake: `$[shake ๐ฎ]`, - preview_twitch: `$[twitch ๐ฎ]`, - preview_spin: `$[spin ๐ฎ] $[spin.left ๐ฎ] $[spin.alternate ๐ฎ]\n$[spin.x ๐ฎ] $[spin.x,left ๐ฎ] $[spin.x,alternate ๐ฎ]\n$[spin.y ๐ฎ] $[spin.y,left ๐ฎ] $[spin.y,alternate ๐ฎ]`, + preview_jelly: `$[jelly ๐ฎ] $[jelly.speed=5s ๐ฎ]`, + preview_tada: `$[tada ๐ฎ] $[tada.speed=5s ๐ฎ]`, + preview_jump: `$[jump ๐ฎ] $[jump.speed=5s ๐ฎ]`, + preview_bounce: `$[bounce ๐ฎ] $[bounce.speed=5s ๐ฎ]`, + preview_shake: `$[shake ๐ฎ] $[shake.speed=5s ๐ฎ]`, + preview_twitch: `$[twitch ๐ฎ] $[twitch.speed=5s ๐ฎ]`, + preview_spin: `$[spin ๐ฎ] $[spin.left ๐ฎ] $[spin.alternate ๐ฎ]\n$[spin.x ๐ฎ] $[spin.x,left ๐ฎ] $[spin.x,alternate ๐ฎ]\n$[spin.y ๐ฎ] $[spin.y,left ๐ฎ] $[spin.y,alternate ๐ฎ]\n\n$[spin.speed=5s ๐ฎ]`, preview_flip: `$[flip ${this.$ts._mfm.dummy}]\n$[flip.v ${this.$ts._mfm.dummy}]\n$[flip.h,v ${this.$ts._mfm.dummy}]`, preview_font: `$[font.serif ${this.$ts._mfm.dummy}]\n$[font.monospace ${this.$ts._mfm.dummy}]\n$[font.cursive ${this.$ts._mfm.dummy}]\n$[font.fantasy ${this.$ts._mfm.dummy}]`, preview_x2: `$[x2 ๐ฎ]`, preview_x3: `$[x3 ๐ฎ]`, preview_x4: `$[x4 ๐ฎ]`, preview_blur: `$[blur ${this.$ts._mfm.dummy}]`, - preview_rainbow: `$[rainbow ๐ฎ]`, + preview_rainbow: `$[rainbow ๐ฎ] $[rainbow.speed=5s ๐ฎ]`, preview_sparkle: `$[sparkle ๐ฎ]`, preview_rotate: `$[rotate ๐ฎ]`, } |