Add strikethrough, code, and table to md editor toolbar

frontend/src/components/MarkdownEditor.vue

@@ -23,6 +23,7 @@ const props = withDefaults(
     errorMessages?: string[];
     rules?: ValidationRule<string | undefined>[];
     noPaddingTop?: boolean;
+    maxHeight?: string;
   }>(),
   {
     maxlength: 30_000,
@@ -30,6 +31,7 @@ const props = withDefaults(
     errorMessages: undefined,
     rules: undefined,
     noPaddingTop: false,
+    maxHeight: "500px",
   }
 );
 
@@ -90,10 +92,17 @@ async function startEditing() {
     forceSync: true,
     indentWithTabs: false,
     spellChecker: false,
+    promptURLs: true,
+    showIcons: ["strikethrough", "code", "table"],
+    shortcuts: {
+      drawTable: "Cmd-Alt-T",
+      toggleStrikethrough: "Cmd-Alt-S",
+    },
     sideBySideFullscreen: false,
     autoRefresh: {
       delay: 300,
     },
+    maxHeight: props.maxHeight,
     previewClass: ["prose", "markdown", "background-default"],
     previewRender: (markdownPlaintext, previewElement) => {
       const html = useDomPurify().sanitize(parseMarkdown(markdownPlaintext));

frontend/src/pages/[user]/[project]/index.vue

@@ -84,6 +84,7 @@ function createPinnedVersionUrl(version: PinnedVersion): string {
             :cancellable="true"
             :maxlength="useBackendData.validations.project.sponsorsContent?.max"
             :title="i18n.t('project.sponsors')"
+            max-height="200px"
             class="pt-0 mr-4"
             @save="saveSponsors"
           />