mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2024-11-25 02:53:53 +03:00
fix(devui): better Select styles to match other components (#787)
* feat(extension): add back buttons for opening new windows * Change import * stash * stash
This commit is contained in:
Nathan Bierema
GitHub
parent
1dd169a60d
commit
2f7cf3efac
|
|
@ -27,7 +27,7 @@ export class Select<
|
|||
{...this.props}
|
||||
theme={(theme) => ({
|
||||
...theme,
|
||||
borderRadius: this.props.theme.inputBorderRadius,
|
||||
borderRadius: 0,
|
||||
colors: {
|
||||
...theme.colors,
|
||||
|
||||
|
|
@ -60,9 +60,15 @@ export class Select<
|
|||
}),
|
||||
control: (base, props) => ({
|
||||
...base,
|
||||
backgroundColor: props.isDisabled
|
||||
backgroundColor: props.isFocused
|
||||
? props.theme.colors.neutral10
|
||||
: props.theme.colors.neutral5,
|
||||
borderColor: props.theme.colors.neutral10,
|
||||
|
||||
'&:hover': {
|
||||
backgroundColor: props.theme.colors.neutral10,
|
||||
borderColor: props.theme.colors.neutral10,
|
||||
},
|
||||
}),
|
||||
}}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ exports[`Select renders correctly 1`] = `
|
|||
class=" css-butsr4-container"
|
||||
>
|
||||
<div
|
||||
class=" css-vmgz7k-control"
|
||||
class=" css-10abb65-control"
|
||||
>
|
||||
<div
|
||||
class=" css-be27w2-ValueContainer"
|
||||
|
|
@ -73,21 +73,21 @@ exports[`Select renders with props 1`] = `
|
|||
class=" css-ie73ge-container"
|
||||
>
|
||||
<div
|
||||
class=" css-vmgz7k-control"
|
||||
class=" css-10abb65-control"
|
||||
>
|
||||
<div
|
||||
class=" css-be27w2-ValueContainer"
|
||||
>
|
||||
<div
|
||||
class="css-syqu13-multiValue"
|
||||
class="css-168vvpw-multiValue"
|
||||
>
|
||||
<div
|
||||
class="css-1lxn4sj"
|
||||
class="css-1m51f4l"
|
||||
>
|
||||
One
|
||||
</div>
|
||||
<div
|
||||
class="css-19nhond"
|
||||
class="css-1to589f"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
|
|
@ -489,7 +489,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -638,7 +638,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -673,12 +673,13 @@ exports[`Select should select another option 1`] = `
|
|||
css={
|
||||
Object {
|
||||
"&:hover": Object {
|
||||
"backgroundColor": undefined,
|
||||
"borderColor": undefined,
|
||||
},
|
||||
"alignItems": "center",
|
||||
"backgroundColor": undefined,
|
||||
"borderColor": undefined,
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"borderStyle": "solid",
|
||||
"borderWidth": 1,
|
||||
"boxShadow": null,
|
||||
|
|
@ -698,7 +699,7 @@ exports[`Select should select another option 1`] = `
|
|||
onTouchEnd={[Function]}
|
||||
>
|
||||
<div
|
||||
className=" css-vmgz7k-control"
|
||||
className=" css-10abb65-control"
|
||||
onMouseDown={[Function]}
|
||||
onTouchEnd={[Function]}
|
||||
>
|
||||
|
|
@ -794,7 +795,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -924,7 +925,7 @@ exports[`Select should select another option 1`] = `
|
|||
tabIndex="0"
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -1154,7 +1155,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -1292,7 +1293,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -1441,7 +1442,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -1637,7 +1638,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -1770,7 +1771,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -1805,7 +1806,7 @@ exports[`Select should select another option 1`] = `
|
|||
css={
|
||||
Object {
|
||||
"backgroundColor": undefined,
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"boxShadow": "0 0 0 1px hsla(0, 0%, 0%, 0.1), 0 4px 11px hsla(0, 0%, 0%, 0.1)",
|
||||
"boxSizing": "border-box",
|
||||
"label": "menu",
|
||||
|
|
@ -1821,7 +1822,7 @@ exports[`Select should select another option 1`] = `
|
|||
onMouseMove={[Function]}
|
||||
>
|
||||
<div
|
||||
className=" css-1ektx4i-menu"
|
||||
className=" css-1uhnaxp-menu"
|
||||
onMouseDown={[Function]}
|
||||
onMouseMove={[Function]}
|
||||
>
|
||||
|
|
@ -1925,7 +1926,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -2084,7 +2085,7 @@ exports[`Select should select another option 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -2439,7 +2440,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -2588,7 +2589,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -2623,12 +2624,13 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
css={
|
||||
Object {
|
||||
"&:hover": Object {
|
||||
"backgroundColor": undefined,
|
||||
"borderColor": undefined,
|
||||
},
|
||||
"alignItems": "center",
|
||||
"backgroundColor": undefined,
|
||||
"borderColor": undefined,
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"borderStyle": "solid",
|
||||
"borderWidth": 1,
|
||||
"boxShadow": null,
|
||||
|
|
@ -2648,7 +2650,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
onTouchEnd={[Function]}
|
||||
>
|
||||
<div
|
||||
className=" css-vmgz7k-control"
|
||||
className=" css-10abb65-control"
|
||||
onMouseDown={[Function]}
|
||||
onTouchEnd={[Function]}
|
||||
>
|
||||
|
|
@ -2744,7 +2746,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -2874,7 +2876,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
tabIndex="0"
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -3104,7 +3106,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -3242,7 +3244,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -3391,7 +3393,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -3587,7 +3589,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -3720,7 +3722,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -3755,7 +3757,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
css={
|
||||
Object {
|
||||
"backgroundColor": undefined,
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"boxShadow": "0 0 0 1px hsla(0, 0%, 0%, 0.1), 0 4px 11px hsla(0, 0%, 0%, 0.1)",
|
||||
"boxSizing": "border-box",
|
||||
"label": "menu",
|
||||
|
|
@ -3771,7 +3773,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
onMouseMove={[Function]}
|
||||
>
|
||||
<div
|
||||
className=" css-1ektx4i-menu"
|
||||
className=" css-1uhnaxp-menu"
|
||||
onMouseDown={[Function]}
|
||||
onMouseMove={[Function]}
|
||||
>
|
||||
|
|
@ -3875,7 +3877,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
@ -4013,7 +4015,7 @@ exports[`Select shouldn't find any results 1`] = `
|
|||
setValue={[Function]}
|
||||
theme={
|
||||
Object {
|
||||
"borderRadius": 4,
|
||||
"borderRadius": 0,
|
||||
"colors": Object {
|
||||
"danger": undefined,
|
||||
"dangerLight": undefined,
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user