build(deps-dev): bump @StackExchange/stacks from 2.2.0 to 2.3.0 (#293)

package.json

@@ -49,7 +49,7 @@
         "@playwright/test": "^1.41.2",
         "@stackoverflow/commitlint-config": "^1.0.0",
         "@stackoverflow/prettier-config": "^1.0.0",
-        "@stackoverflow/stacks": "^2.2.0",
+        "@stackoverflow/stacks": "^2.3.0",
         "@stackoverflow/tsconfig": "^1.0.0",
         "@types/jest": "^29.5.12",
         "@typescript-eslint/eslint-plugin": "^7.0.2",

src/stacks-editor/editor.ts

@@ -351,13 +351,13 @@ export class StacksEditor implements View {
         const container = document.createElement("div");
         container.className = "flex--item d-flex ai-center ml24 fc-medium";
 
-        container.innerHTML = escapeHTML`<div class="s-btn-group s-btn-group--radio fw-nowrap myn2">
+        container.innerHTML = escapeHTML`<div class="s-btn-group s-editor-btn-group fw-nowrap myn2">
     <input type="radio" name="mode-toggle-${this.internalId}"
         id="mode-toggle-rich-${this.internalId}"
         class="s-btn--radio js-editor-toggle-btn"
         data-mode="${EditorType.RichText}"
         ${richCheckedProp} />
-    <label class="s-btn s-btn__muted s-btn__outlined s-editor-btn"
+    <label class="s-btn s-btn__muted s-btn__icon px6 py2 s-editor-btn"
         for="mode-toggle-rich-${this.internalId}"
         title="${_t("menubar.mode_toggle_richtext_title")}">
         <span class="svg-icon-bg iconRichText"></span>
@@ -371,7 +371,7 @@ export class StacksEditor implements View {
         data-mode="${EditorType.Commonmark}"
         data-preview="false"
         ${markCheckedProp} />
-    <label class="s-btn s-btn__muted s-btn__outlined s-editor-btn"
+    <label class="s-btn s-btn__muted px6 py2 s-editor-btn"
         for="mode-toggle-markdown-${this.internalId}"
         title="${_t("menubar.mode_toggle_markdown_title")}">
         <span class="svg-icon-bg iconMarkdown"></span>
@@ -392,7 +392,7 @@ export class StacksEditor implements View {
     data-mode="${EditorType.Commonmark}"
     data-preview="${previewEnabled.toString()}"
     ${previewCheckedProp} />
-<label class="s-btn s-btn__muted s-btn__outlined s-editor-btn px6"
+<label class="s-btn s-btn__muted s-btn__icon px6 py2 s-editor-btn"
     for="mode-toggle-preview-${this.internalId}"
     title="${_t("menubar.mode_toggle_preview_title")}">
     <span class="svg-icon-bg iconMarkdownPreview"></span>

src/styles/custom-components.css

@@ -96,11 +96,6 @@
     right: var(--su2);
 }
 
-.s-btn-group--radio .s-btn.s-editor-btn {
-    margin: calc(var(--su2) * -1) 0;
-    padding: var(--su4) var(--su6);
-}
-
 .s-editor--dropdown-item {
     padding: var(--su4) var(--su12);
 }