diff --git a/packages/presentation/src/components/FilePreviewPopup.svelte b/packages/presentation/src/components/FilePreviewPopup.svelte index 6c2609133d..d14e0596df 100644 --- a/packages/presentation/src/components/FilePreviewPopup.svelte +++ b/packages/presentation/src/components/FilePreviewPopup.svelte @@ -16,7 +16,18 @@ import { Analytics } from '@hcengineering/analytics' import { BlobMetadata, SortingOrder, type Blob, type Ref } from '@hcengineering/core' import { getEmbeddedLabel } from '@hcengineering/platform' - import { Button, Dialog, IconHistory, IconScribble, showPopup, tooltip } from '@hcengineering/ui' + import { + Button, + Modal, + IconHistory, + IconScribble, + showPopup, + tooltip, + ButtonIcon, + IconMaximize, + IconMinimize, + IconClose + } from '@hcengineering/ui' import { createEventDispatcher, onMount } from 'svelte' import ActionContext from './ActionContext.svelte' @@ -122,13 +133,39 @@ - { dispatch('close') }} - padding="0.5rem" > + + { + dispatch('close') + }} + /> + + { + fullSize = !fullSize + dispatch('fullsize', fullSize) + }} + /> + + + {#if showIcon} @@ -140,7 +177,7 @@ - + {#if props.drawingAvailable === true} {#if props.drawings !== undefined && props.drawings.length > 0} {/if} - + diff --git a/packages/presentation/src/filetypes.ts b/packages/presentation/src/filetypes.ts index 7a5d4543fa..44a3196b7f 100644 --- a/packages/presentation/src/filetypes.ts +++ b/packages/presentation/src/filetypes.ts @@ -95,9 +95,9 @@ export async function getPreviewType ( */ export function getPreviewAlignment (contentType: string): PopupAlignment { if (contentType.startsWith('image/')) { - return 'full-centered' + return 'centered' } else if (contentType.startsWith('video/')) { - return 'full-centered' + return 'centered' } else { return 'float' } diff --git a/packages/theme/styles/components.scss b/packages/theme/styles/components.scss index 6166525e53..61b956822a 100644 --- a/packages/theme/styles/components.scss +++ b/packages/theme/styles/components.scss @@ -477,8 +477,14 @@ height: var(--spacing-4); background-color: var(--theme-divider-color); // var(--global-surface-02-BorderColor); + &.no-line { + width: 0; + background-color: transparent; + } &.short { margin: 0 var(--spacing-1); + + &.no-line { margin: 0 var(--spacing-0_125); } } } .hulyHeader-titleGroup, diff --git a/packages/ui/src/components/Modal.svelte b/packages/ui/src/components/Modal.svelte index d965bc7fc7..b3afcf6ff8 100644 --- a/packages/ui/src/components/Modal.svelte +++ b/packages/ui/src/components/Modal.svelte @@ -30,6 +30,7 @@ export let canSave: boolean = false export let okLabel: IntlString = ui.string.Ok export let padding: string | undefined = undefined + export let bottomPadding: string | undefined = undefined export let hidden: boolean = false export let noTopIndent: boolean = false export let hideFooter: boolean = false @@ -89,7 +90,7 @@ {#if scrollableContent} { closeTooltip() - showPopup(FilePreviewPopup, { file, name: fileName, contentType, metadata }, 'centered') + showPopup(FilePreviewPopup, { file, name: fileName, contentType, metadata, fullSize: true }, 'centered') }} /> diff --git a/plugins/attachment-resources/src/utils.ts b/plugins/attachment-resources/src/utils.ts index 3ebc81709e..e120ab5e95 100644 --- a/plugins/attachment-resources/src/utils.ts +++ b/plugins/attachment-resources/src/utils.ts @@ -155,9 +155,12 @@ export function isAttachment (value: Attachment | BlobType): value is WithLookup return (value as Attachment)._id !== undefined } -export function showAttachmentPreviewPopup (value: WithLookup | BlobType): PopupResult { +export function showAttachmentPreviewPopup ( + value: WithLookup | BlobType, + fullSize: boolean = true +): PopupResult { closeTooltip() - return showPopup(AttachmentPreviewPopup, { value }, getPreviewAlignment(value.type ?? '')) + return showPopup(AttachmentPreviewPopup, { value, fullSize }, getPreviewAlignment(value.type ?? '')) } interface ImageDimensions {