From a8d2103980da04aa473f4ba7c5c20b9392c23027 Mon Sep 17 00:00:00 2001 From: Mar0xy Date: Wed, 4 Oct 2023 03:36:26 +0200 Subject: [PATCH] upd: add MFM Cheatsheet Closes transfem-org/Sharkey#21 --- locales/en-US.yml | 73 +++ .../frontend/src/components/MkMfmWindow.vue | 476 ++++++++++++++++++ .../frontend/src/components/MkPostForm.vue | 7 +- 3 files changed, 555 insertions(+), 1 deletion(-) create mode 100644 packages/frontend/src/components/MkMfmWindow.vue diff --git a/locales/en-US.yml b/locales/en-US.yml index 24fece3e4..2e6cb32e3 100644 --- a/locales/en-US.yml +++ b/locales/en-US.yml @@ -2138,3 +2138,76 @@ _moderationLogTypes: createAd: "Ad created" deleteAd: "Ad deleted" updateAd: "Ad updated" +_mfm: + intro: "MFM is a markup language used on Misskey, Sharkey, Firefish, Akkoma, and more that can be used in many places. Here you can view a list of all available MFM syntax." + dummy: "Sharkey expands the world of the Fediverse" + mention: "Mention" + mentionDescription: "You can specify a user by using an At-Symbol and a username." + hashtag: "Hashtag" + hashtagDescription: "You can specify a hashtag using a number sign and text." + url: "URL" + urlDescription: "URLs can be displayed." + link: "Link" + linkDescription: "Specific parts of text can be displayed as a URL." + bold: "Bold" + boldDescription: "Highlights letters by making them thicker." + small: "Small" + smallDescription: "Displays content small and thin." + center: "Center" + centerDescription: "Displays content centered." + inlineCode: "Code (Inline)" + inlineCodeDescription: "Displays inline syntax highlighting for (program) code." + blockCode: "Code (Block)" + blockCodeDescription: "Displays syntax highlighting for multi-line (program) code in a block." + inlineMath: "Math (Inline)" + inlineMathDescription: "Display math formulas (KaTeX) in-line" + blockMath: "Math (Block)" + blockMathDescription: "Display math formulas (KaTeX) in a block" + quote: "Quote" + quoteDescription: "Displays content as a quote." + emoji: "Custom Emoji" + emojiDescription: "By surrounding a custom emoji name with colons, custom emoji can be displayed." + search: "Search" + searchDescription: "Displays a search box with pre-entered text." + flip: "Flip" + flipDescription: "Flips content horizontally or vertically." + jelly: "Animation (Jelly)" + jellyDescription: "Gives content a jelly-like animation." + tada: "Animation (Tada)" + tadaDescription: "Gives content a \"Tada!\"-like animation." + jump: "Animation (Jump)" + jumpDescription: "Gives content a jumping animation." + bounce: "Animation (Bounce)" + bounceDescription: "Gives content a bouncy animation." + shake: "Animation (Shake)" + shakeDescription: "Gives content a shaking animation." + twitch: "Animation (Twitch)" + twitchDescription: "Gives content a strongly twitching animation." + spin: "Animation (Spin)" + spinDescription: "Gives content a spinning animation." + x2: "Big" + x2Description: "Displays content bigger." + x3: "Very big" + x3Description: "Displays content even bigger." + x4: "Unbelievably big" + x4Description: "Displays content even bigger than bigger than big." + blur: "Blur" + blurDescription: "Blurs content. It will be displayed clearly when hovered over." + font: "Font" + fontDescription: "Sets the font to display content in." + rainbow: "Rainbow" + rainbowDescription: "Makes the content appear in rainbow colors." + sparkle: "Sparkle" + sparkleDescription: "Gives content a sparkling particle effect." + rotate: "Rotate" + rotateDescription: "Turns content by a specified angle." + position: "Position" + positionDescription: "Move content by a specified amount." + scale: "Scale" + scaleDescription: "Scale content by a specified amount." + foreground: "Foreground color" + foregroundDescription: "Change the foreground color of text." + background: "Background color" + backgroundDescription: "Change the background color of text." + plain: "Plain" + plainDescription: "Deactivates the effects of all MFM contained within this MFM effect." diff --git a/packages/frontend/src/components/MkMfmWindow.vue b/packages/frontend/src/components/MkMfmWindow.vue new file mode 100644 index 000000000..eb0ccc560 --- /dev/null +++ b/packages/frontend/src/components/MkMfmWindow.vue @@ -0,0 +1,476 @@ + + + + + \ No newline at end of file diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue index 623e79d4c..613d93dfa 100644 --- a/packages/frontend/src/components/MkPostForm.vue +++ b/packages/frontend/src/components/MkPostForm.vue @@ -88,6 +88,7 @@ SPDX-License-Identifier: AGPL-3.0-only
+
@@ -346,6 +347,10 @@ function watchForDraft() { watch($$(localOnly), () => saveDraft()); } +function MFMWindow() { + os.popup(defineAsyncComponent(() => import('@/components/MkMfmWindow.vue')), {}, {}, 'closed'); +} + function checkMissingMention() { if (visibility === 'specified') { const ast = mfm.parse(text); @@ -1159,7 +1164,7 @@ defineExpose({ } .footerRight { - flex: 0; + flex: 0.3; margin-left: auto; display: grid; grid-auto-flow: row;