Skip to content

Commit

Permalink
Merge pull request #58 from mmcbride2929/admin-update
Browse files Browse the repository at this point in the history 
Meet-The-Admins Section, and added refactor issue
  • Loading branch information
@readysetagile
readysetagile authored Aug 8, 2023
2 parents ec5293a + 53af707 commit a1efb0c
Show file tree
Hide file tree
Showing 4 changed files with 233 additions and 55 deletions.
35 changes: 20 additions & 15 deletions src/components/Members.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,36 +1,41 @@
function Members() {
const admin = [
{ name: 'John', imgUrl: '/head.png' },
{ name: 'Amy', imgUrl: '/head.png' },
{ name: 'Kevin', imgUrl: '/head.png' },
{ id: 0, firstName: 'John', lastName: 'Riley', title: 'Admin & Coding Mentor', imgUrl: 'https://avatars.githubusercontent.com/u/41979303?v=4' },
{ id: 1, firstName: 'Kent', lastName: 'Utterback', title: 'Admin Emeritus & Coding Mentor', imgUrl: 'https://avatars.githubusercontent.com/u/17324971?v=4' },
{ id: 2, firstName: 'Amy', lastName: 'Bedinghaus', title: 'Admin Emeritus', imgUrl: 'https://avatars.githubusercontent.com/u/28076677?v=4' },
{ id: 3, firstName: 'Austin', lastName: 'Truss', title: 'Admin Emeritus', imgUrl: 'https://media.licdn.com/dms/image/C5603AQGQpynBhWiZLA/profile-displayphoto-shrink_200_200/0/1517355585710?e=1696464000&v=beta&t=DrPEzm5U1we4G7qUPoFrAA5gw_MHSN3dU8_02iWZYRA' },
{ id: 4, firstName: 'Kevin', lastName: 'Bruland', title: 'Admin Emeritus', imgUrl: 'https://avatars.githubusercontent.com/u/17850505?v=4' },
{ id: 5, firstName: 'Sarah', lastName: 'Lilly-Bruland', title: 'Admin Emeritus', imgUrl: 'https://avatars.githubusercontent.com/u/17872422?v=4' },
{ id: 6, firstName: 'Justin', lastName: 'Woodward', title: 'Admin Emeritus', imgUrl: 'https://avatars.githubusercontent.com/u/17994108?v=4' },
]
const members = [
{ name: 'John', imgUrl: '/head.png' },
{ name: 'Ismael', imgUrl: '/head.png' },
{ name: 'Nirvignesh', imgUrl: '/head.png' },
{ name: 'Tijana', imgUrl: '/head.png' },
{ name: 'Jennifer', imgUrl: '/head.png' },
{ name: 'Kellan', imgUrl: '/head.png' },
{ id: 0, name: 'John', imgUrl: '/head.png' },
{ id: 1, name: 'Ismael', imgUrl: '/head.png' },
{ id: 2, name: 'Nirvignesh', imgUrl: '/head.png' },
{ id: 3, name: 'Tijana', imgUrl: '/head.png' },
{ id: 4, name: 'Jennifer', imgUrl: '/head.png' },
{ id: 5, name: 'Kellan', imgUrl: '/head.png' },
]
return (
<div>
<div className="members">
<h3>Meet the Admins</h3>
<div className="row">
{admin.map((member) =>
<div key={member.name}>
<img className='admin' src={member.imgUrl} alt={`beautiful headshot of ${member.name}.`} />
<h4>{member.name}</h4>
<div key={member.id}>
<h4>{member.firstName}<br/> {member.lastName}</h4>
<img className='avatar admin-avatar' src={member.imgUrl} alt={`beautiful headshot of ${member.firstName} ${member.lastName}.`} />
<h5>{member.title}</h5>
</div>
)}
</div>
</div>
<div className="members">
<div className="members">
<h3>Meet the Contributors</h3>
<div className="row">
{members.map((member) =>
<div key={member.name}>
<img className='member' src={member.imgUrl} alt={`beautiful headshot of ${member.name}.`} />
<div key={member.id}>
<img className='avatar member-avatar' src={member.imgUrl} alt={`beautiful headshot of ${member.name}.`} />
<h4>{member.name}</h4>
</div>
)}
Expand Down
21 changes: 15 additions & 6 deletions src/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -197,21 +197,30 @@ th {
justify-content: space-evenly;
}

.admin,
.member {
height: 140px;
width: 140px;
padding: .75em;
.avatar {
border: 1px solid #707070;
background-color: #f5b742;
}

.member {
.admin-avatar {
height: 140px;
width: 140px;
}

.member-avatar {
height: 100px;
width: 100px;
border-radius: 50%;
}

.members h4 {
margin: 5px 0 5px 0;
}

.members h5 {
margin-top: 15px;
}

footer {
display: flex;
flex-direction: column;
Expand Down
116 changes: 99 additions & 17 deletions src/test/__snapshots__/App.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -196,34 +196,116 @@ exports[`App renders 1`] = `
className="row"
>
<div>
<img
alt="beautiful headshot of John."
className="admin"
src="/head.png"
/>
<h4>
John
<br />
Riley
</h4>
<img
alt="beautiful headshot of John Riley."
className="avatar admin-avatar"
src="https://avatars.githubusercontent.com/u/41979303?v=4"
/>
<h5>
Admin & Coding Mentor
</h5>
</div>
<div>
<h4>
Kent
<br />
Utterback
</h4>
<img
alt="beautiful headshot of Amy."
className="admin"
src="/head.png"
alt="beautiful headshot of Kent Utterback."
className="avatar admin-avatar"
src="https://avatars.githubusercontent.com/u/17324971?v=4"
/>
<h5>
Admin Emeritus & Coding Mentor
</h5>
</div>
<div>
<h4>
Amy
<br />
Bedinghaus
</h4>
<img
alt="beautiful headshot of Amy Bedinghaus."
className="avatar admin-avatar"
src="https://avatars.githubusercontent.com/u/28076677?v=4"
/>
<h5>
Admin Emeritus
</h5>
</div>
<div>
<h4>
Austin
<br />
Truss
</h4>
<img
alt="beautiful headshot of Kevin."
className="admin"
src="/head.png"
alt="beautiful headshot of Austin Truss."
className="avatar admin-avatar"
src="https://media.licdn.com/dms/image/C5603AQGQpynBhWiZLA/profile-displayphoto-shrink_200_200/0/1517355585710?e=1696464000&v=beta&t=DrPEzm5U1we4G7qUPoFrAA5gw_MHSN3dU8_02iWZYRA"
/>
<h5>
Admin Emeritus
</h5>
</div>
<div>
<h4>
Kevin
<br />
Bruland
</h4>
<img
alt="beautiful headshot of Kevin Bruland."
className="avatar admin-avatar"
src="https://avatars.githubusercontent.com/u/17850505?v=4"
/>
<h5>
Admin Emeritus
</h5>
</div>
<div>
<h4>
Sarah
<br />
Lilly-Bruland
</h4>
<img
alt="beautiful headshot of Sarah Lilly-Bruland."
className="avatar admin-avatar"
src="https://avatars.githubusercontent.com/u/17872422?v=4"
/>
<h5>
Admin Emeritus
</h5>
</div>
<div>
<h4>
Justin
<br />
Woodward
</h4>
<img
alt="beautiful headshot of Justin Woodward."
className="avatar admin-avatar"
src="https://avatars.githubusercontent.com/u/17994108?v=4"
/>
<h5>
Admin Emeritus
</h5>
</div>
</div>
</div>
Expand All @@ -239,7 +321,7 @@ exports[`App renders 1`] = `
<div>
<img
alt="beautiful headshot of John."
className="member"
className="avatar member-avatar"
src="/head.png"
/>
<h4>
Expand All @@ -249,7 +331,7 @@ exports[`App renders 1`] = `
<div>
<img
alt="beautiful headshot of Ismael."
className="member"
className="avatar member-avatar"
src="/head.png"
/>
<h4>
Expand All @@ -259,7 +341,7 @@ exports[`App renders 1`] = `
<div>
<img
alt="beautiful headshot of Nirvignesh."
className="member"
className="avatar member-avatar"
src="/head.png"
/>
<h4>
Expand All @@ -269,7 +351,7 @@ exports[`App renders 1`] = `
<div>
<img
alt="beautiful headshot of Tijana."
className="member"
className="avatar member-avatar"
src="/head.png"
/>
<h4>
Expand All @@ -279,7 +361,7 @@ exports[`App renders 1`] = `
<div>
<img
alt="beautiful headshot of Jennifer."
className="member"
className="avatar member-avatar"
src="/head.png"
/>
<h4>
Expand All @@ -289,7 +371,7 @@ exports[`App renders 1`] = `
<div>
<img
alt="beautiful headshot of Kellan."
className="member"
className="avatar member-avatar"
src="/head.png"
/>
<h4>
Expand Down
Loading

0 comments on commit a1efb0c

Please sign in to comment.