fix(ui): left side of a select needs radius

This commit is contained in:
Łukasz Mierzwa
2019-11-29 22:04:58 +00:00
parent b02cfa8ddf
commit 10ec1a84fc
10 changed files with 23 additions and 21 deletions

View File

@@ -5,7 +5,7 @@ exports[`<AlertGroupCollapseConfiguration /> matches snapshot with default value
<div class=\\"form-group mb-0\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Collapse on mobile
</div>

View File

@@ -7,7 +7,7 @@ exports[`<AlertGroupSortConfiguration /> matches snapshot with default values 1`
<div class=\\"flex-shrink-0 flex-grow-1 flex-basis-auto\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Use defaults from karma config file
</div>

View File

@@ -5,7 +5,7 @@ exports[`<ThemeConfiguration /> matches snapshot with default values 1`] = `
<div class=\\"form-group mb-2\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Automatic theme, follow browser preferences
</div>

View File

@@ -153,7 +153,7 @@ exports[`<Configuration /> matches snapshot 1`] = `
<div class=\\"form-group mb-2\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Automatic theme, follow browser preferences
</div>
@@ -390,7 +390,7 @@ exports[`<Configuration /> matches snapshot 1`] = `
<div class=\\"form-group mb-0\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Collapse on mobile
</div>
@@ -471,7 +471,7 @@ exports[`<Configuration /> matches snapshot 1`] = `
<div class=\\"flex-shrink-0 flex-grow-1 flex-basis-auto\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Use defaults from karma config file
</div>

View File

@@ -172,7 +172,7 @@ exports[`<MainModalContent /> matches snapshot 1`] = `
<div class=\\"form-group mb-2\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Automatic theme, follow browser preferences
</div>
@@ -409,7 +409,7 @@ exports[`<MainModalContent /> matches snapshot 1`] = `
<div class=\\"form-group mb-0\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Collapse on mobile
</div>
@@ -490,7 +490,7 @@ exports[`<MainModalContent /> matches snapshot 1`] = `
<div class=\\"flex-shrink-0 flex-grow-1 flex-basis-auto\\">
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
Use defaults from karma config file
</div>

View File

@@ -4,7 +4,7 @@ exports[`<MultiSelect /> matches snapshot without any extra props 1`] = `
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container css-97xgis\\">
<div class=\\"react-select__value-container css-ct477o\\">
<div class=\\"react-select__placeholder css-1wa3eu0-placeholder\\">
Select...
</div>
@@ -65,7 +65,7 @@ exports[`<WrappedCustomMultiSelect /> matches snapshot when focused 1`] = `
</p>
</span>
<div class=\\"react-select__control react-select__control--is-focused css-11rrdhm-control\\">
<div class=\\"react-select__value-container css-97xgis\\">
<div class=\\"react-select__value-container css-ct477o\\">
<div class=\\"react-select__placeholder css-1wa3eu0-placeholder\\">
Select...
</div>
@@ -116,7 +116,7 @@ exports[`<WrappedCustomMultiSelect /> matches snapshot with a value 1`] = `
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
foo
</div>
@@ -167,7 +167,7 @@ exports[`<WrappedCustomMultiSelect /> matches snapshot with defaults 1`] = `
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container css-97xgis\\">
<div class=\\"react-select__value-container css-ct477o\\">
<div class=\\"react-select__placeholder css-1wa3eu0-placeholder\\">
Select...
</div>
@@ -218,7 +218,7 @@ exports[`<WrappedCustomMultiSelect /> matches snapshot with isDisabled=true 1`]
"
<div class=\\"react-select--is-disabled css-14jk2my-container\\">
<div class=\\"react-select__control react-select__control--is-disabled css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value react-select__single-value--is-disabled css-1wh03ml-singleValue\\">
foo
</div>
@@ -270,7 +270,7 @@ exports[`<WrappedCustomMultiSelect /> matches snapshot with isMulti=true 1`] = `
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi css-nj4yyx\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi css-puzefo\\">
<div class=\\"react-select__placeholder css-1wa3eu0-placeholder\\">
Select...
</div>
@@ -321,7 +321,7 @@ exports[`<WrappedCustomMultiSelect /> matches snapshot with isMulti=true and a v
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi react-select__value-container--has-value css-nj4yyx\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi react-select__value-container--has-value css-puzefo\\">
<div class=\\"css-owt1hd-multiValue react-select__multi-value\\">
<div class=\\"css-xbn6jz react-select__multi-value__label\\">
foo

View File

@@ -4,7 +4,7 @@ exports[`<AlertManagerInput /> matches snapshot 1`] = `
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi react-select__value-container--has-value css-nj4yyx\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi react-select__value-container--has-value css-puzefo\\">
<div class=\\"css-owt1hd-multiValue react-select__multi-value\\">
<div class=\\"css-xbn6jz react-select__multi-value__label\\">
am1 | am2

View File

@@ -4,7 +4,7 @@ exports[`<LabelNameInput /> matches snapshot 1`] = `
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-97xgis\\">
<div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
<div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
name
</div>

View File

@@ -4,7 +4,7 @@ exports[`<LabelValueInput /> matches snapshot 1`] = `
"
<div class=\\" css-2b097c-container\\">
<div class=\\"react-select__control css-r5n82u-control\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi css-nj4yyx\\">
<div class=\\"react-select__value-container react-select__value-container--is-multi css-puzefo\\">
<div class
style=\\"display: inline-block; max-width: 100%;\\"
data-tooltipped

View File

@@ -51,7 +51,8 @@ const ReactSelectStyles = theme => ({
state.isMulti
? {
...base,
borderRadius: 0,
borderTopLeftRadius: "0.25rem",
borderBottomLeftRadius: "0.25rem",
backgroundColor: state.isDisabled
? theme.disabledValueContainerBackground
: theme.valueContainerBackground,
@@ -65,7 +66,8 @@ const ReactSelectStyles = theme => ({
}
: {
...base,
borderRadius: 0,
borderTopLeftRadius: "0.25rem",
borderBottomLeftRadius: "0.25rem",
backgroundColor: state.isDisabled
? theme.disabledValueContainerBackground
: theme.valueContainerBackground