Removed outline for input style/ moved style class to SearchInput

Seneca-CDOT · Nov 19, 2020 · 7224af8 · 7224af8
1 parent 1abf6a2
commit 7224af8
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 58 deletions.
diff --git a/src/frontend/src/components/SearchInput/AuthorSearchInput.jsx b/src/frontend/src/components/SearchInput/AuthorSearchInput.jsx
@@ -1,50 +1,39 @@
 import React from 'react';
 <<<<<<< HEAD
+<<<<<<< HEAD
 import PropTypes from 'prop-types';
 
 function AuthorSearchInput(props) {
   const { text, onChange, useStyles } = props;
 =======
 import { makeStyles } from '@material-ui/core/styles';
+=======
+>>>>>>> Removed outline for input style/ moved style class to SearchInput
 import PropTypes from 'prop-types';
 
-const useStyles = makeStyles((theme) => ({
-  input: {
-    fontSize: '1.6rem',
-    '&:hover': {
-      border: '2px solid',
-      borderColor: theme.palette.background.default,
-    },
-    '&:focus': {
-      border: '2px solid',
-      borderColor: theme.palette.primary.main,
-    },
-    '& > *': {
-      fontSize: '1.6rem !important',
-      color: theme.palette.text.default,
-    },
-    height: '55px',
-    backgroundColor: theme.palette.background.default,
-    paddingLeft: '10px',
-    border: '1px solid #B3B6B7',
-    borderRadius: '7px',
-  },
-}));
-
 function AuthorSearchInput(props) {
+<<<<<<< HEAD
   const { text, onChange } = props;
 >>>>>>> Moved both AuthorSearchInput and PostSearchInput to there own files
+=======
+  const { text, onChange, useStyles } = props;
+>>>>>>> Removed outline for input style/ moved style class to SearchInput
   const classes = useStyles();
   return (
     <>
       <input
+<<<<<<< HEAD
 <<<<<<< HEAD
         className={classes.input}
         list="search-suggestions"
 =======
         list="search-suggestions"
         className={classes.input}
 >>>>>>> Moved both AuthorSearchInput and PostSearchInput to there own files
+=======
+        className={classes.input}
+        list="search-suggestions"
+>>>>>>> Removed outline for input style/ moved style class to SearchInput
         placeholder="How to Get Started in Open Source"
         inputProps={{ 'aria-label': 'search telescope' }}
         value={text}
@@ -58,10 +47,14 @@ function AuthorSearchInput(props) {
 AuthorSearchInput.propTypes = {
   text: PropTypes.string,
   onChange: PropTypes.func,
+<<<<<<< HEAD
 <<<<<<< HEAD
   useStyles: PropTypes.func,
 =======
 >>>>>>> Moved both AuthorSearchInput and PostSearchInput to there own files
+=======
+  useStyles: PropTypes.func,
+>>>>>>> Removed outline for input style/ moved style class to SearchInput
 };
 
 export default AuthorSearchInput;
diff --git a/src/frontend/src/components/SearchInput/PostSearchInput.jsx b/src/frontend/src/components/SearchInput/PostSearchInput.jsx
@@ -1,39 +1,8 @@
 import React from 'react';
-<<<<<<< HEAD
 import PropTypes from 'prop-types';
 
 function PostSearchInput(props) {
   const { text, onChange, useStyles } = props;
-=======
-import { makeStyles } from '@material-ui/core/styles';
-import PropTypes from 'prop-types';
-
-const useStyles = makeStyles((theme) => ({
-  input: {
-    fontSize: '1.6rem',
-    '&:hover': {
-      border: '2px solid',
-      borderColor: theme.palette.background.default,
-    },
-    '&:focus': {
-      border: '2px solid',
-      borderColor: theme.palette.primary.main,
-    },
-    '& > *': {
-      fontSize: '1.6rem !important',
-      color: theme.palette.text.default,
-    },
-    height: '55px',
-    backgroundColor: theme.palette.background.default,
-    paddingLeft: '10px',
-    border: '1px solid #B3B6B7',
-    borderRadius: '7px',
-  },
-}));
-
-function PostSearchInput(props) {
-  const { text, onChange } = props;
->>>>>>> Moved both AuthorSearchInput and PostSearchInput to there own files
   const classes = useStyles();
   return (
     <input
@@ -49,10 +18,7 @@ function PostSearchInput(props) {
 PostSearchInput.propTypes = {
   text: PropTypes.string,
   onChange: PropTypes.func,
-<<<<<<< HEAD
   useStyles: PropTypes.func,
-=======
->>>>>>> Moved both AuthorSearchInput and PostSearchInput to there own files
 };
 
 export default PostSearchInput;
diff --git a/src/frontend/src/components/SearchInput/SearchInput.jsx b/src/frontend/src/components/SearchInput/SearchInput.jsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 <<<<<<< HEAD
+<<<<<<< HEAD
 import { makeStyles } from '@material-ui/core/styles';
 import PostSearchInput from './PostSearchInput.jsx';
 import AuthorSearchInput from './AuthorSearchInput.jsx';
@@ -52,16 +53,55 @@ function SearchInput(props) {
       onChange={(event) => onChange(event.target.value)}
     />
 =======
+=======
+import { makeStyles } from '@material-ui/core/styles';
+>>>>>>> Removed outline for input style/ moved style class to SearchInput
 import PostSearchInput from './PostSearchInput.jsx';
 import AuthorSearchInput from './AuthorSearchInput.jsx';
 
+const useStyles = makeStyles((theme) => ({
+  input: {
+    fontSize: '1.6rem',
+    '&:hover': {
+      border: '2px solid',
+      borderColor: theme.palette.background.default,
+    },
+    '&:focus': {
+      border: '2px solid',
+      borderColor: theme.palette.primary.main,
+    },
+    '& > *': {
+      fontSize: '1.6rem !important',
+      color: theme.palette.text.default,
+    },
+    height: '55px',
+    backgroundColor: theme.palette.background.default,
+    paddingLeft: '10px',
+    border: '1px solid #B3B6B7',
+    borderRadius: '7px',
+    outline: 'none',
+  },
+}));
+
 function SearchInput(props) {
   const { text, filter, onChange } = props;
   return filter === 'author' ? (
-    <AuthorSearchInput value={text} onChange={(event) => onChange(event.target.value)} />
+    <AuthorSearchInput
+      useStyles={useStyles}
+      value={text}
+      onChange={(event) => onChange(event.target.value)}
+    />
   ) : (
+<<<<<<< HEAD
     <PostSearchInput value={text} onChange={(event) => onChange(event.target.value)} />
 >>>>>>> Moved both AuthorSearchInput and PostSearchInput to there own files
+=======
+    <PostSearchInput
+      useStyles={useStyles}
+      value={text}
+      onChange={(event) => onChange(event.target.value)}
+    />
+>>>>>>> Removed outline for input style/ moved style class to SearchInput
   );
 }