Skip to content
This repository has been archived by the owner on Mar 7, 2023. It is now read-only.

Commit

Permalink
fix(searchbars): fix regression (#221)
Browse files Browse the repository at this point in the history
  • Loading branch information
Lyncee59 authored Jan 15, 2019
1 parent b1faee2 commit 61b2545
Show file tree
Hide file tree
Showing 4 changed files with 77 additions and 73 deletions.
18 changes: 10 additions & 8 deletions src/Molecules/SearchBars/SearchBar.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const Wrapper = styled.div`
position: relative;
display: flex;
flex-direction: row;
justify-content: flex-start;
justify-content: center;
align-items: center;
width: ${prop<PropsType>('width')};
background-color: ${theme('searchBarBackgroundColor')};
Expand Down Expand Up @@ -55,14 +55,16 @@ const SearchIcon = styled(FasSearch).attrs({
`

const SearchInput = styled(Input)`
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
& > input {
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
&:focus,
&:active {
box-shadow: none !important;
&:focus,
&:active {
box-shadow: none !important;
}
}
`

Expand Down
12 changes: 7 additions & 5 deletions src/Molecules/SearchBars/SearchBarUnderlined.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,12 +28,14 @@ const Wrapper = styled.div`
`

const SearchInput = styled(Input)`
background-color: inherit;
border-color: transparent;
& > input {
background-color: inherit;
border-color: transparent;
&:focus,
&:active {
box-shadow: none !important;
&:focus,
&:active {
box-shadow: none !important;
}
}
`

Expand Down
84 changes: 42 additions & 42 deletions src/Molecules/SearchBars/__snapshots__/SearchBar.spec.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -87,10 +87,10 @@ exports[`SearchBar should render correctly 1`] = `
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
Expand Down Expand Up @@ -133,15 +133,15 @@ exports[`SearchBar should render correctly 1`] = `
fill: #000;
}
.c4 {
.c4 > input {
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
}
.c4:focus,
.c4:active {
.c4 > input:focus,
.c4 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -372,10 +372,10 @@ exports[`SearchBar should render correctly with e2e 1`] = `
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
Expand Down Expand Up @@ -418,15 +418,15 @@ exports[`SearchBar should render correctly with e2e 1`] = `
fill: #000;
}
.c4 {
.c4 > input {
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
}
.c4:focus,
.c4:active {
.c4 > input:focus,
.c4 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -657,10 +657,10 @@ exports[`SearchBar should render correctly with onChange 1`] = `
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
Expand Down Expand Up @@ -703,15 +703,15 @@ exports[`SearchBar should render correctly with onChange 1`] = `
fill: #000;
}
.c4 {
.c4 > input {
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
}
.c4:focus,
.c4:active {
.c4 > input:focus,
.c4 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -947,10 +947,10 @@ exports[`SearchBar should render correctly with onClick 1`] = `
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
Expand Down Expand Up @@ -993,15 +993,15 @@ exports[`SearchBar should render correctly with onClick 1`] = `
fill: #000;
}
.c4 {
.c4 > input {
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
}
.c4:focus,
.c4:active {
.c4 > input:focus,
.c4 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -1235,10 +1235,10 @@ exports[`SearchBar should render correctly with value 1`] = `
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
Expand Down Expand Up @@ -1281,15 +1281,15 @@ exports[`SearchBar should render correctly with value 1`] = `
fill: #000;
}
.c4 {
.c4 > input {
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
}
.c4:focus,
.c4:active {
.c4 > input:focus,
.c4 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -1530,10 +1530,10 @@ exports[`SearchBar should render correctly with width 1`] = `
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
Expand Down Expand Up @@ -1576,15 +1576,15 @@ exports[`SearchBar should render correctly with width 1`] = `
fill: #000;
}
.c4 {
.c4 > input {
height: 3.5rem;
padding-left: 3rem;
background-color: inherit;
border-color: transparent;
}
.c4:focus,
.c4:active {
.c4 > input:focus,
.c4 > input:active {
box-shadow: none !important;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -99,13 +99,13 @@ exports[`SearchBarUnderlined should render correctly 1`] = `
background-color: rgba(0,0,0,0);
}
.c1 {
.c1 > input {
background-color: inherit;
border-color: transparent;
}
.c1:focus,
.c1:active {
.c1 > input:focus,
.c1 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -318,13 +318,13 @@ exports[`SearchBarUnderlined should render correctly with e2e 1`] = `
background-color: rgba(0,0,0,0);
}
.c1 {
.c1 > input {
background-color: inherit;
border-color: transparent;
}
.c1:focus,
.c1:active {
.c1 > input:focus,
.c1 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -537,13 +537,13 @@ exports[`SearchBarUnderlined should render correctly with onChange 1`] = `
background-color: rgba(0,0,0,0);
}
.c1 {
.c1 > input {
background-color: inherit;
border-color: transparent;
}
.c1:focus,
.c1:active {
.c1 > input:focus,
.c1 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -761,13 +761,13 @@ exports[`SearchBarUnderlined should render correctly with onClick 1`] = `
background-color: rgba(0,0,0,0);
}
.c1 {
.c1 > input {
background-color: inherit;
border-color: transparent;
}
.c1:focus,
.c1:active {
.c1 > input:focus,
.c1 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -983,13 +983,13 @@ exports[`SearchBarUnderlined should render correctly with value 1`] = `
background-color: rgba(0,0,0,0);
}
.c1 {
.c1 > input {
background-color: inherit;
border-color: transparent;
}
.c1:focus,
.c1:active {
.c1 > input:focus,
.c1 > input:active {
box-shadow: none !important;
}
Expand Down Expand Up @@ -1212,13 +1212,13 @@ exports[`SearchBarUnderlined should render correctly with width 1`] = `
background-color: rgba(0,0,0,0);
}
.c1 {
.c1 > input {
background-color: inherit;
border-color: transparent;
}
.c1:focus,
.c1:active {
.c1 > input:focus,
.c1 > input:active {
box-shadow: none !important;
}
Expand Down

0 comments on commit 61b2545

Please sign in to comment.