diff --git a/packages/theme/styles/_layouts.scss b/packages/theme/styles/_layouts.scss index 59f2f6b44f..0ec0445f6d 100644 --- a/packages/theme/styles/_layouts.scss +++ b/packages/theme/styles/_layouts.scss @@ -106,6 +106,16 @@ p:last-child { margin-block-end: 0; } line-height: 200%; } +.float-left-box { + box-sizing: border-box; + width: 100%; + float: left; +} + +.float-left { + float: left; +} + /* Flex */ .flex { display: flex; } .inline-flex { display: inline-flex; } @@ -342,6 +352,7 @@ p:last-child { margin-block-end: 0; } .pt-3 { padding-top: .75rem; } .pt-4 { padding-top: 1rem; } .pb-2 { padding-bottom: .5rem; } +.pb-3 { padding-bottom: .75rem; } .pb-4 { padding-bottom: 1rem; } .p-1 { padding: .25rem; } @@ -391,6 +402,7 @@ p:last-child { margin-block-end: 0; } .h-full { height: 100%; } .h-2 { height: .5rem; } +.h-4 { height: 1rem; } .h-6 { height: 1.5rem; } .h-7 { height: 1.75rem; } .h-8 { height: 2rem; } diff --git a/packages/ui/src/components/calendar/DatePresenter.svelte b/packages/ui/src/components/calendar/DatePresenter.svelte index 88aff7adb4..e1191ea0a1 100644 --- a/packages/ui/src/components/calendar/DatePresenter.svelte +++ b/packages/ui/src/components/calendar/DatePresenter.svelte @@ -30,6 +30,8 @@ export let labelNull: IntlString = ui.string.NoDate export let showIcon = true export let shouldShowLabel: boolean = true + export let size: 'x-small' | 'small' = 'small' + export let kind: 'transparent' | 'primary' = 'primary' const dispatch = createEventDispatcher() @@ -56,6 +58,10 @@ class="datetime-button" class:editable class:dateTimeButtonNoLabel={!shouldShowLabel} + class:primary={kind === 'primary'} + class:h-6={size === 'small'} + class:h-3={size === 'x-small'} + class:text-xs={size === 'x-small'} on:click={() => { if (editable && !opened) { opened = true @@ -75,7 +81,7 @@ > {#if showIcon}
- +
{/if} {#if value !== null && value !== undefined} @@ -105,22 +111,24 @@ display: flex; align-items: center; flex-shrink: 0; - padding: 0 0.5rem; font-weight: 400; - min-width: 1.5rem; width: auto; - height: 1.5rem; white-space: nowrap; - line-height: 1.5rem; color: var(--accent-color); - background-color: var(--noborder-bg-color); - border: 1px solid transparent; - border-radius: 0.25rem; - box-shadow: var(--button-shadow); - transition-property: border, background-color, color, box-shadow; - transition-duration: 0.15s; + cursor: default; + &.primary { + padding: 0 0.5rem; + min-width: 1.5rem; + background-color: var(--noborder-bg-color); + border: 1px solid transparent; + border-radius: 0.25rem; + box-shadow: var(--button-shadow); + transition-property: border, background-color, color, box-shadow; + transition-duration: 0.15s; + } + &.dateTimeButtonNoLabel { padding: 0; } diff --git a/plugins/board-resources/src/components/KanbanCard.svelte b/plugins/board-resources/src/components/KanbanCard.svelte index 8e60e9529d..2ee5c27f02 100644 --- a/plugins/board-resources/src/components/KanbanCard.svelte +++ b/plugins/board-resources/src/components/KanbanCard.svelte @@ -15,13 +15,18 @@ --> -
+
{#if dragoverAttachment}