diff --git a/packages/client/src/components/mfm.ts b/packages/client/src/components/mfm.ts index ddfcc3de17..f2905ec354 100644 --- a/packages/client/src/components/mfm.ts +++ b/packages/client/src/components/mfm.ts @@ -254,6 +254,35 @@ export default defineComponent({ style = `transform: ${rotate}(${degrees}deg); transform-origin: center center;`; break; } + case "position": { + if (!defaultStore.state.advancedMfm) break; + const x = parseFloat(token.props.args.x ?? "0"); + const y = parseFloat(token.props.args.y ?? "0"); + style = `transform: translateX(${x}em) translateY(${y}em);`; + break; + } + case "scale": { + if (!defaultStore.state.advancedMfm) { + style = ""; + break; + } + const x = Math.min(parseFloat(token.props.args.x ?? "1"), 5); + const y = Math.min(parseFloat(token.props.args.y ?? "1"), 5); + style = `transform: scale(${x}, ${y});`; + break; + } + case "fg": { + let color = token.props.args.color; + if (!/^[0-9a-f]{3,6}$/i.test(color)) color = "f00"; + style = `color: #${color};`; + break; + } + case "bg": { + let color = token.props.args.color; + if (!/^[0-9a-f]{3,6}$/i.test(color)) color = "f00"; + style = `background-color: #${color};`; + break; + } } if (style == null) { return h("span", {}, [ diff --git a/packages/client/src/scripts/get-note-menu.ts b/packages/client/src/scripts/get-note-menu.ts index 8ab714af30..eb8006c1c5 100644 --- a/packages/client/src/scripts/get-note-menu.ts +++ b/packages/client/src/scripts/get-note-menu.ts @@ -224,9 +224,16 @@ export function getNoteMenu(props: { } function showReactions(): void { - os.popup(defineAsyncComponent(() => import('@/components/MkReactedUsersDialog.vue')), { - noteId: appearNote.id, - }, {}, 'closed'); + os.popup( + defineAsyncComponent( + () => import("@/components/MkReactedUsersDialog.vue"), + ), + { + noteId: appearNote.id, + }, + {}, + "closed", + ); } async function translate(): Promise { diff --git a/packages/client/src/scripts/mfm-tags.ts b/packages/client/src/scripts/mfm-tags.ts index 51e1fc4e63..b39c8b37b8 100644 --- a/packages/client/src/scripts/mfm-tags.ts +++ b/packages/client/src/scripts/mfm-tags.ts @@ -10,6 +10,10 @@ export const MFM_TAGS = [ "x2", "x3", "x4", + "scale", + "position", + "fg", + "bg", "font", "blur", "rainbow",