From d1f6a9de7f1aa51601b2ca9b8429bb30e360e942 Mon Sep 17 00:00:00 2001 From: Alexander Platov Date: Tue, 18 Jun 2024 08:14:20 +0300 Subject: [PATCH] Fixed Navigator visibility (#5842) * Fixed Navigator visibility Signed-off-by: Alexander Platov * Clean Workbench Signed-off-by: Alexander Platov --------- Signed-off-by: Alexander Platov --- packages/theme/styles/common.scss | 7 +- packages/ui/src/components/Header.svelte | 14 +- packages/ui/src/index.ts | 1 + packages/ui/src/types.ts | 1 + .../src/components/chat/Chat.svelte | 20 +-- .../src/components/Guest.svelte | 14 +- .../src/components/Schedule.svelte | 13 +- .../src/components/Floor.svelte | 3 +- .../src/components/FloorConfigure.svelte | 3 +- .../src/components/Floors.svelte | 21 +-- .../love-resources/src/components/Hall.svelte | 23 +--- .../love-resources/src/components/Main.svelte | 17 ++- .../src/components/Settings.svelte | 7 +- .../components/NotificationSettings.svelte | 8 +- .../src/components/inbox/Inbox.svelte | 15 +- .../src/components/ClassSetting.svelte | 5 +- .../src/components/Configure.svelte | 7 +- .../src/components/EnumSetting.svelte | 7 +- .../src/components/Integrations.svelte | 7 +- .../src/components/InviteSetting.svelte | 7 +- .../src/components/Owners.svelte | 6 +- .../src/components/Password.svelte | 7 +- .../src/components/Profile.svelte | 8 +- .../src/components/Settings.svelte | 38 ++--- .../src/components/Spaces.svelte | 8 +- .../src/components/WorkspaceSetting.svelte | 4 - .../src/components/WorkspaceSettings.svelte | 3 +- .../spaceTypes/ManageSpaceTypeContent.svelte | 7 +- .../src/components/Templates.svelte | 7 +- .../time-resources/src/components/Me.svelte | 6 +- .../src/components/PlanView.svelte | 22 +-- .../src/components/ToDos.svelte | 18 ++- .../src/components/ToDosNavigator.svelte | 11 +- .../src/components/team/Team.svelte | 11 +- .../components/SettingsRelatedTargets.svelte | 6 +- .../src/components/Settings.svelte | 6 +- .../src/components/Workbench.svelte | 130 ++++++++---------- 37 files changed, 197 insertions(+), 301 deletions(-) diff --git a/packages/theme/styles/common.scss b/packages/theme/styles/common.scss index abc02541ee..739840fe65 100644 --- a/packages/theme/styles/common.scss +++ b/packages/theme/styles/common.scss @@ -137,8 +137,8 @@ @media (max-width: 1024px) { .antiPanel-navigator { position: fixed; - top: var(--status-bar-height); - height: calc(100% - var(--status-bar-height)); + top: calc(var(--status-bar-height) + 1px); + height: calc(100% - var(--status-bar-height) - 1px); background-color: var(--theme-navpanel-color); filter: drop-shadow(2px 0 1px rgba(0, 0, 0, .2)); z-index: 450; @@ -147,7 +147,8 @@ left: 0; } &.landscape { - left: var(--app-panel-width); + .modern-app & { left: var(--app-panel-width); } + :not(.modern-app) & { left: calc(var(--app-panel-width) + 1px); } } } } diff --git a/packages/ui/src/components/Header.svelte b/packages/ui/src/components/Header.svelte index dd3934b714..1672c0bd66 100644 --- a/packages/ui/src/components/Header.svelte +++ b/packages/ui/src/components/Header.svelte @@ -14,10 +14,9 @@ -->
- {#if visibleNav} -
+ {#if $deviceInfo.navigator.visible} +
- +
- + {/if}
@@ -150,10 +147,7 @@ is={currentSpecial.component} props={{ model: navigatorModel, - ...currentSpecial.componentProps, - visibleNav, - navFloat, - appsDirection + ...currentSpecial.componentProps }} on:action={(e) => { if (e?.detail) { diff --git a/plugins/guest-resources/src/components/Guest.svelte b/plugins/guest-resources/src/components/Guest.svelte index da089071f6..37d2346747 100644 --- a/plugins/guest-resources/src/components/Guest.svelte +++ b/plugins/guest-resources/src/components/Guest.svelte @@ -35,7 +35,8 @@ navigate, openPanel, defineSeparators, - setResolvedLocation + setResolvedLocation, + deviceOptionsStore as deviceInfo } from '@hcengineering/ui' import view from '@hcengineering/view' import { ListSelectionProvider, restrictionStore, updateFocus } from '@hcengineering/view-resources' @@ -46,6 +47,7 @@ import { workbenchGuestSeparators } from '..' const excludedApps = getMetadata(workbench.metadata.ExcludedApplications) ?? [] + $deviceInfo.navigator.visible = false const client = getClient() @@ -277,22 +279,18 @@
{#if currentApplication && currentApplication.component} - + {:else if specialComponent} {:else if currentView?.component !== undefined} - + {:else} {/if} diff --git a/plugins/hr-resources/src/components/Schedule.svelte b/plugins/hr-resources/src/components/Schedule.svelte index 0022fc9e4a..bfc32ef079 100644 --- a/plugins/hr-resources/src/components/Schedule.svelte +++ b/plugins/hr-resources/src/components/Schedule.svelte @@ -30,7 +30,8 @@ Separator, TabList, defineSeparators, - workbenchSeparators + workbenchSeparators, + deviceOptionsStore as deviceInfo } from '@hcengineering/ui' import view from '@hcengineering/view' @@ -39,10 +40,6 @@ import ScheduleView from './ScheduleView.svelte' import Sidebar from './sidebar/Sidebar.svelte' - export let visibleNav: boolean = true - export let navFloat: boolean = false - export let appsDirection: 'vertical' | 'horizontal' = 'horizontal' - const accountEmployee = $employeeByIdStore.get((getCurrentAccount() as PersonAccount).person as Ref) let accountStaff: Staff | undefined @@ -129,20 +126,18 @@
- {#if visibleNav} + {#if $deviceInfo.navigator.visible} { departmentSelected(e.detail) }} /> - export let visibleNav: boolean const dispatch = createEventDispatcher() @@ -45,7 +44,7 @@
-
dispatch('change', event.detail)}> +
{#if editable} diff --git a/plugins/love-resources/src/components/FloorConfigure.svelte b/plugins/love-resources/src/components/FloorConfigure.svelte index 8c37d95a65..e98577318c 100644 --- a/plugins/love-resources/src/components/FloorConfigure.svelte +++ b/plugins/love-resources/src/components/FloorConfigure.svelte @@ -38,7 +38,6 @@ export let rooms: Room[] = [] export let floor: Ref - export let visibleNav: boolean export let excludedPersons: Ref[] = [] const client = getClient() @@ -291,7 +290,7 @@
-
dispatch('change', event.detail)}> +
diff --git a/plugins/love-resources/src/components/Floors.svelte b/plugins/love-resources/src/components/Floors.svelte index 5d7285bb66..87639b53f3 100644 --- a/plugins/love-resources/src/components/Floors.svelte +++ b/plugins/love-resources/src/components/Floors.svelte @@ -22,7 +22,8 @@ Separator, defineSeparators, eventToHTMLElement, - showPopup + showPopup, + deviceOptionsStore as deviceInfo } from '@hcengineering/ui' import { Floor as FloorType, Room } from '@hcengineering/love' import love from '../plugin' @@ -31,9 +32,6 @@ import EditFloorPopup from './EditFloorPopup.svelte' import FloorPreview from './FloorPreview.svelte' - export let visibleNav: boolean - export let navFloat: boolean = false - export let appsDirection: 'vertical' | 'horizontal' = 'horizontal' export let floor: Ref export let configure: boolean @@ -53,9 +51,9 @@ defineSeparators('love', loveSeparators) -{#if visibleNav} +{#if $deviceInfo.navigator.visible}
@@ -93,7 +91,14 @@ {/each}
- +
- + {/if} diff --git a/plugins/love-resources/src/components/Hall.svelte b/plugins/love-resources/src/components/Hall.svelte index ef2b46202b..516b61c6dc 100644 --- a/plugins/love-resources/src/components/Hall.svelte +++ b/plugins/love-resources/src/components/Hall.svelte @@ -14,6 +14,7 @@ --> - -
+ +
{#if configure} (visibleNav = event.detail)} on:configure={() => (configure = false)} /> {:else} - (visibleNav = event.detail)} - on:configure={() => (configure = true)} - /> + (configure = true)} /> {/if}
diff --git a/plugins/love-resources/src/components/Main.svelte b/plugins/love-resources/src/components/Main.svelte index 5344cb23f6..eb242e22c9 100644 --- a/plugins/love-resources/src/components/Main.svelte +++ b/plugins/love-resources/src/components/Main.svelte @@ -14,24 +14,27 @@ -->
{#if ($currentRoom !== undefined && $screenSharing) || $currentRoom?.type === RoomType.Video} {:else} - + {/if}
diff --git a/plugins/love-resources/src/components/Settings.svelte b/plugins/love-resources/src/components/Settings.svelte index c16883e0cc..04fbd1dbda 100644 --- a/plugins/love-resources/src/components/Settings.svelte +++ b/plugins/love-resources/src/components/Settings.svelte @@ -5,14 +5,9 @@ import { DevicesPreference } from '@hcengineering/love' import love from '../plugin' import { myPreferences } from '../stores' - import { createEventDispatcher } from 'svelte' import { krispProcessor } from '../utils' import { isKrispNoiseFilterSupported } from '@livekit/krisp-noise-filter' - export let visibleNav: boolean = true - - const dispatch = createEventDispatcher() - const client = getClient() async function saveMicPreference (myPreferences: DevicesPreference | undefined, value: boolean): Promise { @@ -66,7 +61,7 @@
-
dispatch('change', event.detail)}> +
diff --git a/plugins/notification-resources/src/components/NotificationSettings.svelte b/plugins/notification-resources/src/components/NotificationSettings.svelte index 78a2b824e1..ab764558cf 100644 --- a/plugins/notification-resources/src/components/NotificationSettings.svelte +++ b/plugins/notification-resources/src/components/NotificationSettings.svelte @@ -13,7 +13,7 @@ // limitations under the License. -->
-
dispatch('change', event.detail)}> +
- {#if visibleNav} + {#if $deviceInfo.navigator.visible}
@@ -437,9 +434,9 @@ />
- +
- + {/if}
{#if selectedContext && selectedComponent} diff --git a/plugins/setting-resources/src/components/ClassSetting.svelte b/plugins/setting-resources/src/components/ClassSetting.svelte index 581167eccd..8d5644a1af 100644 --- a/plugins/setting-resources/src/components/ClassSetting.svelte +++ b/plugins/setting-resources/src/components/ClassSetting.svelte @@ -13,7 +13,6 @@ // limitations under the License. -->
-
dispatch('change', event.detail)}> +
diff --git a/plugins/setting-resources/src/components/EnumSetting.svelte b/plugins/setting-resources/src/components/EnumSetting.svelte index 7d5e5355f3..db1e9e7f58 100644 --- a/plugins/setting-resources/src/components/EnumSetting.svelte +++ b/plugins/setting-resources/src/components/EnumSetting.svelte @@ -31,14 +31,9 @@ showPopup } from '@hcengineering/ui' import { showMenu } from '@hcengineering/view-resources' - import { createEventDispatcher } from 'svelte' import setting from '../plugin' import EnumValues from './EnumValues.svelte' - export let visibleNav: boolean = true - - const dispatch = createEventDispatcher() - const query = createQuery() let enums: Enum[] = [] @@ -60,7 +55,7 @@
-
dispatch('change', event.detail)}> +
-
dispatch('change', event.detail)}> +
diff --git a/plugins/setting-resources/src/components/InviteSetting.svelte b/plugins/setting-resources/src/components/InviteSetting.svelte index 2674f4e842..c13cef5293 100644 --- a/plugins/setting-resources/src/components/InviteSetting.svelte +++ b/plugins/setting-resources/src/components/InviteSetting.svelte @@ -13,16 +13,11 @@ // limitations under the License. -->
-
dispatch('change', event.detail)}> +
diff --git a/plugins/setting-resources/src/components/Owners.svelte b/plugins/setting-resources/src/components/Owners.svelte index f3fe52a839..a549801de2 100644 --- a/plugins/setting-resources/src/components/Owners.svelte +++ b/plugins/setting-resources/src/components/Owners.svelte @@ -18,12 +18,8 @@ import { AccountRole, getCurrentAccount, hasAccountRole } from '@hcengineering/core' import presentation, { createQuery, getClient } from '@hcengineering/presentation' import { Breadcrumb, DropdownIntlItem, DropdownLabelsIntl, EditBox, Header, Scroller } from '@hcengineering/ui' - import { createEventDispatcher } from 'svelte' import setting from '../plugin' - export let visibleNav: boolean = true - - const dispatch = createEventDispatcher() const client = getClient() const query = createQuery() const currentAccount = getCurrentAccount() @@ -50,7 +46,7 @@
-
dispatch('change', event.detail)}> +
diff --git a/plugins/setting-resources/src/components/Password.svelte b/plugins/setting-resources/src/components/Password.svelte index f8e3291ab3..22f6c21eaf 100644 --- a/plugins/setting-resources/src/components/Password.svelte +++ b/plugins/setting-resources/src/components/Password.svelte @@ -19,14 +19,9 @@ import presentation from '@hcengineering/presentation' import setting from '@hcengineering/setting' import { Breadcrumb, Button, EditBox, Header, Icon, Label } from '@hcengineering/ui' - import { createEventDispatcher } from 'svelte' import plugin from '../plugin' import Error from './icons/Error.svelte' - export let visibleNav: boolean = true - - const dispatch = createEventDispatcher() - let oldPassword: string = '' let password: string = '' let password2: string = '' @@ -62,7 +57,7 @@
-
dispatch('change', event.detail)}> +
diff --git a/plugins/setting-resources/src/components/Profile.svelte b/plugins/setting-resources/src/components/Profile.svelte index c792bf4792..758d71c594 100644 --- a/plugins/setting-resources/src/components/Profile.svelte +++ b/plugins/setting-resources/src/components/Profile.svelte @@ -20,13 +20,9 @@ import { getResource } from '@hcengineering/platform' import { AttributeEditor, MessageBox, getClient } from '@hcengineering/presentation' import { Breadcrumb, Button, EditBox, FocusHandler, Header, createFocusManager, showPopup } from '@hcengineering/ui' - import { createEventDispatcher, onDestroy } from 'svelte' + import { onDestroy } from 'svelte' import setting from '../plugin' - export let visibleNav: boolean = true - - const dispatch = createEventDispatcher() - const client = getClient() let avatarEditor: EditableAvatar @@ -87,7 +83,7 @@
-
dispatch('change', event.detail)}> +
diff --git a/plugins/setting-resources/src/components/Settings.svelte b/plugins/setting-resources/src/components/Settings.svelte index f99b5d6d26..77bc4123b8 100644 --- a/plugins/setting-resources/src/components/Settings.svelte +++ b/plugins/setting-resources/src/components/Settings.svelte @@ -34,16 +34,13 @@ setMetadataLocalStorage, settingsSeparators, showPopup, - type AnyComponent + type AnyComponent, + deviceOptionsStore as deviceInfo } from '@hcengineering/ui' import { NavFooter } from '@hcengineering/workbench-resources' import { ComponentType, onDestroy } from 'svelte' import { clearSettingsStore, settingsStore, type SettingsStore } from '../store' - export let visibleNav: boolean = true - export let navFloat: boolean = false - export let appsDirection: 'vertical' | 'horizontal' = 'horizontal' - let category: SettingsCategory | undefined let categoryId: string = '' @@ -121,9 +118,11 @@
- {#if visibleNav} + {#if $deviceInfo.navigator.visible}
@@ -178,21 +177,26 @@
- +
- + {/if}
{#if category} - (visibleNav = event.detail)} - /> + {/if}
{#if asideComponent != null} diff --git a/plugins/setting-resources/src/components/Spaces.svelte b/plugins/setting-resources/src/components/Spaces.svelte index cd7a7524e4..4ced7f5239 100644 --- a/plugins/setting-resources/src/components/Spaces.svelte +++ b/plugins/setting-resources/src/components/Spaces.svelte @@ -13,19 +13,15 @@ // limitations under the License. -->
-
dispatch('change', event.detail)}> +
diff --git a/plugins/setting-resources/src/components/WorkspaceSetting.svelte b/plugins/setting-resources/src/components/WorkspaceSetting.svelte index b780240065..0bf04a6a60 100644 --- a/plugins/setting-resources/src/components/WorkspaceSetting.svelte +++ b/plugins/setting-resources/src/components/WorkspaceSetting.svelte @@ -19,12 +19,8 @@ import { getClient } from '@hcengineering/presentation' import { WorkspaceSetting } from '@hcengineering/setting' import { FocusHandler, Label, createFocusManager } from '@hcengineering/ui' - import { createEventDispatcher } from 'svelte' import setting from '../plugin' - export let visibleNav: boolean = true - - const dispatch = createEventDispatcher() let workspaceSettings: WorkspaceSetting | undefined = undefined const client = getClient() diff --git a/plugins/setting-resources/src/components/WorkspaceSettings.svelte b/plugins/setting-resources/src/components/WorkspaceSettings.svelte index 96419ec048..95b75cca6a 100644 --- a/plugins/setting-resources/src/components/WorkspaceSettings.svelte +++ b/plugins/setting-resources/src/components/WorkspaceSettings.svelte @@ -30,7 +30,6 @@ export let kind: 'navigation' | 'content' | undefined export let categoryName: string - export let visibleNav: boolean = true let category: SettingsCategory | undefined let categoryId: string = '' @@ -98,5 +97,5 @@ {:else if kind === 'content' && !category}
{:else if category} - + {/if} diff --git a/plugins/setting-resources/src/components/spaceTypes/ManageSpaceTypeContent.svelte b/plugins/setting-resources/src/components/spaceTypes/ManageSpaceTypeContent.svelte index 27217f0dcc..4713fb0238 100644 --- a/plugins/setting-resources/src/components/spaceTypes/ManageSpaceTypeContent.svelte +++ b/plugins/setting-resources/src/components/spaceTypes/ManageSpaceTypeContent.svelte @@ -14,7 +14,7 @@ // limitations under the License. -->
-
dispatch('change', event.detail)}> +
import PlanView from './PlanView.svelte' - - export let visibleNav: boolean = true - export let navFloat: boolean = false - export let appsDirection: 'vertical' | 'horizontal' = 'horizontal'
- +
diff --git a/plugins/time-resources/src/components/PlanView.svelte b/plugins/time-resources/src/components/PlanView.svelte index 8edc62242e..c81a7874d7 100644 --- a/plugins/time-resources/src/components/PlanView.svelte +++ b/plugins/time-resources/src/components/PlanView.svelte @@ -29,10 +29,6 @@ import { dragging } from '../dragging' import time from '../plugin' - export let visibleNav: boolean = true - export let navFloat: boolean = false - export let appsDirection: 'vertical' | 'horizontal' = 'horizontal' - const dispatch = createEventDispatcher() const defaultDuration = 30 * 60 * 1000 @@ -84,28 +80,22 @@ }) -{#if visibleNav} - +{#if $deviceInfo.navigator.visible} + {/if} -
- +
+
{#if visibleCalendar}
- (visibleNav = event.detail)} - /> +
{/if} diff --git a/plugins/time-resources/src/components/ToDos.svelte b/plugins/time-resources/src/components/ToDos.svelte index f37535dbf0..66e61c7758 100644 --- a/plugins/time-resources/src/components/ToDos.svelte +++ b/plugins/time-resources/src/components/ToDos.svelte @@ -21,7 +21,16 @@ import type { TagElement } from '@hcengineering/tags' import type { Project } from '@hcengineering/tracker' import type { ToDosMode } from '..' - import { Scroller, areDatesEqual, todosSP, defaultSP, Header, ButtonIcon, Label } from '@hcengineering/ui' + import { + Scroller, + areDatesEqual, + todosSP, + defaultSP, + Header, + ButtonIcon, + Label, + deviceOptionsStore as deviceInfo + } from '@hcengineering/ui' import { getCurrentAccount, toIdMap, SortingOrder } from '@hcengineering/core' import { createQuery } from '@hcengineering/presentation' import tracker from '@hcengineering/tracker' @@ -38,7 +47,6 @@ export let mode: ToDosMode export let tag: Ref | undefined export let currentDate: Date - export let visibleNav: boolean = true const acc = getCurrentAccount() as PersonAccount const user = acc.person @@ -59,7 +67,7 @@ $: updateTags(mode, tag) function togglePlannerNav (): void { - visibleNav = !visibleNav + $deviceInfo.navigator.visible = !$deviceInfo.navigator.visible } function updateTags (mode: ToDosMode, tag: Ref | undefined): void { @@ -279,10 +287,10 @@
diff --git a/plugins/time-resources/src/components/ToDosNavigator.svelte b/plugins/time-resources/src/components/ToDosNavigator.svelte index 17b973daad..be7702cb30 100644 --- a/plugins/time-resources/src/components/ToDosNavigator.svelte +++ b/plugins/time-resources/src/components/ToDosNavigator.svelte @@ -13,15 +13,14 @@ Scroller, Month, getPlatformColorDef, - themeStore + themeStore, + deviceOptionsStore as deviceInfo } from '@hcengineering/ui' import { ToDosMode } from '..' import time from '../plugin' export let mode: ToDosMode export let tag: Ref | undefined - export let navFloat: boolean = false - export let appsDirection: 'vertical' | 'horizontal' = 'horizontal' export let currentDate: Date const acc = getCurrentAccount() as PersonAccount @@ -104,7 +103,9 @@ const today: Date = new Date() -
+
| undefined = undefined @@ -45,11 +42,11 @@
- {#if visibleNav} - + {#if $deviceInfo.navigator.visible} + - import { createEventDispatcher } from 'svelte' import { Space } from '@hcengineering/core' import { Header, Breadcrumb } from '@hcengineering/ui' import tracker from '../plugin' import EditRelatedTargets from './EditRelatedTargets.svelte' export let value: Space | undefined - export let visibleNav: boolean = true - - const dispatch = createEventDispatcher()
-
dispatch('change', event.detail)}> +
diff --git a/plugins/training-resources/src/components/Settings.svelte b/plugins/training-resources/src/components/Settings.svelte index 0654ce6667..5161849c18 100644 --- a/plugins/training-resources/src/components/Settings.svelte +++ b/plugins/training-resources/src/components/Settings.svelte @@ -16,7 +16,6 @@ -->
-
dispatch('change', event.detail)}> +
diff --git a/plugins/workbench-resources/src/components/Workbench.svelte b/plugins/workbench-resources/src/components/Workbench.svelte index 52aed2c9ad..f575e301a0 100644 --- a/plugins/workbench-resources/src/components/Workbench.svelte +++ b/plugins/workbench-resources/src/components/Workbench.svelte @@ -117,9 +117,9 @@ let panelInstance: PanelInstance let popupInstance: Popup - let visibleNav: boolean = getMetadata(workbench.metadata.NavigationExpandedDefault) ?? true + $deviceInfo.navigator.visible = getMetadata(workbench.metadata.NavigationExpandedDefault) ?? true async function toggleNav (): Promise { - visibleNav = !visibleNav + $deviceInfo.navigator.visible = !$deviceInfo.navigator.visible closeTooltip() if (currentApplication && navigatorModel && navigator) { await tick() @@ -499,21 +499,20 @@ let aside: HTMLElement let cover: HTMLElement - let navFloat: boolean = !($deviceInfo.docWidth < 1024) - $: if ($deviceInfo.docWidth <= 1024 && !navFloat) { - visibleNav = false - navFloat = true - } else if ($deviceInfo.docWidth > 1024 && navFloat) { + $deviceInfo.navigator.float = !($deviceInfo.docWidth < 1024) + $: if ($deviceInfo.docWidth <= 1024 && !$deviceInfo.navigator.float) { + $deviceInfo.navigator.visible = false + $deviceInfo.navigator.float = true + } else if ($deviceInfo.docWidth > 1024 && $deviceInfo.navigator.float) { if (getMetadata(workbench.metadata.NavigationExpandedDefault) === undefined) { - navFloat = false - visibleNav = true + $deviceInfo.navigator.float = false + $deviceInfo.navigator.visible = true } } const checkOnHide = (): void => { - if (visibleNav && $deviceInfo.docWidth <= 1024) visibleNav = false + if ($deviceInfo.navigator.visible && $deviceInfo.docWidth <= 1024) $deviceInfo.navigator.visible = false } - let appsDirection: 'vertical' | 'horizontal' - $: appsDirection = $deviceInfo.isMobile && $deviceInfo.isPortrait ? 'horizontal' : 'vertical' + $: $deviceInfo.navigator.direction = $deviceInfo.isMobile && $deviceInfo.isPortrait ? 'horizontal' : 'vertical' let appsMini: boolean $: appsMini = $deviceInfo.isMobile && @@ -521,13 +520,17 @@ (!$deviceInfo.isPortrait && $deviceInfo.docHeight <= 480)) let popupPosition: PopupPosAlignment $: popupPosition = - appsDirection === 'horizontal' + $deviceInfo.navigator.direction === 'horizontal' ? 'account-portrait' - : appsDirection === 'vertical' && $deviceInfo.isMobile + : $deviceInfo.navigator.direction === 'vertical' && $deviceInfo.isMobile ? 'account-mobile' : 'account' let popupSpacePosition: PopupPosAlignment - $: popupSpacePosition = appsMini ? 'logo-mini' : appsDirection === 'horizontal' ? 'logo-portrait' : 'logo' + $: popupSpacePosition = appsMini + ? 'logo-mini' + : $deviceInfo.navigator.direction === 'horizontal' + ? 'logo-portrait' + : 'logo' onMount(() => { subscribeMobile(setTheme) @@ -627,13 +630,16 @@
-
+
@@ -649,8 +655,8 @@
@@ -675,9 +681,13 @@ notify={hasInboxNotifications} /> - +
-
+
{/if} {/await} --> -
+
- {#if currentApplication && navigatorModel && navigator && visibleNav} + {#if currentApplication && navigatorModel && navigator && $deviceInfo.navigator.visible} - {#if navFloat}
(visibleNav = false)} />{/if} -
+ {#if $deviceInfo.navigator.float} +
($deviceInfo.navigator.visible = false)} /> + {/if} +
{#if currentApplication} @@ -768,27 +788,25 @@
- + {/if}
{#if currentApplication && currentApplication.component} - + {:else if specialComponent} { if (e?.detail) { const loc = getCurrentLocation() @@ -798,10 +816,7 @@ }} /> {:else if currentView?.component !== undefined} - + {:else if $accessDeniedStore}

@@ -969,37 +984,6 @@ display: block; } } - .splitter { - position: relative; - width: 1px; - min-width: 1px; - max-width: 1px; - height: 100%; - background-color: var(--theme-divider-color); - transition: background-color 0.15s ease-in-out; - - &::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 0.5rem; - height: 100%; - border-left: 2px solid transparent; - cursor: col-resize; - z-index: 1; - transition: border-color 0.15s ease-in-out; - } - &:hover, - &.hovered { - transition-duration: 0; - background-color: var(--primary-bg-color); - &::before { - transition-duration: 0; - border-left: 2px solid var(--primary-bg-color); - } - } - } @media print { .workbench-container:has(~ .panel-instance) {