diff --git a/src/themes/eui-amsterdam/global_styling/variables/_form.scss b/src/themes/eui-amsterdam/global_styling/variables/_form.scss new file mode 100644 index 000000000000..a5b7429d21aa --- /dev/null +++ b/src/themes/eui-amsterdam/global_styling/variables/_form.scss @@ -0,0 +1 @@ +$euiFormControlCompressedBorderRadius: $euiBorderRadiusSmall; \ No newline at end of file diff --git a/src/themes/eui-amsterdam/global_styling/variables/_index.scss b/src/themes/eui-amsterdam/global_styling/variables/_index.scss index 61ced978feb1..984743a3afba 100644 --- a/src/themes/eui-amsterdam/global_styling/variables/_index.scss +++ b/src/themes/eui-amsterdam/global_styling/variables/_index.scss @@ -4,6 +4,7 @@ @import 'buttons'; @import 'borders'; @import 'flyout'; +@import 'form'; @import 'header'; @import 'typography'; @import 'shadows'; \ No newline at end of file diff --git a/src/themes/eui-amsterdam/overrides/_form_control_layout.scss b/src/themes/eui-amsterdam/overrides/_form_control_layout.scss index bc3187731084..97690febf1c2 100644 --- a/src/themes/eui-amsterdam/overrides/_form_control_layout.scss +++ b/src/themes/eui-amsterdam/overrides/_form_control_layout.scss @@ -1,7 +1,7 @@ $leftSideRadius: $euiBorderRadius 0 0 $euiBorderRadius; $rightSideRadius: 0 $euiBorderRadius $euiBorderRadius 0; -$leftSideRadiusSmall: $euiBorderRadiusSmall 0 0 $euiBorderRadiusSmall; -$rightSideRadiusSmall: 0 $euiBorderRadiusSmall $euiBorderRadiusSmall 0; +$leftSideRadiusSmall: $euiFormControlCompressedBorderRadius 0 0 $euiFormControlCompressedBorderRadius; +$rightSideRadiusSmall: 0 $euiFormControlCompressedBorderRadius $euiFormControlCompressedBorderRadius 0; .euiFormControlLayout--group { @@ -47,6 +47,22 @@ $rightSideRadiusSmall: 0 $euiBorderRadiusSmall $euiBorderRadiusSmall 0; &.euiFormControlLayout--compressed { border-radius: $euiBorderRadiusSmall; + .euiFormControlLayout__prepend:first-child { + border-radius: $leftSideRadiusSmall; + + [class*='euiButton'] { + border-radius: $leftSideRadiusSmall; + } + } + + .euiFormControlLayout__append:last-child { + border-radius: $rightSideRadiusSmall; + + [class*='euiButton'] { + border-radius: $rightSideRadiusSmall; + } + } + .euiFormControlLayout__childrenWrapper:nth-child(2) [class*='euiField'], .euiFormControlLayout__childrenWrapper:nth-child(3) [class*='euiField'] { border-radius: 0;