Setup to also support steps

This commit is contained in:
Freeplay 2023-06-02 15:39:33 -04:00
parent c722cee101
commit d8d2ee266e

View file

@ -59,7 +59,9 @@ export default defineComponent({
}; };
const validEase = (e: string | null | undefined) => { const validEase = (e: string | null | undefined) => {
if (e == null) return null; if (e == null) return null;
return e.match(/\(-?[0-9.]+,-?[0-9.]+,-?[0-9.]+,-?[0-9.]+\)/) ? e : null; return e.match(/(steps)?\(-?[0-9.]+,-?[0-9.]+,-?[0-9.]+,-?[0-9.]+\)/)
? (e.startsWith("steps") ? e : "cubic-bezier" + e)
: null
} }
const genEl = (ast: mfm.MfmNode[]) => const genEl = (ast: mfm.MfmNode[]) =>
@ -107,8 +109,8 @@ export default defineComponent({
case "tada": { case "tada": {
const speed = validTime(token.props.args.speed) || "1s"; const speed = validTime(token.props.args.speed) || "1s";
const delay = validTime(token.props.args.delay) || "0s"; const delay = validTime(token.props.args.delay) || "0s";
const ease = validEase(token.props.args.ease) || "(0,0,1,1)"; const ease = validEase(token.props.args.ease) || "linear";
style = `font-size: 150%; animation: tada ${speed} ${delay} cubic-bezier${ease} infinite both;`; style = `font-size: 150%; animation: tada ${speed} ${delay} ${ease} infinite both;`;
break; break;
} }
case "jelly": { case "jelly": {