From 96194fe82279809149351710141aff87f50b1dab Mon Sep 17 00:00:00 2001 From: sokumon Date: Wed, 24 Dec 2025 14:33:18 +0530 Subject: [PATCH 1/3] fix: make desktop look decent on mobile --- frappe/desk/page/desktop/desktop.css | 79 +++++++++++++++++++++++++++ frappe/desk/page/desktop/desktop.html | 2 +- 2 files changed, 80 insertions(+), 1 deletion(-) diff --git a/frappe/desk/page/desktop/desktop.css b/frappe/desk/page/desktop/desktop.css index 6732379024..bc9884239a 100644 --- a/frappe/desk/page/desktop/desktop.css +++ b/frappe/desk/page/desktop/desktop.css @@ -182,6 +182,7 @@ .desktop-modal{ backdrop-filter: var(--desktop-blur); display: flex !important; + justify-content: center; & .modal-dialog{ & .modal-content { top: 120px; @@ -357,4 +358,82 @@ bottom: 5%; right: 5%; } +} + + /* @media screen and (max-width: 320px) { + .icons{ + grid-template-columns: repeat(2, 1fr) !important; + } + } */ +@media screen and (max-width: 570px) { + :root { + --desktop-icon-dimension: 50px; + --desktop-icon-container: 117px; + --folder-thumbnail-icon-height:17px; + } + + .desktop-container { + padding: 20px 13px; + + > .icons-container { + width: 100%; + margin-top: 0; + padding: 0; + + > .icons { + gap: 8px; + row-gap: 12px; + + @media screen and (max-width: 380px) { + --desktop-icon-container: 100px; + .folder-icon > .icons{ + grid-template-columns: repeat(2, 1fr) I !important; + } + } + + > .desktop-icon { + width: var(--desktop-icon-container); + height: var(--desktop-icon-container); + } + } + } + } + + .desktop-modal-body { + width: 90vw; + > .icons-container { + width: 100%; + overflow: hidden !important; + margin: 0px; + margin-top: 0; + padding: 0; + + > .icons { + position: relative; + right: 6%; + column-gap: 4px; + row-gap: 8px; + + @media screen and (max-width: 380px) { + --desktop-icon-container: 100px; + .folder-icon > .icons{ + grid-template-columns: repeat(2, 1fr) I !important; + } + } + + > .desktop-icon { + width: var(--desktop-icon-container); + height: var(--desktop-icon-container); + } + } + } + } + .folder-icon > .icons-container { + overflow: hidden; + > .icons { + grid-template-columns: repeat(2, 1fr) !important; + grid-template-rows: repeat(2, 1fr) !important; + } + } + } diff --git a/frappe/desk/page/desktop/desktop.html b/frappe/desk/page/desktop/desktop.html index 1931a273b4..f019534fa6 100644 --- a/frappe/desk/page/desktop/desktop.html +++ b/frappe/desk/page/desktop/desktop.html @@ -19,7 +19,7 @@ {{ _("Search") }} - {{ "⌘ K" if is_mac else "Ctrl K" }} + {{ "⌘K" if is_mac else "Ctrl+K" }} From 943e1b9d969a05ec1e07c71ace5f459c603c1692 Mon Sep 17 00:00:00 2001 From: sokumon Date: Wed, 24 Dec 2025 15:07:36 +0530 Subject: [PATCH 2/3] fix: move workspace editing actions in ellipses menu --- .../js/frappe/views/workspace/workspace.js | 112 +++++++++++++----- 1 file changed, 80 insertions(+), 32 deletions(-) diff --git a/frappe/public/js/frappe/views/workspace/workspace.js b/frappe/public/js/frappe/views/workspace/workspace.js index 89d812d65f..5af71d487f 100644 --- a/frappe/public/js/frappe/views/workspace/workspace.js +++ b/frappe/public/js/frappe/views/workspace/workspace.js @@ -179,40 +179,88 @@ frappe.views.Workspace = class Workspace { let current_page = this.workspaces.find((p) => p.name == page.name); this._page = current_page; const me = this; - let header_dropdown = `${__(this._page.name)} ${frappe.utils.icon("chevron-down")}`; - frappe.breadcrumbs.add({ - type: "Custom", - label: header_dropdown, - route: "#", - menu_items: [ - { - label: "Edit", - icon: "edit", - onClick: async () => { - if (!this.editor || !this.editor.readOnly) return; - this.is_read_only = false; - await this.editor.readOnly.toggle(); - this.editor.isReady.then(() => { - this.setup_customization_buttons(this._page); - this.make_blocks_sortable(); - }); - }, - condition: () => { - return current_page.is_editable; - }, + let header_dropdown = `${__(this._page.name)}`; + let menu_items = [ + { + label: "Edit", + icon: "edit", + onClick: async () => { + if (!this.editor || !this.editor.readOnly) return; + this.is_read_only = false; + await this.editor.readOnly.toggle(); + this.editor.isReady.then(() => { + this.setup_customization_buttons(this._page); + this.make_blocks_sortable(); + }); }, - { - label: "New", - icon: "plus", - onClick: function () { - me.initialize_new_page(true); - }, - condition: () => { - return me.has_create_access; - }, + condition: () => { + return current_page.is_editable; }, - ], - }); + }, + { + label: "New", + icon: "plus", + onClick: function () { + me.initialize_new_page(true); + }, + condition: () => { + return me.has_create_access; + }, + }, + ]; + if (frappe.is_mobile()) { + frappe.breadcrumbs.add({ + type: "Custom", + label: header_dropdown + `${frappe.utils.icon("chevron-down")}`, + route: "#", + menu_items: menu_items, + }); + } else { + frappe.breadcrumbs.add({ + type: "Custom", + label: header_dropdown, + route: "#", + }); + if (!this.add_workspace_controls) { + let workspace_actions_button = this.page.add_action_icon("ellipsis"); + $(workspace_actions_button).removeClass("btn-default"); + frappe.ui.create_menu({ + parent: $(workspace_actions_button), + open_on_left: true, + size: "fit-content", + menu_items: [ + { + label: "Edit", + icon: "edit", + onClick: async () => { + if (!this.editor || !this.editor.readOnly) return; + this.is_read_only = false; + await this.editor.readOnly.toggle(); + this.editor.isReady.then(() => { + this.setup_customization_buttons(this._page); + this.make_blocks_sortable(); + }); + }, + condition: () => { + return current_page.is_editable; + }, + }, + { + label: "New", + icon: "plus", + onClick: function () { + me.initialize_new_page(true); + }, + condition: () => { + return me.has_create_access; + }, + }, + ], + }); + this.add_workspace_controls = true; + } + } + this.wrapper.find(".workspace-header").hide(); this.wrapper .find(".editor-js-container") From cdcfc8056e40ff42d33865bd44eb869097595160 Mon Sep 17 00:00:00 2001 From: sokumon Date: Sun, 28 Dec 2025 13:15:37 +0530 Subject: [PATCH 3/3] fix: generate solid desktop alphabet icon --- frappe/public/js/frappe/utils/utils.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/frappe/public/js/frappe/utils/utils.js b/frappe/public/js/frappe/utils/utils.js index 7c07546f5a..52e274f377 100644 --- a/frappe/public/js/frappe/utils/utils.js +++ b/frappe/public/js/frappe/utils/utils.js @@ -1285,10 +1285,15 @@ Object.assign(frappe.utils, { `); - let color_value = this.desktop_pallete[color || "blue"]; - let bg_color = color_value + opacity_hex; + let pallete_color = this.desktop_pallete[color || "blue"]; + let bg_color = pallete_color + opacity_hex; + let stroke_color = pallete_color; + if (frappe.boot.desktop_icon_style == "Solid") { + bg_color = stroke_color; + stroke_color = "var(--white)"; + } icon_html.css("backgroundColor", bg_color); - icon_html.find("svg").css("color", color_value); + icon_html.find("svg").css("color", stroke_color); return icon_html.get(0).outerHTML; }, desktop_pallete: {