diff --git a/apps/client/src/services/css_class_manager.ts b/apps/client/src/services/css_class_manager.ts
index b28b24b23..4c0c0f360 100644
--- a/apps/client/src/services/css_class_manager.ts
+++ b/apps/client/src/services/css_class_manager.ts
@@ -38,7 +38,7 @@ function createClassForColor(colorString: string | null) {
         registeredClasses.add(className);
     }
 
-    return className;
+    return `color ${className}`;
 }
 
 function parseColor(color: string) {
diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css
index b686dd113..e3372b4af 100644
--- a/apps/client/src/stylesheets/style.css
+++ b/apps/client/src/stylesheets/style.css
@@ -25,7 +25,8 @@
     --bs-body-font-weight: var(--main-font-weight) !important;
     --bs-body-color: var(--main-text-color) !important;
     --bs-body-bg: var(--main-background-color) !important;    
-    --ck-mention-list-max-height: 500px;
+    --ck-mention-list-max-height: 500px;    
+    --tn-modal-max-height: 90vh;
 }
 
 body#trilium-app.motion-disabled *,
@@ -212,6 +213,16 @@ input::placeholder,
     background-color: var(--modal-backdrop-color) !important;
 }
 
+body.mobile .modal .modal-dialog {
+    left: 50%;
+    transform: translateX(-50%);
+    width: 100%;
+}
+
+body.mobile .modal .modal-content {
+    border-radius: var(--bs-modal-border-radius) var(--bs-modal-border-radius) 0 0;
+}
+
 .component {
     contain: size;
 }
@@ -706,11 +717,6 @@ table.promoted-attributes-in-tooltip th {
     z-index: 32767 !important;
 }
 
-.tooltip-trigger {
-    background: transparent;
-    pointer-events: none;
-}
-
 .bs-tooltip-bottom .tooltip-arrow::before {
     border-bottom-color: var(--main-border-color) !important;
 }
@@ -1006,9 +1012,17 @@ div[data-notify="container"] {
     font-family: var(--monospace-font-family);
 }
 
-svg.ck-icon .note-icon {
-    color: var(--main-text-color);
-    font-size: 20px;
+svg.ck-icon {
+    &.ck-icon_inherit-color {
+        * {
+            fill: currentColor;
+        }
+    }
+
+    &.note-icon {
+        color: var(--main-text-color);
+        font-size: 20px;
+    }
 }
 
 .ck-content {
@@ -1312,7 +1326,7 @@ body.mobile #context-menu-container.mobile-bottom-menu {
     inset-inline-end: 0 !important;
     bottom: 0 !important;
     top: unset !important;
-    max-height: 90vh;
+    max-height: var(--tn-modal-max-height);
     overflow: auto !important;
     user-select: none;
     -webkit-user-select: none;
@@ -1375,6 +1389,20 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
     flex-shrink: 0;
 }
 
+.right-dropdown-widget .right-dropdown-button {
+    position: relative;
+}
+
+.tooltip-trigger {
+    background: transparent;
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+}
+
 #launcher-pane.horizontal .right-dropdown-widget {
     width: 53px;
 }
@@ -1558,7 +1586,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
         inset-inline-end: 0 !important;
         transform: unset !important;
         overflow-y: auto;
-        max-height: calc(90vh - var(--dropdown-bottom));
+        max-height: calc(var(--tn-modal-max-height) - var(--dropdown-bottom));
     }
 
     #mobile-sidebar-container {
diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css
index 51db2bc27..117eeb8b7 100644
--- a/apps/client/src/stylesheets/theme-next-dark.css
+++ b/apps/client/src/stylesheets/theme-next-dark.css
@@ -300,7 +300,7 @@ body .todo-list input[type="checkbox"]:not(:checked):before {
     border-color: var(--muted-text-color) !important;
 }
 
