Fix modal layout (#9980)

Signed-off-by: Artem Savchenko <[email protected]>

Author: ArtyomSavchenko

packages/theme/styles/components.scss

@@ -642,7 +642,6 @@
     border: 1px solid var(--theme-popup-divider); // var(--global-surface-02-BorderColor);
     border-radius: var(--large-BorderRadius);
     box-shadow: var(--global-modal-ShadowX) var(--global-modal-ShadowY) var(--global-modal-ShadowBlur) var(--global-modal-ShadowSpread) var(--global-popover-ShadowColor);
-    max-width: 90vw;
 
     &.large {
       min-width: unset;

packages/ui/src/components/Modal.svelte

@@ -23,6 +23,7 @@
 
   export let type: 'type-aside' | 'type-popup' | 'type-component'
   export let width: 'large' | 'medium' | 'small' | 'x-small' | 'menu' | undefined = undefined
+  export let maxWidth: string | undefined = undefined
   export let label: IntlString | undefined = undefined
   export let labelProps: any | undefined = undefined
   export let okAction: () => Promise<void> | void = () => {}
@@ -69,7 +70,12 @@
 
 <svelte:window on:keydown={onKeyDown} />
 
-<div class="hulyModal-container {type} {width ?? ''}" class:hidden class:noTopIndent>
+<div
+  class="hulyModal-container {type} {width ?? ''}"
+  class:hidden
+  class:noTopIndent
+  style={maxWidth ? `max-width: ${maxWidth};` : ''}
+>
   <Header
     {type}
     {adaptive}

plugins/card-resources/src/components/CreateCardPopup.svelte

@@ -151,6 +151,7 @@
   okLoading={creating}
   canSave={data.title != null && data.title.trim().length > 0 && _space != null}
   onCancel={handleCancel}
+  maxWidth="90vw"
   on:close
 >
   <div class="hulyModal-content__titleGroup" style="padding: 0">