diff --git a/packages/theme/styles/common.scss b/packages/theme/styles/common.scss index 1bd1b1ed3a..bdef3fd1f7 100644 --- a/packages/theme/styles/common.scss +++ b/packages/theme/styles/common.scss @@ -29,8 +29,9 @@ .heading-bold-20 { font-family: var(--font-family); font-style: normal; - line-height: 1rem; color: var(--global-primary-TextColor); + + &:not(.line-height-auto) { line-height: 1rem; } } .font-regular-11, .font-medium-11 { diff --git a/packages/theme/styles/components.scss b/packages/theme/styles/components.scss index 77a6e98baa..c46be00272 100644 --- a/packages/theme/styles/components.scss +++ b/packages/theme/styles/components.scss @@ -573,7 +573,7 @@ .hulyToDoLine-container { display: flex; justify-content: space-between; - align-items: flex-start; + align-items: center; gap: var(--spacing-1); margin: 0; padding: var(--spacing-0_75) var(--spacing-1) var(--spacing-0_75) var(--spacing-0_75); @@ -584,6 +584,7 @@ border-radius: var(--medium-BorderRadius); outline: none; + .hulyToDoLine-title { color: var(--global-primary-TextColor); } &.isDone { .hulyToDoLine-title { color: var(--global-tertiary-TextColor); @@ -611,7 +612,6 @@ .hulyToDoLine-statusPriority { position: relative; margin-right: var(--spacing-0_25); - padding-top: var(--spacing-0_5); min-width: var(--global-min-Size); &.isNew::after { @@ -630,16 +630,6 @@ width: var(--global-extra-small-Size); height: var(--global-extra-small-Size); } - .hulyToDoLine-top-align { - color: var(--global-primary-TextColor); - - &.top-12 { - padding-top: 0.25rem; - } - &.top-14 { - padding-top: 0.175rem; - } - } .hulyToDoLine-icon { display: flex; justify-content: center; @@ -651,7 +641,6 @@ .hulyToDoLine-label { flex-grow: 1; flex-shrink: 1; - padding-top: var(--spacing-0_5); color: var(--global-secondary-TextColor); &:not(.large) { diff --git a/packages/theme/styles/love.scss b/packages/theme/styles/love.scss index 189d280ee6..0e86a97174 100644 --- a/packages/theme/styles/love.scss +++ b/packages/theme/styles/love.scss @@ -139,23 +139,11 @@ .hulySplitButton-main { flex-grow: 1; } - &.no-video:not(.row) .hulySplitButton-container { - grid-column: span 2; - } - &.row .hulySplitButton-container { + .hulySplitButton-container { flex-grow: 2; } - &.row.no-video .hulySplitButton-container { + &.no-video .hulySplitButton-container { flex-grow: 4; } } - - &.small.cropped .scroller-container, - &.large.cropped .scroller-container { - max-height: 24.5rem; - } - &.medium.cropped .scroller-container { - max-height: 22.5rem; - } - .slot.hoverable:hover > .avatar-container { opacity: .35; } } diff --git a/plugins/time-resources/src/components/ToDoElement.svelte b/plugins/time-resources/src/components/ToDoElement.svelte index 0d09226634..ea10c0b178 100644 --- a/plugins/time-resources/src/components/ToDoElement.svelte +++ b/plugins/time-resources/src/components/ToDoElement.svelte @@ -76,7 +76,7 @@ showMenu(e, { object: todo }) }} > - <div class="flex-row-top flex-grow flex-gap-2"> + <div class="flex-row-center flex-grow flex-gap-2"> <div class="hulyToDoLine-statusPriority" class:isNew> {#if updating !== undefined} <Spinner size={'small'} /> @@ -88,7 +88,7 @@ {/if} </div> <WorkItemPresenter {todo} kind={'todo-line'} withoutSpace /> - <div class="hulyToDoLine-title hulyToDoLine-top-align top-12 text-left font-regular-14 overflow-label"> + <div class="hulyToDoLine-title text-left font-regular-14 line-height-auto overflow-label"> {todo.title} </div> </div> @@ -102,12 +102,12 @@ </div> <div class="flex flex-no-shrink flex-gap-3 pl-2"> {#if events.length > 0} - <span class="hulyToDoLine-top-align top-12 font-regular-12 secondary-textColor"> + <span class="font-regular-12 secondary-textColor"> <ToDoDuration {events} /> </span> {/if} {#if todo.dueDate} - <span class="hulyToDoLine-top-align top-12 font-regular-12 secondary-textColor"> + <span class="font-regular-12 secondary-textColor"> {new Date(todo.dueDate).toLocaleDateString('default', { month: 'short', day: 'numeric' })} </span> {/if}