diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx index bdc7c8c9143..9c269eb472d 100644 --- a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx +++ b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/create-component/FieldBlock/Examples.tsx @@ -85,7 +85,7 @@ export const Widths = () => { Contents Contents diff --git a/packages/dnb-eufemia/src/extensions/forms/Field/String/StringDocs.ts b/packages/dnb-eufemia/src/extensions/forms/Field/String/StringDocs.ts index ffcc2c0f28f..247e0634fd8 100644 --- a/packages/dnb-eufemia/src/extensions/forms/Field/String/StringDocs.ts +++ b/packages/dnb-eufemia/src/extensions/forms/Field/String/StringDocs.ts @@ -53,7 +53,7 @@ export const stringProperties: PropertiesTableProps = { status: 'optional', }, width: { - doc: '`false` for no width (use browser default), small, medium or large for predefined standard widths, stretch for fill available width.', + doc: '`false` for no width (use browser default), small, medium or large for predefined standard widths, stretch to fill available width.', type: ['string', 'false'], status: 'optional', }, diff --git a/packages/dnb-eufemia/src/extensions/forms/Field/String/stories/String.stories.tsx b/packages/dnb-eufemia/src/extensions/forms/Field/String/stories/String.stories.tsx index 0e132a3a0da..314f415a3ce 100644 --- a/packages/dnb-eufemia/src/extensions/forms/Field/String/stories/String.stories.tsx +++ b/packages/dnb-eufemia/src/extensions/forms/Field/String/stories/String.stories.tsx @@ -5,6 +5,31 @@ import { Flex } from '../../../../../components' export default { title: 'Eufemia/Extensions/Forms/String', } +export const StringAndLabelStretch = () => { + return ( + + Subheading + + + + ) +} export const String = () => { return ( diff --git a/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-sbanken-have-to-match-widths.snap.png b/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-sbanken-have-to-match-widths.snap.png index 5046786f8b3..a76cf637d3d 100644 Binary files a/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-sbanken-have-to-match-widths.snap.png and b/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-sbanken-have-to-match-widths.snap.png differ diff --git a/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-ui-have-to-match-widths.snap.png b/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-ui-have-to-match-widths.snap.png index 0cad8a8600d..a6ab2aa89ea 100644 Binary files a/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-ui-have-to-match-widths.snap.png and b/packages/dnb-eufemia/src/extensions/forms/FieldBlock/__tests__/__image_snapshots__/fieldblock-for-ui-have-to-match-widths.snap.png differ diff --git a/packages/dnb-eufemia/src/extensions/forms/FieldBlock/style/dnb-field-block.scss b/packages/dnb-eufemia/src/extensions/forms/FieldBlock/style/dnb-field-block.scss index d66077b4019..105d4878964 100644 --- a/packages/dnb-eufemia/src/extensions/forms/FieldBlock/style/dnb-field-block.scss +++ b/packages/dnb-eufemia/src/extensions/forms/FieldBlock/style/dnb-field-block.scss @@ -45,6 +45,9 @@ fieldset.dnb-forms-field-block { &--width { &-stretch { flex-grow: 1; + label.dnb-form-label { + max-width: none; + } } @include allAbove(x-small) { &-custom {