diff --git a/src/components/Members.jsx b/src/components/Members.jsx index 05c80d2..5d3f726 100644 --- a/src/components/Members.jsx +++ b/src/components/Members.jsx @@ -1,16 +1,20 @@ 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 (
@@ -18,19 +22,20 @@ function Members() {

Meet the Admins

{admin.map((member) => -
- {`beautiful -

{member.name}

+
+

{member.firstName}
{member.lastName}

+ {`beautiful +
{member.title}
)}
-
+

Meet the Contributors

{members.map((member) => -
- {`beautiful +
+ {`beautiful

{member.name}

)} diff --git a/src/index.css b/src/index.css index f27297e..477b0dd 100644 --- a/src/index.css +++ b/src/index.css @@ -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; diff --git a/src/test/__snapshots__/App.test.js.snap b/src/test/__snapshots__/App.test.js.snap index 20cba04..5a452ce 100644 --- a/src/test/__snapshots__/App.test.js.snap +++ b/src/test/__snapshots__/App.test.js.snap @@ -196,34 +196,116 @@ exports[`App renders 1`] = ` className="row" >
- beautiful headshot of John.

John +
+ + Riley

+ beautiful headshot of John Riley. +
+ Admin & Coding Mentor +
+

+ Kent +
+ + Utterback +

beautiful headshot of Amy. +
+ Admin Emeritus & Coding Mentor +
+
+

Amy +
+ + Bedinghaus

+ beautiful headshot of Amy Bedinghaus. +
+ Admin Emeritus +
+

+ Austin +
+ + Truss +

beautiful headshot of Kevin. +
+ Admin Emeritus +
+
+

Kevin +
+ + Bruland +

+ beautiful headshot of Kevin Bruland. +
+ Admin Emeritus +
+
+
+

+ Sarah +
+ + Lilly-Bruland

+ beautiful headshot of Sarah Lilly-Bruland. +
+ Admin Emeritus +
+
+
+

+ Justin +
+ + Woodward +

+ beautiful headshot of Justin Woodward. +
+ Admin Emeritus +
@@ -239,7 +321,7 @@ exports[`App renders 1`] = `
beautiful headshot of John.

@@ -249,7 +331,7 @@ exports[`App renders 1`] = `
beautiful headshot of Ismael.

@@ -259,7 +341,7 @@ exports[`App renders 1`] = `
beautiful headshot of Nirvignesh.

@@ -269,7 +351,7 @@ exports[`App renders 1`] = `
beautiful headshot of Tijana.

@@ -279,7 +361,7 @@ exports[`App renders 1`] = `
beautiful headshot of Jennifer.

@@ -289,7 +371,7 @@ exports[`App renders 1`] = `
beautiful headshot of Kellan.

diff --git a/src/test/components/__snapshots__/Members.test.js.snap b/src/test/components/__snapshots__/Members.test.js.snap index d3d6a99..6e9f6a9 100644 --- a/src/test/components/__snapshots__/Members.test.js.snap +++ b/src/test/components/__snapshots__/Members.test.js.snap @@ -12,34 +12,116 @@ exports[`Members renders 1`] = ` className="row" >
- beautiful headshot of John.

John +
+ + Riley

+ beautiful headshot of John Riley. +
+ Admin & Coding Mentor +
+

+ Kent +
+ + Utterback +

beautiful headshot of Amy. +
+ Admin Emeritus & Coding Mentor +
+
+

Amy +
+ + Bedinghaus

+ beautiful headshot of Amy Bedinghaus. +
+ Admin Emeritus +
+

+ Austin +
+ + Truss +

beautiful headshot of Kevin. +
+ Admin Emeritus +
+
+

Kevin +
+ + Bruland +

+ beautiful headshot of Kevin Bruland. +
+ Admin Emeritus +
+
+
+

+ Sarah +
+ + Lilly-Bruland

+ beautiful headshot of Sarah Lilly-Bruland. +
+ Admin Emeritus +
+
+
+

+ Justin +
+ + Woodward +

+ beautiful headshot of Justin Woodward. +
+ Admin Emeritus +

@@ -55,7 +137,7 @@ exports[`Members renders 1`] = `
beautiful headshot of John.

@@ -65,7 +147,7 @@ exports[`Members renders 1`] = `
beautiful headshot of Ismael.

@@ -75,7 +157,7 @@ exports[`Members renders 1`] = `
beautiful headshot of Nirvignesh.

@@ -85,7 +167,7 @@ exports[`Members renders 1`] = `
beautiful headshot of Tijana.

@@ -95,7 +177,7 @@ exports[`Members renders 1`] = `
beautiful headshot of Jennifer.

@@ -105,7 +187,7 @@ exports[`Members renders 1`] = `
beautiful headshot of Kellan.