-.tinted-quick-edit-dialog {
+.quick-edit-dialog-wrapper.color {
     --modal-background-color: hsl(var(--custom-color-hue), 8.8%, 11.2%);
     --modal-border-color: hsl(var(--custom-color-hue), 9.4%, 25.1%);
     --promoted-attribute-card-background-color: hsl(var(--custom-color-hue), 13.2%, 20.8%);
diff --git a/apps/client/src/stylesheets/theme-next-light.css b/apps/client/src/stylesheets/theme-next-light.css
index 66e3538c6..a3fc26e93 100644
--- a/apps/client/src/stylesheets/theme-next-light.css
+++ b/apps/client/src/stylesheets/theme-next-light.css
@@ -276,7 +276,7 @@
     --custom-bg-color: hsl(var(--custom-color-hue), 37%, 89%, 1);
 }
 
-.tinted-quick-edit-dialog {
+.quick-edit-dialog-wrapper.color {
     --modal-background-color: hsl(var(--custom-color-hue), 56%, 96%);
     --modal-border-color: hsl(var(--custom-color-hue), 33%, 41%);
     --promoted-attribute-card-background-color: hsl(var(--custom-color-hue), 40%, 88%);
diff --git a/apps/client/src/translations/cn/translation.json b/apps/client/src/translations/cn/translation.json
index e1f086e85..6c82a00af 100644
--- a/apps/client/src/translations/cn/translation.json
+++ b/apps/client/src/translations/cn/translation.json
@@ -1662,7 +1662,7 @@
   },
   "editable-text": {
     "auto-detect-language": "自动检测",
-    "keeps-crashing": "编辑组件时崩溃。请尝试重启 Trilium。如果问题仍然存在，请考虑提交错误报告。"
+    "keeps-crashing": "编辑组件时持续崩溃。请尝试重启 Trilium。如果问题仍然存在，请考虑提交错误报告。"
   },
   "highlighting": {
     "title": "代码块",
diff --git a/apps/client/src/widgets/buttons/right_dropdown_button.ts b/apps/client/src/widgets/buttons/right_dropdown_button.ts
index 4b3505bc9..45915c254 100644
--- a/apps/client/src/widgets/buttons/right_dropdown_button.ts
+++ b/apps/client/src/widgets/buttons/right_dropdown_button.ts
@@ -7,9 +7,9 @@ const TPL = /*html*/`
 <div class="dropdown right-dropdown-widget">
     <button type="button" data-bs-toggle="dropdown"
             aria-haspopup="true" aria-expanded="false"
-            class="bx right-dropdown-button launcher-button"></button>
-
-    <div class="tooltip-trigger"></div>
+            class="bx right-dropdown-button launcher-button">
+        <div class="tooltip-trigger"></div>
+    </button>
 
     <div class="dropdown-menu"></div>
 </div>
@@ -52,9 +52,8 @@ export default class RightDropdownButtonWidget extends BasicWidget {
             }
         });
 
-        this.$widget.attr("title", this.title);
-        this.tooltip = Tooltip.getOrCreateInstance(this.$widget[0], {
-            trigger: "hover",
+        this.$tooltip = this.$widget.find(".tooltip-trigger").attr("title", this.title);
+        this.tooltip = new Tooltip(this.$tooltip[0], {
             placement: handleRightToLeftPlacement(this.settings.titlePlacement),
             fallbackPlacements: [ handleRightToLeftPlacement(this.settings.titlePlacement) ]
         });
@@ -62,7 +61,9 @@ export default class RightDropdownButtonWidget extends BasicWidget {
         this.$widget
             .find(".right-dropdown-button")
             .addClass(this.iconClass)
-            .on("click", () => this.tooltip.hide());
+            .on("click", () => this.tooltip.hide())
+            .on("mouseenter", () => this.tooltip.show())
+            .on("mouseleave", () => this.tooltip.hide());
 
         this.$widget.on("show.bs.dropdown", async () => {
             await this.dropdownShown();
diff --git a/apps/client/src/widgets/dialogs/PopupEditor.css b/apps/client/src/widgets/dialogs/PopupEditor.css
index c545a13eb..f72cf2274 100644
--- a/apps/client/src/widgets/dialogs/PopupEditor.css
+++ b/apps/client/src/widgets/dialogs/PopupEditor.css
@@ -5,14 +5,20 @@ body.popup-editor-open .ck-clipboard-drop-target-line { z-index: 1000; }
 
 body.desktop .modal.popup-editor-dialog .modal-dialog {
     max-width: 75vw;
-}
-
-.modal.popup-editor-dialog .modal-dialog {
     border-bottom-left-radius: var(--bs-modal-border-radius);
     border-bottom-right-radius: var(--bs-modal-border-radius);
+}
+
+body.desktop .modal.popup-editor-dialog .modal-dialog {
     overflow: hidden;
 }
 
+body.mobile .modal.popup-editor-dialog .modal-dialog {
+    max-width: 90vw;
+    max-height: var(--tn-modal-max-height);
+    height: 100%;
+}
+
 .modal.popup-editor-dialog .modal-header .modal-title {
     font-size: 1.1em;
 }
diff --git a/apps/client/src/widgets/dialogs/PopupEditor.tsx b/apps/client/src/widgets/dialogs/PopupEditor.tsx
index a6c641d8d..1a065c05f 100644
--- a/apps/client/src/widgets/dialogs/PopupEditor.tsx
+++ b/apps/client/src/widgets/dialogs/PopupEditor.tsx
@@ -1,7 +1,7 @@
 import { useContext, useEffect, useMemo, useRef, useState } from "preact/hooks";
 import Modal from "../react/Modal";
 import "./PopupEditor.css";
-import { useNoteContext, useTriliumEvent } from "../react/hooks";
+import { useNoteContext, useNoteLabel, useTriliumEvent } from "../react/hooks";
 import NoteTitleWidget from "../note_title";
 import NoteIcon from "../note_icon";
 import NoteContext from "../../components/note_context";
@@ -89,17 +89,10 @@ export default function PopupEditor() {
 export function DialogWrapper({ children }: { children: ComponentChildren }) {
     const { note } = useNoteContext();
     const wrapperRef = useRef<HTMLDivElement>(null);
-    const [ hasTint, setHasTint ] = useState(false);
-
-    // Apply the tinted-dialog class only if the custom color CSS class specifies a hue
-    useEffect(() => {
-        if (!wrapperRef.current) return;
-        const customHue = getComputedStyle(wrapperRef.current).getPropertyValue("--custom-color-hue");
-        setHasTint(!!customHue);
-    }, [ note ]);
+    useNoteLabel(note, "color"); // to update color class
 
     return (
-        <div ref={wrapperRef} class={`quick-edit-dialog-wrapper ${note?.getColorClass() ?? ""} ${hasTint ? "tinted-quick-edit-dialog" : ""}`}>
+        <div ref={wrapperRef} class={`quick-edit-dialog-wrapper ${note?.getColorClass() ?? ""}`}>
             {children}
         </div>
     )
diff --git a/apps/client/src/widgets/type_widgets/NoteMap.css b/apps/client/src/widgets/type_widgets/NoteMap.css
new file mode 100644
index 000000000..0afa0f4d2
--- /dev/null
+++ b/apps/client/src/widgets/type_widgets/NoteMap.css
@@ -0,0 +1,10 @@
+.note-detail-note-map {
+    &>div {
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        overflow: hidden;
+    }
+}
\ No newline at end of file
diff --git a/apps/client/src/widgets/type_widgets/NoteMap.tsx b/apps/client/src/widgets/type_widgets/NoteMap.tsx
index 7a308151c..aca9f68d1 100644
--- a/apps/client/src/widgets/type_widgets/NoteMap.tsx
+++ b/apps/client/src/widgets/type_widgets/NoteMap.tsx
@@ -1,6 +1,7 @@
 import { TypeWidgetProps } from "./type_widget";
 import NoteMapEl from "../note_map/NoteMap";
 import { useRef } from "preact/hooks";
+import "./NoteMap.css";
 
 export default function NoteMap({ note }: TypeWidgetProps) {
     const containerRef = useRef<HTMLDivElement>(null);
diff --git a/apps/website/src/translations/ko/translation.json b/apps/website/src/translations/ko/translation.json
index f399f0f4d..75fa485e7 100644
--- a/apps/website/src/translations/ko/translation.json
+++ b/apps/website/src/translations/ko/translation.json
@@ -85,5 +85,8 @@
         "title_arm64": "ARM 기반 리눅스",
         "description_x64": "대부분의 리눅스 배포판에서 x86_64 아키텍처와 호환됩니다.",
         "description_arm64": "ARM 기반 리눅스 배포판에서 aarch64 아키텍처와 호환됩니다."
+    },
+    "note_types": {
+        "text_title": "텍스트 노트"
     }
 }