From 5a5ab8ef5ac5fbdb893707933f06ff6bcd8e834a Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Sat, 29 Apr 2023 19:35:59 +0800
Subject: Start cleaning the messy ".ui.left / .ui.right", improve label list
 page, fix stackable menu (#24393)

Since 2015/2016, there is a global pollution: ".ui.left" / ".ui.right".

Fomantic UI doesn't work this way, it just conflicts with many Fomantic
definitions.

This PR starts the cleaning work of such techinical debts.

And, the "label list" page has been quite messy for long time, for
example, why "li" appears in "div" ......

And fix #24296

<details>


![image](https://user-images.githubusercontent.com/2114189/235051281-54c5374c-b5fd-4b5f-9aa2-02d4bb2d9112.png)


![image](https://user-images.githubusercontent.com/2114189/235055703-2ba042e0-4db7-4e63-8646-02f390d496b5.png)


![image](https://user-images.githubusercontent.com/2114189/235056310-4f6ffdc2-5758-4927-8fb8-314d9fb72a6b.png)


![image](https://user-images.githubusercontent.com/2114189/235058400-dab1c9ec-3325-4671-8345-aee6b0b68042.png)


![image](https://user-images.githubusercontent.com/2114189/235058424-85509532-b9bc-43ad-b00f-a87184c60f22.png)

</details>
---
 web_src/css/editor/combomarkdowneditor.css | 133 +++++++++++++++++++++++++++++
 1 file changed, 133 insertions(+)
 create mode 100644 web_src/css/editor/combomarkdowneditor.css

(limited to 'web_src/css/editor')

diff --git a/web_src/css/editor/combomarkdowneditor.css b/web_src/css/editor/combomarkdowneditor.css
new file mode 100644
index 0000000000..eb5c5d13b8
--- /dev/null
+++ b/web_src/css/editor/combomarkdowneditor.css
@@ -0,0 +1,133 @@
+.combo-markdown-editor {
+  width: 100%;
+}
+
+.combo-markdown-editor markdown-toolbar {
+  cursor: default;
+  display: flex;
+  align-items: center;
+  padding-bottom: 10px;
+}
+
+.combo-markdown-editor .markdown-toolbar-group {
+  display: flex;
+}
+
+.combo-markdown-editor .markdown-toolbar-group:last-child {
+  flex: 1;
+  justify-content: flex-end;
+}
+
+.combo-markdown-editor .markdown-toolbar-button {
+  border: none;
+  background: none;
+  user-select: none;
+  padding: 5px;
+  cursor: pointer;
+  color: var(--color-text);
+}
+
+.combo-markdown-editor .markdown-toolbar-button:hover {
+  color: var(--color-primary);
+}
+
+.ui.form .combo-markdown-editor textarea.markdown-text-editor,
+.combo-markdown-editor textarea.markdown-text-editor {
+  display: block;
+  width: 100%;
+  min-height: 200px;
+  max-height: calc(100vh - 200px);
+  resize: vertical;
+}
+
+.combo-markdown-editor .CodeMirror-scroll {
+  max-height: calc(100vh - 200px);
+}
+
+/* use the same styles as markup/content.css */
+.combo-markdown-editor .CodeMirror-scroll .cm-header-1 {
+  font-size: 2em;
+}
+
+.combo-markdown-editor .CodeMirror-scroll .cm-header-2 {
+  font-size: 1.5em;
+}
+
+.combo-markdown-editor .CodeMirror-scroll .cm-header-3 {
+  font-size: 1.25em;
+}
+
+.combo-markdown-editor .CodeMirror-scroll .cm-header-4 {
+  font-size: 1em;
+}
+
+.combo-markdown-editor .CodeMirror-scroll .cm-header-5 {
+  font-size: 0.875em;
+}
+
+.combo-markdown-editor .CodeMirror-scroll .cm-header-6 {
+  font-size: 0.85em;
+}
+
+text-expander {
+  display: block;
+  position: relative;
+}
+
+text-expander .suggestions {
+  position: absolute;
+  min-width: 180px;
+  padding: 0;
+  margin-top: 24px;
+  list-style: none;
+  background: var(--color-box-body);
+  border-radius: 5px;
+  border: 1px solid var(--color-secondary);
+  box-shadow: 0 .5rem 1rem var(--color-shadow);
+}
+
+text-expander .suggestions li {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  padding: 4px 8px;
+  font-weight: 500;
+}
+
+text-expander .suggestions li + li {
+  border-top: 1px solid var(--color-secondary-alpha-40);
+}
+
+text-expander .suggestions li:first-child {
+  border-radius: 4px 4px 0 0;
+}
+
+text-expander .suggestions li:last-child {
+  border-radius: 0 0 4px 4px;
+}
+
+text-expander .suggestions li:only-child {
+  border-radius: 4px;
+}
+
+text-expander .suggestions li:hover {
+  background: var(--color-hover);
+}
+
+text-expander .suggestions .fullname {
+  font-weight: normal;
+  margin-left: 4px;
+  color: var(--color-text-light-1);
+}
+
+text-expander .suggestions li[aria-selected="true"],
+text-expander .suggestions li[aria-selected="true"] span {
+  background: var(--color-primary);
+  color: var(--color-primary-contrast);
+}
+
+text-expander .suggestions img {
+  width: 24px;
+  height: 24px;
+  margin-right: 8px;
+}
-- 
cgit v1.2.3