From d044fce9c1192d691116e424ddd55ef1241dfe96 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 14:44:21 +0200 Subject: [PATCH 01/11] fix(mobile): remove redundant file properties footer --- apps/client/src/layouts/mobile_layout.tsx | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/apps/client/src/layouts/mobile_layout.tsx b/apps/client/src/layouts/mobile_layout.tsx index 8b162bced3..b56e766ac1 100644 --- a/apps/client/src/layouts/mobile_layout.tsx +++ b/apps/client/src/layouts/mobile_layout.tsx @@ -24,9 +24,7 @@ import NoteWrapperWidget from "../widgets/note_wrapper.js"; import NoteDetail from "../widgets/NoteDetail.jsx"; import QuickSearchWidget from "../widgets/quick_search.js"; import { useNoteContext } from "../widgets/react/hooks.jsx"; -import StandaloneRibbonAdapter from "../widgets/ribbon/components/StandaloneRibbonAdapter.jsx"; import FilePropertiesTab from "../widgets/ribbon/FilePropertiesTab.jsx"; -import SearchDefinitionTab from "../widgets/ribbon/SearchDefinitionTab.jsx"; import SearchResult from "../widgets/search_result.jsx"; import MobileEditorToolbar from "../widgets/type_widgets/text/mobile_editor_toolbar.jsx"; import { applyModals } from "./layout_commons.js"; @@ -78,7 +76,6 @@ export default class MobileLayout { .child() .child() .child() - .child() ) .child() .child(new FindWidget()) @@ -102,13 +99,3 @@ export default class MobileLayout { return rootContainer; } } - -function FilePropertiesWrapper() { - const { note, ntxId } = useNoteContext(); - - return ( -
- {note?.type === "file" && } -
- ); -} From 78f492861109752bb1ff6f9000f76dff37cac5d2 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 14:53:01 +0200 Subject: [PATCH 02/11] feat(mobile): reduce margins for empty tab --- .../client/src/widgets/type_widgets/Empty.css | 30 ++++++++++--------- 1 file changed, 16 insertions(+), 14 deletions(-) diff --git a/apps/client/src/widgets/type_widgets/Empty.css b/apps/client/src/widgets/type_widgets/Empty.css index 9f04afbcf4..40f9f02020 100644 --- a/apps/client/src/widgets/type_widgets/Empty.css +++ b/apps/client/src/widgets/type_widgets/Empty.css @@ -1,18 +1,20 @@ -.note-detail-empty { - container-type: size; - padding-top: 50px; - min-width: 350px; -} +body.desktop { + .note-detail-empty { + container-type: size; + padding-top: 50px; + min-width: 350px; + } -.note-detail-empty > * { - margin-inline: auto; - max-width: 850px; - padding-inline: 50px; -} - -@container (max-width: 600px) { .note-detail-empty > * { - padding-inline: 20px; + margin-inline: auto; + max-width: 850px; + padding-inline: 50px; + } + + @container (max-width: 600px) { + .note-detail-empty > * { + padding-inline: 20px; + } } } @@ -59,4 +61,4 @@ .workspace-icon { text-align: center; font-size: 500%; -} \ No newline at end of file +} From 2e6290c514f5b3d00640fc6a82bb63846d6100e1 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 14:55:01 +0200 Subject: [PATCH 03/11] feat(mobile): improve empty tab workspace switcher --- .../client/src/widgets/type_widgets/Empty.css | 19 +++++++++++++------ 1 file changed, 13 insertions(+), 6 deletions(-) diff --git a/apps/client/src/widgets/type_widgets/Empty.css b/apps/client/src/widgets/type_widgets/Empty.css index 40f9f02020..9385bef72e 100644 --- a/apps/client/src/widgets/type_widgets/Empty.css +++ b/apps/client/src/widgets/type_widgets/Empty.css @@ -26,10 +26,22 @@ body.desktop { } .workspace-notes .workspace-note { - width: 130px; text-align: center; margin: 10px; border: 1px transparent solid; + + .workspace-icon { + text-align: center; + font-size: 250%; + } + + @media (min-width: 992px) { + width: 130px; + + .workspace-icon { + font-size: 500%; + } + } } .workspace-notes .workspace-note:hover { @@ -57,8 +69,3 @@ body.desktop { .empty-tab-search .input-clearer-button { border-bottom-right-radius: 0; } - -.workspace-icon { - text-align: center; - font-size: 500%; -} From a6b7761dfafad81f973c828704a7cc4b8872b881 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 14:58:28 +0200 Subject: [PATCH 04/11] fix(mobile): double-scroll bar for empty tab --- apps/client/src/widgets/type_widgets/Empty.css | 2 -- 1 file changed, 2 deletions(-) diff --git a/apps/client/src/widgets/type_widgets/Empty.css b/apps/client/src/widgets/type_widgets/Empty.css index 9385bef72e..d48ed2b9e1 100644 --- a/apps/client/src/widgets/type_widgets/Empty.css +++ b/apps/client/src/widgets/type_widgets/Empty.css @@ -51,8 +51,6 @@ body.desktop { } .note-detail-empty-results .aa-dropdown-menu { - max-height: 50vh; - overflow: scroll; border: var(--bs-border-width) solid var(--bs-border-color); border-top: 0; } From 13642235995000fd11abb6936850b7103c5f31a7 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 15:00:34 +0200 Subject: [PATCH 05/11] fix(mobile): horizontall scroll in empty tab due to long attributes --- apps/client/src/stylesheets/style.css | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css index 0fc2a962e1..c3e2810fc8 100644 --- a/apps/client/src/stylesheets/style.css +++ b/apps/client/src/stylesheets/style.css @@ -942,6 +942,7 @@ table.promoted-attributes-in-tooltip th { color: var(--muted-text-color); opacity: 0.6; line-height: 1; + word-wrap: break-word; } .aa-dropdown-menu .aa-suggestion p { From 297dd41170cea78bb12978e7f3fdfe5858c83974 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 15:12:12 +0200 Subject: [PATCH 06/11] fix(mobile): incorrect tab hue on light theme --- apps/client/src/stylesheets/theme-next-dark.css | 11 +++++++++++ apps/client/src/stylesheets/theme-next-light.css | 10 ++++++++++ .../client/src/widgets/mobile_widgets/TabSwitcher.css | 5 ----- 3 files changed, 21 insertions(+), 5 deletions(-) diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css index cf88b7f2d2..99056aa2b6 100644 --- a/apps/client/src/stylesheets/theme-next-dark.css +++ b/apps/client/src/stylesheets/theme-next-dark.css @@ -338,6 +338,17 @@ body .todo-list input[type="checkbox"]:not(:checked):before { --promoted-attribute-card-background-color: hsl(var(--custom-color-hue), 13.2%, 20.8%); } +.modal.tab-bar-modal .tabs .tab-card.with-hue { + background-color: hsl(var(--bg-hue), 8.8%, 11.2%); + border-color: hsl(var(--bg-hue), 9.4%, 25.1%); +} + +.modal.tab-bar-modal .tabs .tab-card.active.with-hue { + background-color: hsl(var(--bg-hue), 8.8%, 11.2%); + border-color: hsl(var(--bg-hue), 9.4%, 25.1%); +} + + .use-note-color { --custom-color: var(--dark-theme-custom-color); } diff --git a/apps/client/src/stylesheets/theme-next-light.css b/apps/client/src/stylesheets/theme-next-light.css index 00678c6ae9..ac50453d09 100644 --- a/apps/client/src/stylesheets/theme-next-light.css +++ b/apps/client/src/stylesheets/theme-next-light.css @@ -313,6 +313,16 @@ --promoted-attribute-card-background-color: hsl(var(--custom-color-hue), 40%, 88%); } +.modal.tab-bar-modal .tabs .tab-card.with-hue { + background-color: hsl(var(--bg-hue), 56%, 96%); + border-color: hsl(var(--bg-hue), 33%, 41%); +} + +.modal.tab-bar-modal .tabs .tab-card.active.with-hue { + background-color: hsl(var(--bg-hue), 86%, 96%); + border-color: hsl(var(--bg-hue), 33%, 41%); +} + .note-split.with-hue, .quick-edit-dialog-wrapper.with-hue { --note-icon-custom-background-color: hsl(var(--custom-color-hue), 44.5%, 43.1%); diff --git a/apps/client/src/widgets/mobile_widgets/TabSwitcher.css b/apps/client/src/widgets/mobile_widgets/TabSwitcher.css index 8be65240b2..58b6c1fbc3 100644 --- a/apps/client/src/widgets/mobile_widgets/TabSwitcher.css +++ b/apps/client/src/widgets/mobile_widgets/TabSwitcher.css @@ -35,11 +35,6 @@ display: flex; flex-direction: column; - &.with-hue { - background-color: hsl(var(--bg-hue), 8.8%, 11.2%); - border-color: hsl(var(--bg-hue), 9.4%, 25.1%); - } - &.active { outline: 4px solid var(--more-accented-background-color); background: var(--card-background-hover-color); From 10b5d29107c964bcacd470532178ad03b5349d5c Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 15:16:23 +0200 Subject: [PATCH 07/11] fix(mobile): promoted attributes having a max-height --- apps/client/src/widgets/PromotedAttributes.css | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/apps/client/src/widgets/PromotedAttributes.css b/apps/client/src/widgets/PromotedAttributes.css index 6e3c7795d1..ef15905192 100644 --- a/apps/client/src/widgets/PromotedAttributes.css +++ b/apps/client/src/widgets/PromotedAttributes.css @@ -16,6 +16,10 @@ body.mobile .promoted-attributes-widget { display: table; } +body.experimental-feature-new-layout .promoted-attributes-container { + max-height: unset; +} + .promoted-attribute-cell { display: flex; align-items: center; @@ -94,4 +98,4 @@ body.mobile .promoted-attributes-widget { background: rgba(0, 0, 0, 0.5); transform: rotate(45deg); pointer-events: none; -} \ No newline at end of file +} From 67acfaab62b0c4094c18ecccd12ccf472d031b50 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 15:17:08 +0200 Subject: [PATCH 08/11] fix(mobile): missing scroll padding --- apps/client/src/layouts/mobile_layout.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/apps/client/src/layouts/mobile_layout.tsx b/apps/client/src/layouts/mobile_layout.tsx index b56e766ac1..e194bb7271 100644 --- a/apps/client/src/layouts/mobile_layout.tsx +++ b/apps/client/src/layouts/mobile_layout.tsx @@ -25,6 +25,7 @@ import NoteDetail from "../widgets/NoteDetail.jsx"; import QuickSearchWidget from "../widgets/quick_search.js"; import { useNoteContext } from "../widgets/react/hooks.jsx"; import FilePropertiesTab from "../widgets/ribbon/FilePropertiesTab.jsx"; +import ScrollPadding from "../widgets/scroll_padding"; import SearchResult from "../widgets/search_result.jsx"; import MobileEditorToolbar from "../widgets/type_widgets/text/mobile_editor_toolbar.jsx"; import { applyModals } from "./layout_commons.js"; @@ -76,6 +77,7 @@ export default class MobileLayout { .child() .child() .child() + .child() ) .child() .child(new FindWidget()) From e0766ad439e9fd129e1d0b06a46101363f4d66f1 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 15:25:28 +0200 Subject: [PATCH 09/11] feat(mobile): display grid view on two columns --- apps/client/src/widgets/collections/legacy/ListOrGridView.css | 4 ++++ apps/client/src/widgets/containers/scrolling_container.css | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/apps/client/src/widgets/collections/legacy/ListOrGridView.css b/apps/client/src/widgets/collections/legacy/ListOrGridView.css index 1bfa389e5c..722e747ef0 100644 --- a/apps/client/src/widgets/collections/legacy/ListOrGridView.css +++ b/apps/client/src/widgets/collections/legacy/ListOrGridView.css @@ -128,6 +128,10 @@ border: 1px solid transparent; } +body.mobile .note-list.grid-view .note-book-card { + flex-basis: 150px; +} + .note-list.grid-view .note-book-card { max-height: 300px; } diff --git a/apps/client/src/widgets/containers/scrolling_container.css b/apps/client/src/widgets/containers/scrolling_container.css index 0e590801c4..a3fae557a3 100644 --- a/apps/client/src/widgets/containers/scrolling_container.css +++ b/apps/client/src/widgets/containers/scrolling_container.css @@ -19,6 +19,10 @@ } } +body.mobile .scrolling-container { + --content-margin-inline: 8px; +} + .note-split.type-code:not(.mime-text-x-sqlite) { &> .scrolling-container { background-color: var(--code-background-color); From 9ed2894a0c3d83d2dff29485d45d5aff01677d3b Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 15:29:27 +0200 Subject: [PATCH 10/11] fix(mobile): badges not collapsing in quick edit --- apps/client/src/widgets/dialogs/PopupEditor.css | 6 ++++++ apps/client/src/widgets/dialogs/PopupEditor.tsx | 6 ++---- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/apps/client/src/widgets/dialogs/PopupEditor.css b/apps/client/src/widgets/dialogs/PopupEditor.css index 3357b00f3e..84f4c93197 100644 --- a/apps/client/src/widgets/dialogs/PopupEditor.css +++ b/apps/client/src/widgets/dialogs/PopupEditor.css @@ -32,6 +32,12 @@ body.mobile .modal.popup-editor-dialog .modal-dialog { display: flex; align-items: center; margin-block: 0; + + .note-icon-widget { + display: flex; + align-items: center; + margin-inline-start: 0; + } } .modal.popup-editor-dialog .modal-header .note-title-widget { diff --git a/apps/client/src/widgets/dialogs/PopupEditor.tsx b/apps/client/src/widgets/dialogs/PopupEditor.tsx index a7f3fde393..07363b2e91 100644 --- a/apps/client/src/widgets/dialogs/PopupEditor.tsx +++ b/apps/client/src/widgets/dialogs/PopupEditor.tsx @@ -67,10 +67,7 @@ export default function PopupEditor() { - - {isNewLayout && } - } + title={} customTitleBarButtons={[{ iconClassName: "bx-expand-alt", title: t("popup-editor.maximize"), @@ -123,6 +120,7 @@ export function TitleRow() {
+ {isNewLayout && }
); } From 5a77318a9ed0fc3cc781fb75aa773f063983ae40 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 15 Feb 2026 15:33:03 +0200 Subject: [PATCH 11/11] chore(mobile): address requested changes --- apps/client/src/stylesheets/theme-next-dark.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css index 99056aa2b6..6a089f0ed3 100644 --- a/apps/client/src/stylesheets/theme-next-dark.css +++ b/apps/client/src/stylesheets/theme-next-dark.css @@ -344,7 +344,7 @@ body .todo-list input[type="checkbox"]:not(:checked):before { } .modal.tab-bar-modal .tabs .tab-card.active.with-hue { - background-color: hsl(var(--bg-hue), 8.8%, 11.2%); + background-color: hsl(var(--bg-hue), 8.8%, 16.2%); border-color: hsl(var(--bg-hue), 9.4%, 25.1%); }