diff --git a/components/common/editor/editor.css b/components/common/editor/editor.css
new file mode 100644
index 0000000..f49c51a
--- /dev/null
+++ b/components/common/editor/editor.css
@@ -0,0 +1,147 @@
+/*
+ * Markdown editor: GitHub's comment editor, written once for every place Forgejo renders its own
+ * markdown editor: a bordered box whose toolbar carries the Write/Preview tabs, and a plain
+ * attachment line instead of a dashed drop area. To style another editor, add its container to
+ * the list. The release form keeps Forgejo's drop area and only takes the editor.
+ */
+:is(
+ .page-content.repository.view.issue.github-conversation .comment.form,
+ .page-content.repository.new.issue.github-issue-new,
+ .review-box-panel,
+ .comment-code-cloud,
+ .page-content.repository.new.release
+ )
+ .combo-markdown-editor {
+ border: 1px solid var(--color-light-border);
+ border-radius: var(--border-radius);
+ background: var(--color-body);
+ & markdown-toolbar {
+ background: var(--color-box-header);
+ border-bottom: 1px solid var(--color-light-border);
+ }
+ & .markdown-toolbar-button {
+ color: var(--color-text-light-1);
+ width: 28px;
+ height: 28px;
+ padding: 6px;
+ border: 0;
+ background: transparent;
+ }
+ & textarea {
+ background: var(--color-body);
+ font-size: 14px;
+ border: 1px solid var(--color-light-border);
+ border-radius: var(--border-radius);
+ box-shadow: none;
+ }
+ overflow: visible;
+
+ & markdown-toolbar {
+ border-radius: var(--border-radius) var(--border-radius) 0 0;
+ min-height: 38px;
+ padding: 0 8px 0 0;
+ gap: 8px;
+
+ & .markdown-toolbar-group {
+ flex: 0 0 auto;
+ }
+ & .switch {
+ border: 0;
+ background: transparent;
+ border-radius: 0;
+ margin: 0 auto -1px 0;
+ min-height: 38px;
+ }
+ /* Forgejo overlaps neighbouring switch items with negative margins and paints the first one. */
+ & .switch .item {
+ height: 38px;
+ min-height: 38px;
+ margin: 0 !important;
+ padding: 8px 16px !important;
+ border: 1px solid transparent;
+ border-radius: 0;
+ background: transparent !important;
+ box-shadow: none;
+ outline: 0;
+ color: var(--color-text-light-1);
+ font-size: 14px;
+ line-height: 21px;
+ font-weight: 400;
+ }
+ & .switch .item:not(.active):hover {
+ color: var(--color-text);
+ }
+ & .switch .item.active {
+ border-right-color: var(--color-light-border);
+ border-left-color: var(--color-light-border);
+ border-bottom-color: var(--color-body);
+ background: var(--color-body) !important;
+ color: var(--color-text);
+ }
+ /* The editor's own border already draws the first tab's left edge. */
+ & .switch .item.active:first-child {
+ border-left-color: transparent;
+ border-top-left-radius: var(--border-radius);
+ }
+ & .switch .item:focus-visible {
+ outline: 2px solid var(--github-fgColor-accent);
+ outline-offset: -2px;
+ }
+ & .switch .item.active::before,
+ & .switch .item.active::after {
+ display: none;
+ }
+ }
+ & > .ui.tab.markup {
+ background: var(--color-body);
+ padding: 16px;
+ min-height: 136px;
+ font-size: 14px;
+ line-height: 21px;
+ }
+ & textarea {
+ margin: 8px;
+ width: calc(100% - 16px);
+ height: auto;
+ min-height: 123px;
+ max-height: calc(35lh + 18px);
+ field-sizing: content;
+ line-height: 21px;
+ font-family: var(--fonts-proportional);
+ padding: 8px;
+ }
+}
+:is(
+ .page-content.repository.view.issue.github-conversation .comment.form,
+ .page-content.repository.new.issue.github-issue-new,
+ .review-box-panel,
+ .comment-code-cloud
+ )
+ .ui.dropzone {
+ min-height: 32px;
+ padding: 0;
+ border: 0;
+ background: transparent;
+ & .dz-message {
+ margin: 0;
+ text-align: left;
+ }
+ & .dz-button {
+ display: inline-flex;
+ align-items: center;
+ gap: 4px;
+ padding: 6px 8px;
+ min-height: 32px;
+ font-size: 12px;
+ line-height: 18px;
+ font-weight: 400;
+ color: var(--color-text-light-1);
+ background: transparent;
+ border: 0;
+ box-shadow: none;
+ }
+ border: 0 !important;
+ & .dz-button {
+ color: var(--color-text-light-1) !important;
+ }
+}
diff --git a/styles/components/issues/editor.ts b/styles/components/issues/editor.ts
deleted file mode 100644
index f3484a2..0000000
--- a/styles/components/issues/editor.ts
+++ /dev/null
@@ -1,147 +0,0 @@
-import { css, otherThemeVars, themeVars } from "@lutinglt/gitea-github-theme/core";
-
-/**
- * GitHub's comment editor, written once for every place Forgejo renders its markdown editor in an
- * issue or pull request: a bordered box whose toolbar carries the Write/Preview tabs, and a plain
- * attachment line instead of a dashed drop area. To style another editor, add its container here.
- */
-const hosts = `:is(
- .page-content.repository.view.issue.github-conversation .comment.form,
- .page-content.repository.new.issue.github-issue-new,
- .review-box-panel,
- .comment-code-cloud
-)`;
-
-/** Pages that keep Forgejo's drop area for attachments and only take the editor. */
-const editorOnlyHosts = `.page-content.repository.new.release`;
-
-export default css`
- :is(${hosts}, ${editorOnlyHosts}) .combo-markdown-editor {
- border: 1px solid ${themeVars.color.light.border};
- border-radius: ${otherThemeVars.border.radius};
- background: ${themeVars.color.body};
- & markdown-toolbar {
- background: ${themeVars.color.box.header};
- border-bottom: 1px solid ${themeVars.color.light.border};
- }
- & .markdown-toolbar-button {
- color: ${themeVars.color.text.light.num1};
- width: 28px;
- height: 28px;
- padding: 6px;
- border: 0;
- background: transparent;
- }
- & textarea {
- background: ${themeVars.color.body};
- font-size: 14px;
- border: 1px solid ${themeVars.color.light.border};
- border-radius: ${otherThemeVars.border.radius};
- box-shadow: none;
- }
- overflow: visible;
-
- & markdown-toolbar {
- border-radius: ${otherThemeVars.border.radius} ${otherThemeVars.border.radius} 0 0;
- min-height: 38px;
- padding: 0 8px 0 0;
- gap: 8px;
-
- & .markdown-toolbar-group {
- flex: 0 0 auto;
- }
- & .switch {
- border: 0;
- background: transparent;
- border-radius: 0;
- margin: 0 auto -1px 0;
- min-height: 38px;
- }
- /* Forgejo overlaps neighbouring switch items with negative margins and paints the first one. */
- & .switch .item {
- height: 38px;
- min-height: 38px;
- margin: 0 !important;
- padding: 8px 16px !important;
- border: 1px solid transparent;
- border-radius: 0;
- background: transparent !important;
- box-shadow: none;
- outline: 0;
- color: ${themeVars.color.text.light.num1};
- font-size: 14px;
- line-height: 21px;
- font-weight: 400;
- }
- & .switch .item:not(.active):hover {
- color: ${themeVars.color.text.self};
- }
- & .switch .item.active {
- border-right-color: ${themeVars.color.light.border};
- border-left-color: ${themeVars.color.light.border};
- border-bottom-color: ${themeVars.color.body};
- background: ${themeVars.color.body} !important;
- color: ${themeVars.color.text.self};
- }
- /* The editor's own border already draws the first tab's left edge. */
- & .switch .item.active:first-child {
- border-left-color: transparent;
- border-top-left-radius: ${otherThemeVars.border.radius};
- }
- & .switch .item:focus-visible {
- outline: 2px solid ${themeVars.github.fgColor.accent};
- outline-offset: -2px;
- }
- & .switch .item.active::before,
- & .switch .item.active::after {
- display: none;
- }
- }
- & > .ui.tab.markup {
- background: ${themeVars.color.body};
- padding: 16px;
- min-height: 136px;
- font-size: 14px;
- line-height: 21px;
- }
- & textarea {
- margin: 8px;
- width: calc(100% - 16px);
- height: auto;
- min-height: 123px;
- max-height: calc(35lh + 18px);
- field-sizing: content;
- line-height: 21px;
- font-family: var(--fonts-proportional);
- padding: 8px;
- }
- }
- ${hosts} .ui.dropzone {
- min-height: 32px;
- padding: 0;
- border: 0;
- background: transparent;
- & .dz-message {
- margin: 0;
- text-align: left;
- }
- & .dz-button {
- display: inline-flex;
- align-items: center;
- gap: 4px;
- padding: 6px 8px;
- min-height: 32px;
- font-size: 12px;
- line-height: 18px;
- font-weight: 400;
- color: ${themeVars.color.text.light.num1};
- background: transparent;
- border: 0;
- box-shadow: none;
- }
- border: 0 !important;
- & .dz-button {
- color: ${themeVars.color.text.light.num1} !important;
- }
- }
-`;
diff --git a/styles/components/issues/index.ts b/styles/components/issues/index.ts
index 03a60fc..bb1ef60 100644
--- a/styles/components/issues/index.ts
+++ b/styles/components/issues/index.ts
@@ -18,7 +18,6 @@
*/
import { cssCombine } from "@lutinglt/gitea-github-theme/core";
-import editor from "./editor";
import issue from "./issue";
import issueComment from "./issue_comment";
import issueConversation from "./issue_conversation";
@@ -36,7 +35,6 @@ export default cssCombine(
issueList,
issueOverview,
issueConversation,
- editor,
issueNew,
pullReview,
pullFilesReview,
diff --git a/templates/base/component_assets.tmpl b/templates/base/component_assets.tmpl
index c7cf804..0dc5201 100644
--- a/templates/base/component_assets.tmpl
+++ b/templates/base/component_assets.tmpl
@@ -1,5 +1,6 @@
+