mirror of
https://github.com/hcengineering/platform.git
synced 2024-11-22 03:14:40 +03:00
Updated LoveWidget layout (#7103)
This commit is contained in:
parent
3ea2659d9e
commit
585b3f40e7
@ -461,9 +461,9 @@
|
||||
}
|
||||
.hulyModal-container {
|
||||
height: 100%;
|
||||
border-top: 1px solid transparent;
|
||||
visibility: visible;
|
||||
|
||||
|
||||
&:not(.noTopIndent) { border-top: 1px solid transparent; }
|
||||
&.hidden {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
@ -220,6 +220,7 @@
|
||||
height: 100%;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
border-right: 1px solid var(--theme-divider-color);
|
||||
border-radius: 0 var(--small-focus-BorderRadius) var(--small-focus-BorderRadius) 0;
|
||||
}
|
||||
|
||||
|
@ -15,9 +15,7 @@
|
||||
<script lang="ts">
|
||||
import { Floor, Room } from '@hcengineering/love'
|
||||
import { Ref } from '@hcengineering/core'
|
||||
import { getEmbeddedLabel } from '@hcengineering/platform'
|
||||
import ui, { Button, IconChevronLeft, ModernButton, Scroller } from '@hcengineering/ui'
|
||||
|
||||
import ui, { IconChevronLeft, ModernButton, Scroller } from '@hcengineering/ui'
|
||||
import FloorPreview from './FloorPreview.svelte'
|
||||
import { floors, rooms } from '../stores'
|
||||
import IconLayers from './icons/Layers.svelte'
|
||||
@ -44,26 +42,24 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="root">
|
||||
{#if floorsSelector}
|
||||
{#each $floors as floor, i}
|
||||
<Button
|
||||
kind={'ghost'}
|
||||
size={'large'}
|
||||
on:click={() => {
|
||||
selectFloor(floor._id)
|
||||
}}
|
||||
justify={'left'}
|
||||
label={getEmbeddedLabel(floor.name)}
|
||||
/>
|
||||
{#if i !== $floors.length - 1}<div class="divider" />{/if}
|
||||
{/each}
|
||||
<div class="flex-row-center flex-reverse mt-4 w-full">
|
||||
<ModernButton on:click={changeMode} icon={IconChevronLeft} label={ui.string.Back} />
|
||||
</div>
|
||||
{:else}
|
||||
{#if selectedFloor}
|
||||
<Scroller>
|
||||
<div class="hulyModal-container noTopIndent type-aside">
|
||||
<div class="hulyModal-content">
|
||||
<Scroller>
|
||||
{#if floorsSelector}
|
||||
{#each $floors as _floor}
|
||||
<FloorPreview
|
||||
showRoomName
|
||||
floor={_floor}
|
||||
rooms={getRooms($rooms, _floor._id)}
|
||||
selected={selectedFloor?._id === _floor._id}
|
||||
kind={'no-border'}
|
||||
background={'var(--theme-panel-color)'}
|
||||
on:select={() => {
|
||||
selectFloor(_floor._id)
|
||||
}}
|
||||
/>
|
||||
{/each}
|
||||
{:else if selectedFloor}
|
||||
<FloorPreview
|
||||
floor={selectedFloor}
|
||||
showRoomName
|
||||
@ -72,26 +68,19 @@
|
||||
isOpen
|
||||
disabled
|
||||
cropped
|
||||
size={'small'}
|
||||
kind={'no-border'}
|
||||
background={'var(--theme-popup-color)'}
|
||||
background={'var(--theme-panel-color)'}
|
||||
/>
|
||||
</Scroller>
|
||||
{/if}
|
||||
{#if $floors.length > 1}
|
||||
<div class="flex-row-center flex-reverse flex-no-shrink w-full mt-4 mr-2">
|
||||
<ModernButton on:click={changeMode} icon={IconLayers} label={love.string.ChangeFloor} />
|
||||
</div>
|
||||
{/if}
|
||||
{/if}
|
||||
</Scroller>
|
||||
</div>
|
||||
{#if floorsSelector || $floors.length > 1}
|
||||
<div class="hulyModal-footer">
|
||||
<ModernButton
|
||||
on:click={changeMode}
|
||||
icon={floorsSelector ? IconChevronLeft : IconLayers}
|
||||
label={floorsSelector ? ui.string.Back : love.string.ChangeFloor}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.root {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
</style>
|
||||
|
@ -61,7 +61,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={love.icon.Love} label={love.string.Settings} size={'large'} isCurrent />
|
||||
</Header>
|
||||
<div class="flex-row-stretch flex-grow p-10">
|
||||
|
@ -97,7 +97,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb
|
||||
icon={notification.icon.Notifications}
|
||||
label={notification.string.Notifications}
|
||||
|
@ -102,7 +102,7 @@
|
||||
|
||||
<div class="hulyComponent">
|
||||
{#if !withoutHeader}
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Clazz} label={setting.string.ClassSetting} size={'large'} isCurrent />
|
||||
</Header>
|
||||
{/if}
|
||||
|
@ -28,7 +28,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Setting} label={setting.string.Configuration} size={'large'} isCurrent />
|
||||
</Header>
|
||||
<div class="hulyComponent-content__column content">
|
||||
|
@ -55,7 +55,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Enums} label={setting.string.Enums} size={'large'} isCurrent />
|
||||
<svelte:fragment slot="actions">
|
||||
<ModernButton
|
||||
|
@ -117,7 +117,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Setting} label={setting.string.General} size={'large'} isCurrent />
|
||||
</Header>
|
||||
<div class="hulyComponent-content__column content">
|
||||
|
@ -40,7 +40,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Integrations} label={setting.string.Integrations} size={'large'} isCurrent />
|
||||
</Header>
|
||||
|
||||
|
@ -57,7 +57,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.InviteSettings} label={setting.string.InviteSettings} size={'large'} isCurrent />
|
||||
</Header>
|
||||
<div class="form">
|
||||
|
@ -52,7 +52,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Owners} label={setting.string.Owners} size={'large'} isCurrent />
|
||||
<svelte:fragment slot="search">
|
||||
<SearchInput bind:value={search} collapsed />
|
||||
|
@ -57,7 +57,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Password} label={setting.string.ChangePassword} size={'large'} isCurrent />
|
||||
</Header>
|
||||
<div class="flex-row-stretch flex-grow p-10">
|
||||
|
@ -77,7 +77,7 @@
|
||||
<FocusHandler {manager} />
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.AccountSettings} label={setting.string.AccountSettings} size={'large'} isCurrent />
|
||||
</Header>
|
||||
<div class="ac-body p-10">
|
||||
|
@ -77,7 +77,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={setting.icon.Views} label={setting.string.Spaces} size="large" isCurrent />
|
||||
</Header>
|
||||
<div class="hulyComponent-content__column content">
|
||||
|
@ -149,7 +149,7 @@
|
||||
}}
|
||||
>
|
||||
{#if type !== undefined && descriptor !== undefined}
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumbs
|
||||
items={bcItems}
|
||||
size="large"
|
||||
|
@ -151,7 +151,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb
|
||||
icon={templatesPlugin.icon.Templates}
|
||||
label={templatesPlugin.string.Templates}
|
||||
|
@ -8,7 +8,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={tracker.icon.Relations} label={tracker.string.RelatedIssues} size={'large'} isCurrent />
|
||||
</Header>
|
||||
<EditRelatedTargets {value} />
|
||||
|
@ -83,7 +83,7 @@
|
||||
</script>
|
||||
|
||||
<div class="hulyComponent">
|
||||
<Header>
|
||||
<Header adaptive={'disabled'}>
|
||||
<Breadcrumb icon={training.icon.Training} label={training.string.Trainings} size="large" isCurrent />
|
||||
</Header>
|
||||
<div class="hulyComponent-content__column content">
|
||||
|
Loading…
Reference in New Issue
Block a user