New signup

zubhub_frontend/zubhub/src/assets/js/styles/components/button/buttonStyles.js

@@ -3,8 +3,12 @@ import { colors } from "../../../colors";
 const styles = theme => ({
   primaryButtonStyle: {
     backgroundColor: 'var(--primary-color3)',
-    borderRadius: 30,
+    borderRadius: theme.spacing(1),
     color: 'white',
+    '&.disabled': {
+      color: '#7BA8AB',
+      background: 'rgba(0, 184, 196, 0.10)',
+    },
     '&:hover': {
       backgroundColor: 'var(--secondary-color6)',
     },

zubhub_frontend/zubhub/src/components/Navbar/Navbar.jsx

@@ -76,6 +76,8 @@ function NavBar(props) {
   const [searchType, setSearchType] = useState(getQueryParams(window.location.href).get('type') || SearchType.PROJECTS);
   const formRef = useRef();
   const token = useSelector(state => state.auth.token);
+  const pathname = props.location?.pathname
+  const hideSearchAndActions = pathname === '/signup' || pathname === '/login';
 
   const [state, setState] = React.useState({
     username: null,
@@ -215,11 +217,14 @@ function NavBar(props) {
       <AppBar className={classes.navBarStyle}>
         <Container id="navbar-root" className={classes.mainContainerStyle}>
           <Toolbar className={classes.toolBarStyle}>
-            <Hidden mdUp>
-              <Box style={{ marginRight: 10 }} onClick={toggleDrawer}>
-                <MenuIcon />
-              </Box>
-            </Hidden>
+            {!hideSearchAndActions && (
+              <Hidden mdUp>
+                <Box style={{ marginRight: 10 }} onClick={toggleDrawer}>
+                  <MenuIcon />
+                </Box>
+              </Hidden>
+            )}
+
             <Box className={classes.logoStyle}>
               <Link to="/">
                 <img src={zubhub?.header_logo_url ? zubhub.header_logo_url : logo} alt="logo" />
@@ -335,24 +340,25 @@ function NavBar(props) {
                 </FormControl>
               </form>
             </Box>
-            <div className={classes.navActionStyle}>
-              <SearchOutlined onClick={toggleSearchBar} className={classes.addOn894} />
-
-              <NotificationButton />
-              <Hidden smDown>
-                {props.auth.username && (
-                  <Box>
-                    <Typography className={clsx(common_classes.title2, classes.username)}>
-                      {props.auth.username}
-                    </Typography>
-                    {/* Todo: Change this subheading based on current role of user */}
-                    <Typography className="">Creator</Typography>
-                  </Box>
-                )}
-              </Hidden>
-
+            {!hideSearchAndActions && (
+              <div className={classes.navActionStyle}>
+                <SearchOutlined onClick={toggleSearchBar} className={classes.addOn894} />
+
+                <NotificationButton />
+                <Hidden smDown>
+                  {props.auth.username && (
+                    <Box>
+                      <Typography className={clsx(common_classes.title2, classes.username)}>
+                        {props.auth.username}
+                      </Typography>
+                      {/* Todo: Change this subheading based on current role of user */}
+                      <Typography className="">Creator</Typography>
+                    </Box>
+                  )}
+                </Hidden>
               <AvatarButton navigate={props.navigate} />
             </div>
+            )}
           </Toolbar>
           {open_search_form ? (
             <ClickAwayListener onClickAway={e => handleSetState(closeSearchFormOrIgnore(e))}>
@@ -455,4 +461,4 @@ const mapDispatchToProps = dispatch => {
   };
 };
 
-export default connect(mapStateToProps, mapDispatchToProps)(NavBar);
+export default connect(mapStateToProps, mapDispatchToProps)(NavBar);

zubhub_frontend/zubhub/src/components/form/errorMessage/ErrorMessage.jsx

@@ -0,0 +1,9 @@
+import { FormHelperText } from '@mui/material';
+import React from 'react';
+
+const CustomErrorMessage = props => {
+  const { name, touched, errors } = props;
+  return <FormHelperText error>{touched[name] && errors[name] && <>{errors[name]}</>}</FormHelperText>;
+};
+
+export default CustomErrorMessage;

zubhub_frontend/zubhub/src/components/index.js

@@ -15,16 +15,27 @@ import Modal from "./modals/Modal";
 import PreviewActivity from "./previewActivity/PreviewActivity";
 import PreviewProject from "./previewProject/PreviewProject";
 import Pill from "./pill/Pill";
+import CustomErrorMessage from './form/errorMessage/ErrorMessage';
 import ProtectedRoute from './protected_route/ProtectedRoute';
 
 export {
-    Comments,
-    CustomButton, Dropdown,
-    Editor, Gallery, ImageInput,
-    LabeledLine, Modal, OrDivider, PreviewProject,
-    SelectFromPills, Sidenav, TagsInput, VideoInput,
-    Collapsible,
-    PreviewActivity,
-    Pill,
-    ProtectedRoute,
+  Comments,
+  CustomButton,
+  Dropdown,
+  Editor,
+  Gallery,
+  ImageInput,
+  LabeledLine,
+  Modal,
+  OrDivider,
+  PreviewProject,
+  SelectFromPills,
+  Sidenav,
+  TagsInput,
+  VideoInput,
+  Collapsible,
+  PreviewActivity,
+  Pill,
+  ProtectedRoute,
+  CustomErrorMessage,
 };