diff --git a/packages/uui-base/lib/mixins/LabelMixin.ts b/packages/uui-base/lib/mixins/LabelMixin.ts index 96f38627b..57eeb9705 100644 --- a/packages/uui-base/lib/mixins/LabelMixin.ts +++ b/packages/uui-base/lib/mixins/LabelMixin.ts @@ -65,7 +65,7 @@ export const LabelMixin = >( : ''} `; diff --git a/packages/uui-boolean-input/lib/uui-boolean-input.element.ts b/packages/uui-boolean-input/lib/uui-boolean-input.element.ts index 86000050a..eb018fb18 100644 --- a/packages/uui-boolean-input/lib/uui-boolean-input.element.ts +++ b/packages/uui-boolean-input/lib/uui-boolean-input.element.ts @@ -256,6 +256,10 @@ export abstract class UUIBooleanInputElement extends UUIFormControlMixin( .label { display: block; } + + span.label:empty { + display: none; + } `, ]; } diff --git a/packages/uui-input/lib/uui-input.element.ts b/packages/uui-input/lib/uui-input.element.ts index 9b76e4d9f..b2323877c 100644 --- a/packages/uui-input/lib/uui-input.element.ts +++ b/packages/uui-input/lib/uui-input.element.ts @@ -478,7 +478,8 @@ export class UUIInputElement extends UUIFormControlMixin( input { font-family: inherit; - padding: var(--uui-size-1) var(--uui-size-space-3); + padding: 1px var(--uui-size-space-3) var(--uui-size-1) + var(--uui-size-space-3); font-size: inherit; color: inherit; border-radius: var(--uui-border-radius); @@ -502,6 +503,13 @@ export class UUIInputElement extends UUIFormControlMixin( border: none; } + slot[name='prepend'], + slot[name='append'] { + display: flex; + align-items: center; + line-height: 1; + } + ::slotted(uui-input), ::slotted(uui-input-lock) { height: 100%; diff --git a/packages/uui-input/lib/uui-input.story.ts b/packages/uui-input/lib/uui-input.story.ts index 4b7c5dbec..85c4045ad 100644 --- a/packages/uui-input/lib/uui-input.story.ts +++ b/packages/uui-input/lib/uui-input.story.ts @@ -138,6 +138,15 @@ export const PrependAndAppend: Story = { }; export const PrependIcon: Story = { + args: { + 'prepend slot': html``, + }, +}; + +export const PrependIconInDiv: Story = { args: { 'prepend slot': html`
diff --git a/packages/uui-ref-node/lib/uui-ref-node.element.ts b/packages/uui-ref-node/lib/uui-ref-node.element.ts index 4f0650658..15d8c818a 100644 --- a/packages/uui-ref-node/lib/uui-ref-node.element.ts +++ b/packages/uui-ref-node/lib/uui-ref-node.element.ts @@ -183,9 +183,8 @@ export class UUIRefNodeElement extends UUIRefElement { display: flex; flex-grow: 1; align-items: center; - justify-content: center; line-height: 1.2em; - padding: calc(var(--uui-size-2)); + padding: calc(var(--uui-size-3)); } #open-part { @@ -211,10 +210,12 @@ export class UUIRefNodeElement extends UUIRefElement { justify-content: center; height: 100%; padding-left: var(--uui-size-2); + margin-top: 1px; } #detail { opacity: 0.6; + line-height: 1.2em; } :host([selectable]) #open-part { diff --git a/packages/uui-ref/lib/uui-ref.element.ts b/packages/uui-ref/lib/uui-ref.element.ts index 0b6181550..685a70c4c 100644 --- a/packages/uui-ref/lib/uui-ref.element.ts +++ b/packages/uui-ref/lib/uui-ref.element.ts @@ -69,6 +69,7 @@ export class UUIRefElement extends SelectOnlyMixin( justify-content: space-between; align-items: center; width: 100%; + font-size: var(--uui-font-size); box-sizing: border-box; border-radius: var(--uui-border-radius); diff --git a/packages/uui-table/lib/uui-table-advanced-example.ts b/packages/uui-table/lib/uui-table-advanced-example.ts index 1f9641db7..085078a9b 100644 --- a/packages/uui-table/lib/uui-table-advanced-example.ts +++ b/packages/uui-table/lib/uui-table-advanced-example.ts @@ -199,7 +199,7 @@ export class UUITableWithSelectionExampleElement extends LitElement { @selected=${() => this._selectRowHandler(item)} @deselected=${() => this._deselectRowHandler(item)}> - + e.stopPropagation()} @change=${(event: Event) => this._selectHandler(event, item)}