New login and signup #1117
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,127 +1,188 @@ | ||
| export const mainStyles = theme => ({ | ||
| wrapper: { | ||
| marginTop: theme.spacing(10), | ||
| [theme.breakpoints.down('lg')]: { | ||
| marginTop: theme.spacing(10), | ||
| }, | ||
| [theme.breakpoints.down('md')]: { | ||
| marginTop: theme.spacing(5), | ||
| }, | ||
| }, | ||
| gridContainer: { | ||
| alignItems: 'center', | ||
| borderRadius: theme.spacing(1), | ||
| }, | ||
| header: { | ||
| color: theme.palette.text.primary, | ||
| fontSize: theme.spacing(5), | ||
| fontWeight: 800, | ||
| lineHeight: '50px', | ||
| [theme.breakpoints.down('sm')]: { | ||
| lineHeight: 'unset', | ||
| fontSize: '15px', | ||
| }, | ||
| }, | ||
| subHeader: { | ||
| color: theme.palette.text.primary, | ||
| fontSize: theme.spacing(3), | ||
| fontWeight: 800, | ||
| lineHeight: 'normal', | ||
| [theme.breakpoints.down('sm')]: { | ||
| fontSize: '18px', | ||
| fontWeight: 700, | ||
| }, | ||
| }, | ||
| text: { | ||
| fontSize: theme.spacing(2), | ||
| fontWeight: 400, | ||
| lineHeight: '32px', | ||
| color: theme.palette.text.secondary, | ||
| [theme.breakpoints.down('sm')]: { | ||
| fontSize: '12px', | ||
| lineHeight: 'unset', | ||
| }, | ||
| }, | ||
| header2: { | ||
| color: theme.palette.text.primary, | ||
| fontSize: '30px', | ||
| fontWeight: 700, | ||
| lineHeight: '50px', | ||
| }, | ||
| subHeader2: { | ||
| color: theme.palette.text.primary, | ||
| fontSize: '18px', | ||
| fontWeight: 600, | ||
| lineHeight: '24px', | ||
| }, | ||
| text2: { | ||
| marginBottom: '40px' | ||
| }, | ||
| wizard: { | ||
| width: '100%', | ||
| }, | ||
| outlinedInput: { | ||
| borderRadius: theme.spacing(1), | ||
| paddingInline: theme.spacing(3), | ||
| gap: theme.spacing(3), | ||
| '& .MuiOutlinedInput-input': { | ||
| padding: '20px 0', | ||
| }, | ||
| '&.MuiOutlinedInput-root': { | ||
| '&:hover fieldset': { | ||
| border: `1px solid ${theme.palette.primary.light}`, | ||
| }, | ||
| '&.Mui-focused fieldset': { | ||
| border: `2px solid ${theme.palette.primary.light}`, | ||
| }, | ||
| }, | ||
| }, | ||
| formControl: { | ||
| gap: theme.spacing(3), | ||
| [theme.breakpoints.down('md')]: { | ||
| gap: theme.spacing(2), | ||
| }, | ||
| [theme.breakpoints.down('sm')]: { | ||
| gap: theme.spacing(1), | ||
| }, | ||
| }, | ||
| inputIcon: { | ||
| fontSize: theme.spacing(3), | ||
| fill: theme.palette.grey[400], | ||
| }, | ||
| button: { | ||
| fontSize: '18px', | ||
| fontWeight: 600, | ||
| paddingBlock: '20px', | ||
| [theme.breakpoints.down('sm')]: { | ||
| fontSize: '12px', | ||
| padding: '5px 16px', | ||
| }, | ||
| }, | ||
| spaceBackground: { | ||
| width: '100%', | ||
| height: '100%', | ||
| }, | ||
| backContainer: { | ||
| borderRadius: '50%', | ||
| background: theme.palette.background.default, | ||
| padding: '10px', | ||
| }, | ||
| backIcon: { | ||
| fontSize: theme.spacing(3), | ||
| }, | ||
| gridControl: { | ||
| background: theme.palette.background.default, | ||
| padding: '0 40px', | ||
| boxShadow: '2px 4px 5px 0px rgba(0, 184, 196, 0.05)', | ||
| }, | ||
| }); | ||
|
|
||
| export const step1Styles = theme => ({ | ||
| paper: { | ||
|
There was a problem hiding this comment. step1Styles, step2Styles, step3Styles, step4Styles, step5Styles, should all be inside the styles. These are just form fields and they are to be in the same place |
||
| cursor: 'pointer', | ||
| width: '350px', | ||
| height: '300px', | ||
| borderRadius: theme.spacing(1), | ||
| display: 'flex', | ||
| flexDirection: 'column', | ||
| alignItems: 'center', | ||
| gap: theme.spacing(2), | ||
| justifyContent: 'center', | ||
| [theme.breakpoints.down('sm')]: { | ||
| padding: theme.spacing(2, 3), | ||
| width: '342px', | ||
| height: '124px', | ||
| alignItems: 'unset', | ||
| }, | ||
| '&.selected': { | ||
| border: '3px solid var(--primary-color3)', | ||
| }, | ||
| }, | ||
| icon: { | ||
| fill: '#00B8C4', | ||
| fontSize: '64px', | ||
| [theme.breakpoints.down('sm')]: { | ||
| fontSize: 'unset', | ||
| height: '32px', | ||
| width: '32px', | ||
| }, | ||
| }, | ||
| }); | ||
|
|
||
| export const step2Styles = theme => ({ | ||
| container: { | ||
| background: theme.palette.background.paper, | ||
| borderRadius: theme.spacing(1), | ||
| padding: theme.spacing(8, 5), | ||
| boxShadow: '2px 4px 5px 0px rgba(0, 184, 196, 0.05)', | ||
| }, | ||
| }); | ||
|
|
||
| export const step3Styles = theme => ({}); | ||
|
|
||
| export const step4Styles = theme => ({}); | ||
| export const step5Styles = theme => ({ | ||
| label: { | ||
| gap: theme.spacing(3), | ||
| }, | ||
| formControl: { | ||
| display: 'flex', | ||
| flexDirection: 'column', | ||
| gap: theme.spacing(5), | ||
| alignItems: 'left', | ||
| }, | ||
| fieldSet: { | ||
| padding: `20px ${theme.spacing(3)}`, | ||
| borderWidth: '1px', | ||
| borderColor: theme.palette.grey[300], | ||
| borderStyle: 'solid', | ||
| borderRadius: theme.spacing(1), | ||
| '&:hover': { | ||
| borderColor: theme.palette.primary.light, | ||
| }, | ||
| '&.selected': { | ||
| borderWidth: '3px', | ||
| borderColor: theme.palette.primary.light, | ||
| }, | ||
| }, | ||
| }); | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -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'; | ||
|
There was a problem hiding this comment. @coderatomy is this part of the requirements? I think a user should be allowed access to the search box even in the signup page (since are user can search for things while not logged in) |
||
|
|
||
| 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}> | ||
| {!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" /> | ||
|
|
@@ -268,6 +273,8 @@ function NavBar(props) { | |
| ))} | ||
| </Select> | ||
| </Box> | ||
| { | ||
| !hideSearchAndActions && ( | ||
| <form | ||
| action="/search" | ||
| className={clsx(classes.searchFormStyle, classes.removeOn894)} | ||
|
|
@@ -334,25 +341,28 @@ function NavBar(props) { | |
| </FormGroup> | ||
| </FormControl> | ||
| </form> | ||
| ) | ||
| } | ||
| </Box> | ||
| {!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 +465,4 @@ const mapDispatchToProps = dispatch => { | |
| }; | ||
| }; | ||
|
|
||
| export default connect(mapStateToProps, mapDispatchToProps)(NavBar); | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -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; |
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
why is this now
mainStyles? we should revert back tostyles. This only serves to add more diff and doesn't improve the code in any way