merge: show the border MFM function in cheatsheet - fixes #533 (!862)

View MR for information: https://activitypub.software/TransFem-org/Sharkey/-/merge_requests/862

Closes #533

Approved-by: Hazelnoot <acomputerdog@gmail.com>
Approved-by: Marie <github@yuugi.dev>

locales/index.d.ts

@@ -11529,6 +11529,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">
@@ -421,7 +431,7 @@ const preview_center = ref(
 );
 const preview_inlineCode = ref('`<: "Hello, world!"`');
 const preview_blockCode = ref(
-	'```\n~ (#i, 100) {\n\t<: ? ((i % 15) = 0) "FizzBuzz"\n\t\t.? ((i % 3) = 0) "Fizz"\n\t\t.? ((i % 5) = 0) "Buzz"\n\t\t. i\n}\n```',
+	'```ai\n~ (#i, 100) {\n\t<: ? ((i % 15) = 0) "FizzBuzz"\n\t\t.? ((i % 3) = 0) "Fizz"\n\t\t.? ((i % 5) = 0) "Buzz"\n\t\t. i\n}\n```',
 );
 const preview_inlineMath = ref(
 	'\\(x= \\frac{-b\' \\pm \\sqrt{(b\')^2-ac}}{a}\\)',
@@ -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

@@ -384,6 +384,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: