show the border MFM function in cheatsheet - fixes #533

locales/index.d.ts

@@ -11525,6 +11525,14 @@ export interface Locale extends ILocale {
          * Change the background color of text.
          */
         "backgroundDescription": string;
+        /**
+         * Border
+         */
+        "border": string;
+        /**
+         * Draw a border around the content.
+         */
+        "borderDescription": string;
         /**
          * Plain
          */

packages/frontend/src/components/SkMfmWindow.vue

@@ -381,6 +381,16 @@ SPDX-License-Identifier: AGPL-3.0-only
 						</div>
 					</div>
 				</div>
+				<div class="section _block">
+					<div class="title">{{ i18n.ts._mfm.border }}</div>
+					<div class="content">
+						<p>{{ i18n.ts._mfm.borderDescription }}</p>
+						<div class="preview">
+							<Mfm :text="preview_border"/>
+							<MkTextarea v-model="preview_border"><span>MFM</span></MkTextarea>
+						</div>
+					</div>
+				</div>
 				<div class="section _block">
 					<div class="title">{{ i18n.ts._mfm.plain }}</div>
 					<div class="content">
@@ -479,6 +489,7 @@ const preview_scale = ref(
 );
 const preview_fg = ref('$[fg.color=eb6f92 Text color]');
 const preview_bg = ref('$[bg.color=31748f Background color]');
+const preview_border = ref('$[border.color=eb6f92,style=outset,width=10,radius=10 Border]');
 const preview_plain = ref(
 	'<plain>**bold** @mention #hashtag `code` $[x2 🍮]</plain>',
 );

sharkey-locales/en-US.yml

@@ -383,6 +383,8 @@ _mfm:
   fadeDescription: 'Fade text in and out.'
   background: "Background color"
   backgroundDescription: "Change the background color of text."
+  border: "Border"
+  borderDescription: "Draw a border around the content."
   plain: "Plain"
   plainDescription: "Deactivates the effects of all MFM contained within this MFM effect."
 _animatedMFM: