-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #4 from asusoda/Luan-Navbar
Add changes to Navbar
- Loading branch information
Showing
5 changed files
with
147 additions
and
96 deletions.
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.
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
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,96 +1,119 @@ | ||
| import React, { Component } from 'react'; | ||
| import { Card, Divider, Popup, Image} from 'semantic-ui-react'; | ||
| import React, { Component } from "react"; | ||
| import { Card, Divider, Popup, Image } from "semantic-ui-react"; | ||
|
|
||
| import contacts from './TeamList.json'; | ||
| import './TeamCards.css'; | ||
| import contacts from "./TeamList.json"; | ||
| import "./TeamCards.css"; | ||
|
|
||
| class MemberCards extends Component{ | ||
| class MemberCards extends Component { | ||
| constructor(props) { | ||
| super(props); | ||
| this.onGClick = this.onGClick.bind(this); | ||
| this.onIClick = this.onIClick.bind(this); | ||
| } | ||
| onGClick() { | ||
| window.location.href = "mailto:[email protected]"; | ||
| } | ||
| onIClick() { | ||
| window.location.href = "mailto:[email protected]"; | ||
| } | ||
|
|
||
| constructor(props) { | ||
| super(props); | ||
| this.onGClick = this.onGClick.bind(this); | ||
| this.onIClick = this.onIClick.bind(this); | ||
| } | ||
| onGClick() { | ||
| window.location.href = 'mailto:[email protected]'; | ||
| } | ||
| onIClick() { | ||
| window.location.href = 'mailto:[email protected]'; | ||
| } | ||
| render() { | ||
| const teams = contacts.teams; | ||
| const advisors = contacts.advisors; | ||
|
|
||
| render() { | ||
| const teams = contacts.teams | ||
| const advisors = contacts.advisors | ||
| return ( | ||
| <div className="team" id="team"> | ||
| <Divider horizontal id="title"> | ||
| Team | ||
| </Divider> | ||
| <br /> | ||
| <div id="content"> | ||
| SoDA is here to help you. Please feel free to reach out to any of us, | ||
| we want to help and would be happy to answer any questions you have! | ||
| </div> | ||
|
|
||
| return ( | ||
| <div className="team"> | ||
| <Divider horizontal id="title">Team</Divider><br/> | ||
| <div id="content"> | ||
| SoDA is here to help you. Please feel free to reach out to any of us, we want to help and would be happy to answer any questions you have! | ||
| </div> | ||
| {Object.keys(teams).map((team, i) => ( | ||
| <React.Fragment key={i}> | ||
| <Divider horizontal className="subteam-divider"> | ||
| {team} | ||
| </Divider> | ||
| <div id="cards"> | ||
| {teams[team].map((member, j) => ( | ||
| <Card key={j} className="Card rounded-card"> | ||
| <Card.Content className="card-content"> | ||
| <div className="card-image-wrapper"> | ||
| <Image | ||
| className="card-image" | ||
| src={member.image} | ||
| size="tiny" | ||
| /> | ||
| </div> | ||
|
|
||
| {Object.keys(teams).map((team, i) => | ||
| <React.Fragment key={i}> | ||
| <Divider horizontal className="subteam-divider">{team}</Divider> | ||
| <div id="cards"> | ||
| {teams[team].map((member, j) => ( | ||
| <Card key={j} className="Card rounded-card"> | ||
| <Card.Content className="card-content"> | ||
| <div className="card-text"> | ||
| <Card.Header className="card-header"> | ||
| {member.name} | ||
| </Card.Header> | ||
| <Card.Meta className="card-meta"> | ||
| {member.role} | ||
| <br /> | ||
| <Popup | ||
| key={member.name} | ||
| position="bottom center" | ||
| inverted | ||
| trigger={ | ||
| <a | ||
| href={"mailto:" + member.email} | ||
| className="card-email" | ||
| > | ||
| {member.email} | ||
| </a> | ||
| } | ||
| //header='Open Mail Client' | ||
| //content={member.email} | ||
| /> | ||
| </Card.Meta> | ||
| </div> | ||
| </Card.Content> | ||
| </Card> | ||
| ))} | ||
| </div> | ||
| </React.Fragment> | ||
| ))} | ||
|
|
||
| <div className="card-image-wrapper"> | ||
| <Image className="card-image" src={member.image} size="tiny" /> | ||
| </div> | ||
|
|
||
| <div className="card-text"> | ||
| <Card.Header className="card-header">{member.name}</Card.Header> | ||
| <Card.Meta className="card-meta"> | ||
| {member.role} | ||
| <br /> | ||
| <Popup | ||
| key={member.name} | ||
| position='bottom center' | ||
| inverted | ||
| trigger={<a href={'mailto:' + member.email} className="card-email">{member.email}</a>} | ||
| //header='Open Mail Client' | ||
| //content={member.email} | ||
| /> | ||
| </Card.Meta> | ||
| </div> | ||
|
|
||
| </Card.Content> | ||
| </Card> | ||
| ))} | ||
| </div> | ||
| </React.Fragment> | ||
| )} | ||
|
|
||
| <Divider horizontal className="subteam-divider">Advisors</Divider> | ||
| <div id="cards"> | ||
| {advisors.map((advisor, j) => ( | ||
| <Card key={j} className="Card rounded-card"> | ||
| <Card.Content className="card-content"> | ||
|
|
||
| <div className="card-image-wrapper"> | ||
| <Image className="card-image" src={advisor.image} size="tiny" /> | ||
| </div> | ||
|
|
||
| <div className="card-text"> | ||
| <Card.Header className="card-header">{advisor.name}</Card.Header> | ||
| <Card.Meta className="card-meta"> | ||
| {advisor.role} | ||
| <br /> | ||
| <a href={'mailto:' + advisor.email} className="card-email">{advisor.email}</a> | ||
| </Card.Meta> | ||
| </div> | ||
|
|
||
| </Card.Content> | ||
| </Card> | ||
| ))} | ||
| <Divider horizontal className="subteam-divider"> | ||
| Advisors | ||
| </Divider> | ||
| <div id="cards"> | ||
| {advisors.map((advisor, j) => ( | ||
| <Card key={j} className="Card rounded-card"> | ||
| <Card.Content className="card-content"> | ||
| <div className="card-image-wrapper"> | ||
| <Image | ||
| className="card-image" | ||
| src={advisor.image} | ||
| size="tiny" | ||
| /> | ||
| </div> | ||
|
|
||
| </div> | ||
| ); | ||
| } | ||
| <div className="card-text"> | ||
| <Card.Header className="card-header"> | ||
| {advisor.name} | ||
| </Card.Header> | ||
| <Card.Meta className="card-meta"> | ||
| {advisor.role} | ||
| <br /> | ||
| <a href={"mailto:" + advisor.email} className="card-email"> | ||
| {advisor.email} | ||
| </a> | ||
| </Card.Meta> | ||
| </div> | ||
| </Card.Content> | ||
| </Card> | ||
| ))} | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| export default MemberCards; | ||
| export default MemberCards; |
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