@@ -25,12 +25,12 @@ const Header = (props) => {
2525
2626 const handleSortByStars = ( ) => {
2727 props . setSortByForks ( "" ) ;
28- if ( props . sortByStars == "desc" ) props . setSortByStars ( "asc" ) ;
28+ if ( props . sortByStars === "desc" ) props . setSortByStars ( "asc" ) ;
2929 else props . setSortByStars ( "desc" ) ;
3030 } ;
3131 const handleSortByForks = ( ) => {
3232 props . setSortByStars ( "" ) ;
33- if ( props . sortByForks == "desc" ) props . setSortByForks ( "asc" ) ;
33+ if ( props . sortByForks === "desc" ) props . setSortByForks ( "asc" ) ;
3434 else props . setSortByForks ( "desc" ) ;
3535 } ;
3636
@@ -39,42 +39,36 @@ const Header = (props) => {
3939 < Navbar bg = { theme . mode } variant = { theme . mode } expand = "lg" >
4040 < Navbar . Brand href = "#home" > Find Me Issues</ Navbar . Brand >
4141 { theme . mode === "light" ? (
42- < Button onClick = { changeTheme } >
42+ < Button onClick = { changeTheme } size = "sm" >
4343 < i className = "fa fa-moon-o" aria-hidden = "true" > </ i >
4444 </ Button >
4545 ) : (
46- < Button onClick = { changeTheme } >
46+ < Button onClick = { changeTheme } size = "sm" >
4747 < i className = "fa fa-sun-o" aria-hidden = "true" > </ i >
4848 </ Button >
4949 ) }
5050 < Nav className = "mr-auto" > </ Nav >
5151
52- < button
52+ < Button size = "sm"
5353 style = { {
54- margin : "3px" ,
55- borderRadius : "5px" ,
56- backgroundColor : "blue" ,
57- color : "white" ,
54+ margin : "0px 3px" ,
5855 } }
5956 onClick = { handleSortByStars }
6057 >
61- sort by stars
62- </ button >
63- < button
58+ Sort by stars
59+ </ Button >
60+ < Button size = "sm"
6461 style = { {
65- margin : "3px" ,
66- borderRadius : "5px" ,
67- backgroundColor : "blue" ,
68- color : "white" ,
62+ margin : "0px 3px" ,
6963 } }
7064 onClick = { handleSortByForks }
7165 >
72- sort by forks
73- </ button >
66+ Sort by forks
67+ </ Button >
7468
7569 < Form inline >
7670 < label className = "mr-sm-3" >
77- < span > Find specific content in the project description</ span >
71+ < span className = "ml-2 mr-1" > Find specific content in the project description: </ span >
7872 < input
7973 type = "text"
8074 value = { inputSearch }
@@ -103,6 +97,7 @@ const Header = (props) => {
10397 } ) }
10498 </ div >
10599 </ NavDropdown >
100+
106101 </ Form >
107102 </ Navbar >
108103 </ div >
0 commit comments