Skip to content

Commit

Permalink
Merge pull request #24 from infoshareacademy/MikJed
Browse files Browse the repository at this point in the history
Mik jed
  • Loading branch information
michalPastewski authored Sep 6, 2020
2 parents 9976945 + c82c12f commit 01ac6f9
Show file tree
Hide file tree
Showing 15 changed files with 368 additions and 70 deletions.
23 changes: 23 additions & 0 deletions debug.log
Original file line number Diff line number Diff line change
Expand Up @@ -182,3 +182,26 @@
[0802/042559.668:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0802/042559.668:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0802/042559.668:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.013:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
[0820/023734.014:ERROR:crash_report_database_win.cc(469)] failed to stat report
106 changes: 45 additions & 61 deletions src/components/About.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,10 @@ import React, { Fragment } from "react";

import TeamMemberCard from "./TeamMemberCard.jsx";
import { MembersList } from "./TeamMemberList";
import "./TeamMemberCard.css"
import "./TeamMemberCard.css";
import TeamMembersListComponent from "./TeamMembersList";
import ImageCarousel from "./AboutUsCarousel";
import AboutUsContent from "./AboutUsContent";

import CssBaseline from '@material-ui/core/CssBaseline';
import Typography from '@material-ui/core/Typography';
Expand All @@ -11,80 +14,61 @@ import Container from '@material-ui/core/Container';
import {withStyles } from '@material-ui/core/styles';

import Grid from '@material-ui/core/Grid';
import { List } from "@material-ui/core";


// The example data is structured as follows:

const styles = {
root: {
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'flex-start',
overflow: 'hidden',
padding: 0
},
x: {
margin: 50
},
gridList: {
width: 500,
height: 450,

display: 'flex',
flexWrap: 'wrap',
justifyContent: 'flex-start',
overflow: 'hidden',
padding: 0
}
const styles = {
root: {
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'flex-start',
overflow: 'hidden',
padding: 0
},
x: {
margin: 50
},

container: {
width: '90%',
height: '90%',
padding: '0px',


// tileStyling: {
// width: 100,
// height: 450,
// },

// boxShadow:{
// boxShadow: '3px 3px 5px #aaaaaa',
// margin: '5px',
// padding: '0 !important'
// }
};
display: "flex",
flexWrap: "nowrap",

const classes = styles;
boxShadow: "3px 3px 5px #aaaaaa"
},

imgCarousel: {
gridArea:'img',
width: '40%',
height: '100%'
},

infoContent: {
gridArea: 'content',
width: '60%'
}
};

const classes = styles;

const About = () => (

<Fragment>
<Grid xs={12} className={classes.root}>

<Container style={classes.container}>

<div>
<h1 style={{marginTop: 0}}>About Us</h1>
</div>

<Container className={classes.gridList} style={{width: '95%'}}>
<ul className="team-card" style={{
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'flex-start',

listStyleType: 'none',

padding: '0px'
}}
>

{
MembersList.map((member) => (
<li key={member.id} style={{margin: '20px 30px', boxShadow: '3px 3px 5px #aaaaaa'}}>
<TeamMemberCard card={member} />
</li>
))
}
</ul>
</Container>
<ImageCarousel style={classes.imgCarousel} />

</Grid>
<AboutUsContent style={classes.infoContent} />

</Container>
</Grid>

</Fragment>
);
Expand Down
5 changes: 5 additions & 0 deletions src/components/AboutUsCarousel.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
@media screen and (max-width: 1500px) {
.imgContainer {
display: none;
}
}
43 changes: 43 additions & 0 deletions src/components/AboutUsCarousel.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
import React from 'react';
import "./AboutUsCarousel.css";

import Leaf from './image/leaf.jpeg'
import Meditation from './image/modal.jpg'
import Healthy from './image/stay_healthy.jpg'
import { makeStyles } from '@material-ui/core';


const ImageCarousel = () => {

const Images = [
{id: 0, url: {Meditation} },
{id: 1, url: {Healthy} },
]

const styles = {

imgContainer: {
width: '100%',
height: '70%',
margin: '0%',
overflow: 'hidden'
},

carouselImg: {
display: 'block',
width: '150%',
height: '70%',
margin: '-10% 0% 0% -35%'}
}

const classes = styles;

return (

<figure className='imgContainer' style={styles.imgContainer}>
<img src={Leaf} alt={"Side picture - well-being"} style={styles.carouselImg} />
</figure>
)
}

export default ImageCarousel;
77 changes: 77 additions & 0 deletions src/components/AboutUsContent.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
import React, { Fragment } from "react";

import "./TeamMemberCard.css";
import TeamMembersListComponent from "./TeamMembersList";

import {withStyles } from '@material-ui/core/styles';
import { makeStyles, useTheme } from '@material-ui/core/styles';

const AboutUsContent = () => {

const styles = {
contentHeader: {
color: '#fff',
padding: '12px 24px',
margin: '0%',
backgroundColor: '#364954'
},

contentInfoText: {
textAlign: 'justify',
padding: '24px',
margin: '0px',
backgroundColor: '#364954',
color: '#fff'
},

contentList: {
listStyleType: 'none',
padding: '0px 24px',
margin: '0px auto',
display: 'flex',
justifyContent: 'space-around',
color: '#fff'

},

contentListPosition: {
width: '100px',
margin: '0% 5% 2.5%'
},
}

return (
<div style={{display: 'flex', flexDirection: 'column', justifyContent: 'space-between'}}>

<article>
<h2 style={styles.contentHeader}>Poznaj nas</h2>

<p style={styles.contentInfoText}>
Żyjemy w świecie, w którym wiele osób boryka się z problemami zdrowotnymi oraz brakiem czasu. Dlatego w odpowiedzi na rosnące zapotrzebowanie postanowiliśmy stworzyć narzędzie online, dzięki któremu możesz kontrolować, dietę, treningi, utrzymywać równowagę psychofizyczna oraz motywacje.
Naszą misją jest inspirowanie ludzi do zdrowego stylu życia przy jednoczesnym dostarczeniu produktu opartego o najnowsze technologie. Chcemy Cię przekonać, że zdrowy styl życia może być prosty, szybki i niedrogi.
<br/><br/>
To proste. Uda się!
<br/><br/>
Założyciele Vitaminy
</p>
</article>

<TeamMembersListComponent />

<article style={styles.contentMoreInfo}>

<h3 style={{padding: '0px 24px'}}>Dowiedz się więcej:</h3>

<ul style={styles.contentList}>
<li style={styles.contentListPosition}><a href='#' style={styles.contentLink}>Facebook</a></li>
<li style={styles.contentListPosition}><a href='#' style={styles.contentLink}>Instagram</a></li>
<li style={styles.contentListPosition}><a href='#' style={styles.contentLink}>Twitter</a></li>
</ul>

</article>

</div>
)
}

export default AboutUsContent;
54 changes: 50 additions & 4 deletions src/components/TeamMemberCard.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,66 @@ import { MembersList } from "./TeamMemberList";

import "./TeamMemberCard.css";

import GitHubImg from "./image/github.svg";
import FacebookImg from "./image/facebook.svg";
import LinkedInImg from "./image/linkedin.svg";

const TeamMemberCard = ( {card} ) => (

<div className="root"
style={{display: 'block', flexWrap: 'wrap', flexDirection: 'column', width: '200px', height: '285px', marginLeft: 'auto', marginRight: 'auto', alignItems: 'center', alignContent: 'center', textAlign: 'center', border: 'solid 1px rgba(39, 39, 39, 0.2)'}}>
<figure style={{width: '100%', height: '70%', overflow: 'hidden', margin: '0'}}>
style={{
display: 'block',
flexWrap: 'wrap',
flexDirection: 'column',
width: '100%',
height: '100%',
marginLeft: 'auto',
marginRight: 'auto',
alignItems: 'center',
alignContent: 'center',
textAlign: 'center',
border: 'solid 1px rgba(39, 39, 39, 0.2)'
}}>

<figure style={{
width: '100%',
height: '57.5%',
overflow: 'hidden',
margin: '0'
}}>
<img
src={card.img}
alt="Zdjęcie członka zespołu"

style={{width: '100%', height: '100%', borderRadius: 'inherit'}}
/>
</figure>
<h2 style={{width: '100%', height: '10%', margin: '20px auto 0px', padding: '' }} >{card.name}</h2>
<h4 style={{width: '100%', height: '10%', margin: '10px auto'}}>{card.title}</h4>
<h3 style={{width: '100%', margin: '20px auto 0px', padding: '' }} >{card.name}</h3>
<h4 style={{width: '100%', margin: '10px auto'}}>{card.title}</h4>

<div style={{
display: 'flex',
justifyContent: 'space-around',
width: '100%'
}}>

<a href={card.urlGH} style={{
color: '#1890ff'
}}>
<img src={GitHubImg} style={{width: '25px', height: '25px', color: '#1890ff'}} />
</a>
<a href={card.urlFB} style={{
color: '#1890ff'
}}>
<img src={FacebookImg} style={{width: '25px', height: '25px', color: '#1890ff'}} />
</a>
<a href={card.urlLN} style={{
color: '#1890ff'
}}>
<img src={LinkedInImg} style={{width: '25px', height: '25px', color: '#1890ff'}} />
</a>

</div>
</div>
)

Expand Down
8 changes: 4 additions & 4 deletions src/components/TeamMemberList.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ import TeamMemberImg3 from "./image/Ania__awesome__pic.jpg";
import TeamMemberImg4 from "./image/Mikolaj__awesome__pic.jpg";

export const MembersList = [
{ id: 1, name: "Paulina Lebiecka", title: "UX/UI Designer", img: TeamMemberImg1 },
{ id: 2, name: "Michał Pastewski", title: "Front-End Developer", img: TeamMemberImg2 },
{ id: 3, name: "Anna Rutkowska", title: "Front-End Developer", img: TeamMemberImg3 },
{ id: 4, name: "Mikołaj Jędrak", title: "Front-End Developer", img: TeamMemberImg4 },
{ id: 1, name: "Paulina Lebiecka", title: "UX/UI Designer", img: TeamMemberImg1, urlGH: "https://github.com/paulinalebiecka", urlFB: "https://www.facebook.com/paulina.lebiecka/", urlLN: "https://www.linkedin.com/in/paulina-lebiecka-2b993518a/" },
{ id: 2, name: "Michał Pastewski", title: "Front-End Developer", img: TeamMemberImg2, urlGH: "https://github.com/michael-pastewski", urlFB: "https://www.facebook.com/michpastewski", urlLN: "https://www.linkedin.com/in/michal-pastewski" },
{ id: 3, name: "Anna Rutkowska", title: "Front-End Developer", img: TeamMemberImg3, urlGH: "https://github.com/rutkows-anna", urlFB: "https://www.facebook.com/ania.rutkowska.980", urlLN: "https://www.linkedin.com/in/rutkows-anna/" },
{ id: 4, name: "Mikołaj Jędrak", title: "Front-End Developer", img: TeamMemberImg4, urlGH: "https://github.com/KubaJedrak", urlFB: "https://www.facebook.com/kuba.jedrak", urlLN: "https://www.linkedin.com/in/miko%C5%82aj-j%C4%99drak-a148a5160/" },
]
Loading

0 comments on commit 01ac6f9

Please sign in to comment.