Add logo link in header + footer

src/components/footer/index.js

@@ -16,9 +16,8 @@ class Footer extends React.Component {
         return (
             <div className="footer-container">
                 <div className="link-logo">
-                    <div className="inner-logo" dangerouslySetInnerHTML={{__html: BquestLogo}} />
-                    {this.props.isLoggedIn && <p onClick={() => this.navigate("home")}>BQUEST</p>}
-                    {!this.props.isLoggedIn && <p onClick={() => this.navigate("")}>BQUEST</p>}
+                    <p onClick={() => this.navigate(this.props.isLoggedIn ? "home" : "")} className="inner-logo" dangerouslySetInnerHTML={{__html: BquestLogo}}></p>
+                    <p onClick={() => this.navigate(this.props.isLoggedIn ? "home" : "")}>BQUEST</p>
                 </div>
                 <div className="between-link">
                     <p>/</p>

src/components/navbar/index.js

@@ -2,8 +2,7 @@ import React from 'react';
 import classNames from 'classnames';
 import { connect } from 'react-redux';
 import { push } from 'react-router-redux';
-
-import BquestLogo from '../../../images/loginPage/white-bquest-logo.svg.inline';
+import Logo from '../util/Logo';
 
 class NavBar extends React.Component {
 
@@ -18,9 +17,7 @@ class NavBar extends React.Component {
         return(
             <div>
                 <div className="navbar-container">
-                    <div className="logo">
-                        <div className="logo-logo" dangerouslySetInnerHTML={{__html: BquestLogo}} />
-                    </div>
+                    <Logo color="small-white" LoggedIn={true} />
                     <div className="buttons">
                         <div className="navigation-item">
                             <p onClick={() => this.navigate("home")} className={classNames({selected: location.startsWith("home")})}>Home</p>

src/components/pages/forget-password/email-pending.js

@@ -1,16 +1,12 @@
 import React from 'react';
-import newBquest from '../../../../images/loginPage/white-bquest.svg.inline'
-import newBquestLogo from '../../../../images/loginPage/white-bquest-logo.svg.inline'
+import Logo from '../../util/Logo';
 import Footer from '../../../components/footer';
 
 class ForgetPasswordPending extends React.Component {
     render() {
         return (
             <div className="container-login">
-                <div className="logo">
-                    <div className="logo-logo" dangerouslySetInnerHTML={{__html: newBquestLogo}} />
-                    <div className="logo-text" dangerouslySetInnerHTML={{__html: newBquest}} />
-                </div>
+                <Logo color="white" LoggedIn={false} />
                 <div className="container-pending">
                     <h1 className="loginform-title">Email Sent! Check your email :)</h1>
                 </div>

src/components/pages/forget-password/index.js

@@ -1,17 +1,13 @@
 import React from 'react';
-import newBquest from '../../../../images/loginPage/white-bquest.svg.inline'
-import newBquestLogo from '../../../../images/loginPage/white-bquest-logo.svg.inline'
 import Footer from '../../../components/footer';
+import Logo from '../../util/Logo';
 import Form from '../../util/ForgetPasswordForm';
 
 class ForgetPassword extends React.Component {
     render() {
         return (
             <div className="container-login">
-                <div className="logo">
-                    <div className="logo-logo" dangerouslySetInnerHTML={{__html: newBquestLogo}} />
-                    <div className="logo-text" dangerouslySetInnerHTML={{__html: newBquest}} />
-                </div>
+                <Logo color="white" LoggedIn={false} />
                 <div className="container-password-reset">
                     <h1 className="password-reset-title">Password Reset</h1>
                     <p>We'll send a password reset link to your email.</p>

src/components/pages/home/topBar/index.js

@@ -1,21 +1,14 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
-
-import newBquestLogo from '../../../../../images/loginPage/teal-bquest-logo.svg.inline';
-import newBquest from '../../../../../images/loginPage/teal-bquest.svg.inline';
+import Logo from '../../../util/Logo';
 
 export default (props) => {
     return (
         <section className="top-bar">
-            <div className="logo">
-                <div className="logo-logo" dangerouslySetInnerHTML={{__html: newBquestLogo}} />
-                <div className="logo-text" dangerouslySetInnerHTML={{__html: newBquest}} />
-            </div>
+            <Logo color="teal" LoggedIn={props.isLoggedIn} />
             <div className="nav-buttons">
                 <Link id="login" to="/login">Login</Link>
                 <Link id="signup" to="/register">Sign Up</Link>
-                {/*<div id="login" onClick={() => location.href="/login"}>Login</div>*/}
-                {/*<div id="signup" onClick={() => location.href="/register"}>Sign Up</div>*/}
             </div>
         </section>
     );

src/components/pages/login/index.js

@@ -1,18 +1,14 @@
 import React from 'react';
 import Form from 'components/util/LoginRegisterForm';
-import newBquest from '../../../../images/loginPage/white-bquest.svg.inline'
-import newBquestLogo from '../../../../images/loginPage/white-bquest-logo.svg.inline'
+import Logo from '../../util/Logo';
 import Footer from '../../../components/footer';
 
 class Login extends React.Component {
 
     render() {
         return(
             <div className="container-login">
-                <div className="logo">
-                    <div className="logo-logo" dangerouslySetInnerHTML={{__html: newBquestLogo}} />
-                    <div className="logo-text" dangerouslySetInnerHTML={{__html: newBquest}} />
-                </div>
+                <Logo color="white" LoggedIn={false} />
                 <div className="container-loginform">
                     <h1 className="loginform-title">Login</h1>
                     <Form action={this.props.login} buttonText="Log In"/>

src/components/pages/onboarding/index.js

@@ -49,7 +49,7 @@ class Onboarding extends React.Component {
                             <br /><br />
                             <span>Feel free to skip this and explore on your own if you wish by</span>
                             <br />
-                            <span>clicking on the green button at the bottom left corner.</span>
+                            <span>clicking on the green button below.</span>
                             <br />
                         </div>
                         <div className="each-slide">
@@ -189,9 +189,9 @@ class Onboarding extends React.Component {
                             <br />
                         </div>
                     </Slide>
-                </div>
-                <div className="onboarding-button">
-                    <Button onClick={() => this.props.history.push("/home")} color="green">I'm good, let me explore!</Button>
+                    <div className="onboarding-button">
+		                <Button onClick={() => this.props.history.push("/home")} color="green">I'm good, let me explore!</Button>
+		            </div>
                 </div>
             </div>
         );

src/components/pages/onboarding/style.scss

@@ -51,7 +51,7 @@ img {
 }
 
 .onboarding-button {
-    width: 80%;
     display: flex;
-    justify-content: flex-end;
+    justify-content: center;
+    margin-top: 10px;
 }

src/components/pages/profile/ambassadorProfile.js

@@ -97,28 +97,34 @@ class AmbassadorProfile extends React.Component {
         this.state = {
             classesOpen: false,
             bio: props.mentor.bio,
+            grad: props.mentor.grad,
+            quarter: props.mentor.quarter,
             // major: props.mentor.major || {name: ''},
             // minor: props.mentor.minor || {name: ''},
             major: props.mentor.major || [],
             minor: props.mentor.minor || [],
             majorDisplayLength: props.mentor.major ? props.mentor.major.length : 0,
             minorDisplayLength: props.mentor.minor ? props.mentor.minor.length : 0,
-            courses: props.mentor.courses ? props.mentor.courses.map(obj => obj.name) : []
+            courses: props.mentor.courses ? props.mentor.courses.map(obj => obj.name) : [],
+            work: props.mentor.work || []
         }
     }
 
     componentWillReceiveProps(nextProps) {
         let {
             major: currMajor,
             minor: currMinor,
+            work: currWork,
         } = this.state;
 
         let {
             major: nextMajor,
             minor: nextMinor,
+            work: nextWork,
         } = nextProps.mentor;
         nextMajor = nextMajor || []; // avoid undefined
         nextMinor = nextMinor || []; // avoid undefined
+        nextWork = nextWork || [];
 
         // The following lines are considered a hack
         // (as it is based on the assumption: when currMajor.length > nextMajor.length, the user must be editing other fields while not selecting the yet to select major)
@@ -137,6 +143,7 @@ class AmbassadorProfile extends React.Component {
             bio: nextProps.mentor.bio,
             // major: nextProps.mentor.major,
             // minor: nextProps.mentor.minor || {name: ''},
+            quarter: nextProps.mentor.quarter,
             major: relativeSortAndMerge(currMajor, nextMajor, e => e.name, n => { return { name: n }; }),
             minor: relativeSortAndMerge(currMinor, nextMinor, e => e.name, n => { return { name: n }; }),
             courses: nextProps.mentor.courses.map(obj => obj.name)
@@ -251,6 +258,82 @@ class AmbassadorProfile extends React.Component {
         );
     }
 
+    renderGrad = () => {
+    	return (
+    		<InputGroup>
+    			<Input 
+    			type="select" 
+    			name="quarter" 
+    			id="quarter" 
+    			className="rounded"
+    			style={{marginRight: '10px', flex: '0 0 7.5em'}}
+    			value={this.state.quarter}
+                onChange={e => this.setState({quarter: e.target.value})}>
+                    <option value="Spring">Spring</option>
+	                <option value="Fall">Fall</option>
+	                <option value="Winter">Winter</option>
+	            </Input>
+	        	<Input name="grad-year" id="grad-year" className="rounded" style={{flex: '0 0 10em'}} placeholder="Enter Year" onChange={e => this.setState({grad: e.target.value})} value={this.state.grad}/>  
+    		</InputGroup>
+
+    	);
+    }
+
+    renderSingleWork = (position, company, start, end, index) => {
+        return (
+            // Implement value storage and update for each field once backend finishes up
+            // Yes, I know the inline CSS is terrible. It will be cleaned in another commit I promise :)
+            <div style={{borderStyle: 'solid', borderWidth: '1px', borderRadius: '.25rem', borderColor: 'lightgray', marginTop: '10px', marginBottom: '10px'}}>
+                <InputGroup style={{margin: '10px', flexWrap: 'wrap'}}>    
+                    <Input name="work-position" id="work-position" className="rounded" style={{marginRight: '10px', flex: '0 0 15em'}} placeholder="Position" onChange={null}/>  
+                    <Input name="work-company" id="work-company" className="rounded" style={{marginLeft: '10px', flex: '0 0 20em'}} placeholder="Company" onChange={null}/>  
+                </InputGroup>
+                <InputGroup style={{margin: '10px', flexWrap: 'wrap'}}>
+                    <Input name="start-year" id="start-year" className="rounded" style={{marginRight: '10px', flex: '0 0 15em'}} placeholder="Start Year" onChange={null}/>  
+                    <Input name="end-year" id="end-year" className="rounded" style={{marginLeft: '10px', marginRight: '10px', flex: '0 0 10em'}} placeholder="End Year" onChange={null}/>
+                    <Label check style={{paddingTop: '5px'}}>
+                      <Input type="checkbox" />{' '}
+                      Check if current position
+                    </Label>
+                </InputGroup>
+                <InputGroup style={{margin: '10px'}}>
+                    <Button size="sm" className="add" style={{marginRight: '5px'}} onClick={null}>Save Experience</Button>
+                    <Button size="sm" className="remove" onClick={() => {this._deleteWork(index);}}>Delete Entry</Button>
+                </InputGroup>
+            </div>
+        );
+    }
+
+    renderWork = () => {
+
+        const {
+            work: currWork,
+        } = this.state;
+
+        let displayList = currWork.map((e, i) => this.renderSingleWork(e.position || '', e.company || '', e.start || '', e.end || '', i));
+
+        return (
+            <div>
+                {displayList}
+                <Button className="add" onClick={() => {
+                    let newWork = currWork.slice();
+                    newWork.push({position: '', company: '', start: '', end: ''});
+                    this.setState({ work: newWork });
+                }}>Add Work Experience</Button>
+            </div>
+        );
+    }
+
+    _deleteWork = (index) => {
+        const {
+            work: currWork,
+        } = this.state;
+
+        currWork.splice(index,1);
+        this.setState({ work: currWork });
+        // Make sure to implement update profile for backend
+    }
+
     _updateMajor = (majorName, index) => {
         const {
             major: currMajor,
@@ -443,6 +526,10 @@ class AmbassadorProfile extends React.Component {
                                 <Label>Minor</Label>
                                 {this.renderMinor()}
                             </FormGroup>
+                            <FormGroup className="grad">
+                                <Label>Anticipated Graduation</Label>
+                                {this.renderGrad()}
+                            </FormGroup>
                             <FormGroup className="bio">
                                 <Label>Bio</Label>
                                 {this.renderBio()}
@@ -451,6 +538,10 @@ class AmbassadorProfile extends React.Component {
                                 <Label>Classes Taken</Label>
                                 {this.renderClasses()}
                             </FormGroup>
+                            <FormGroup className="work">
+                                <Label>Work History</Label>
+                                {this.renderWork()}
+                            </FormGroup>
                             <div>
                                 <div className="cancel" onClick={() => this.props.updateMentorStatus(false)}>I am no longer available</div>
                             </div>

src/components/pages/register/index.js

@@ -1,8 +1,7 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 import Form from 'components/util/LoginRegisterForm';
-import newBquest from '../../../../images/loginPage/white-bquest.svg.inline'
-import newBquestLogo from '../../../../images/loginPage/white-bquest-logo.svg.inline'
+import Logo from '../../util/Logo';
 import Footer from '../../footer';
 
 import Loader from '../../loading';
@@ -17,10 +16,7 @@ class Register extends React.Component {
     render() {
         return (
             <div className="container-register">
-                <div className="logo">
-                    <div className="logo-logo" dangerouslySetInnerHTML={{__html: newBquestLogo}} />
-                    <div className="logo-text" dangerouslySetInnerHTML={{__html: newBquest}} />
-                </div>
+                <Logo color="white" LoggedIn={false} />
                 <section className="register-splash">
                     <div className="register-text">
                         <h1>Connect with students on all your major-related questions.</h1>

src/components/pages/reset-password/index.js

@@ -1,17 +1,13 @@
 import React from 'react';
-import newBquest from '../../../../images/loginPage/white-bquest.svg.inline'
-import newBquestLogo from '../../../../images/loginPage/white-bquest-logo.svg.inline'
 import Footer from '../../../components/footer';
 import Form from '../../util/ResetPasswordForm';
+import Logo from '../../util/Logo';
 
 class ResetPassword extends React.Component {
     render() {
         return (
             <div className="container-login">
-                <div className="logo">
-                    <div className="logo-logo" dangerouslySetInnerHTML={{__html: newBquestLogo}} />
-                    <div className="logo-text" dangerouslySetInnerHTML={{__html: newBquest}} />
-                </div>
+                <Logo color="white" LoggedIn={false} />
                 <div className="container-password-reset">
                     <h1 className="password-reset-title">Password Reset</h1>
                     <Form action={this.props.resetPassword} buttonText="Reset"/>

src/components/util/Logo/index.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import whiteBquest from '../../../../images/loginPage/white-bquest.svg.inline';
+import whiteBquestLogo from '../../../../images/loginPage/white-bquest-logo.svg.inline';
+import tealBquestLogo from '../../../../images/loginPage/teal-bquest-logo.svg.inline';
+import tealBquest from '../../../../images/loginPage/teal-bquest.svg.inline';
+
+class Logo extends React.Component {
+	render() {
+	    return (
+	    	<div>
+		    	{(this.props.color === "teal") && 
+		    	<div className="logo" onClick={() => location.href=(this.props.LoggedIn ? "/home" : "/")} style={{cursor:'pointer'}}>
+		            <div className="logo-logo" dangerouslySetInnerHTML={{__html: tealBquestLogo}} />
+		            <div className="logo-text" dangerouslySetInnerHTML={{__html: tealBquest}} />
+		        </div>
+		    	}
+		        {(this.props.color === "white") && 
+		        <div className="logo" onClick={() => location.href=(this.props.LoggedIn ? "/home" : "/")} style={{cursor:'pointer'}}>
+		            <div className="logo-logo" dangerouslySetInnerHTML={{__html: whiteBquestLogo}} />
+		            <div className="logo-text" dangerouslySetInnerHTML={{__html: whiteBquest}} />
+		        </div>
+		    	}
+		    	{(this.props.color === "small-white") &&
+		    	<div className="logo" onClick={() => location.href=(this.props.LoggedIn ? "/home" : "/")} style={{cursor:'pointer'}}>
+		            <div className="logo-logo" dangerouslySetInnerHTML={{__html: whiteBquestLogo}} />
+		        </div>
+		    	}
+			</div>
+	    );
+	}
+}
+
+export default Logo;