Restyled steering council photos to reflect material design styling that is intended on the cards (jupyter#161)

Author: cameronoelsen

about.html

@@ -147,72 +147,72 @@ <h3 class="col-sm-12 section-header">Steering Council</h3>
                 <p class="col-sm-12 support-paragraph">Our team is primarily led by 14 steering committee members who ultimately make the final decisions.</p>
                 <div class="col-md-12 section-content section-center">
                     <div class="col-md-4 material">
-                        <img alt="Brian Granger's avatar picture" src='https://avatars1.githubusercontent.com/u/27600?v=3&s=170' />
+                        <img class="council-member-photo" alt="Brian Granger's avatar picture" src='https://avatars1.githubusercontent.com/u/27600?v=3&s=170' />
                         <p class="card-header">Brian Granger</p>
                         <p class="card-info">Cal Poly, San Luis Obispo<br><a href="https://github.com/ellisonbg" target="_blank"><em>@ellisonbg</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Damian Avila's avatar picture" src='https://avatars3.githubusercontent.com/u/1640669?v=3&s=170' />
+                        <img class="council-member-photo" alt="Damian Avila's avatar picture" src='https://avatars3.githubusercontent.com/u/1640669?v=3&s=170' />
                         <p class="card-header">Damian Avila</p>
                         <p class="card-info">Continuum Analytics<br><a href="https://github.com/damianavila" target="_blank"><em>@damianavila</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Fernando Perez's avatar picture" src='https://avatars3.githubusercontent.com/u/57394?v=3&s=400' />
+                        <img class="council-member-photo" alt="Fernando Perez's avatar picture" src='https://avatars3.githubusercontent.com/u/57394?v=3&s=400' />
                         <p class="card-header">Fernando Perez</p>
                         <p class="card-info">UC Berkeley<br><a href="https://github.com/fperez" target="_blank"><em>@fperez</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Jason Grout's avatar picture" src='https://avatars1.githubusercontent.com/u/192614?v=3&s=400' />
+                        <img class="council-member-photo" alt="Jason Grout's avatar picture" src='https://avatars1.githubusercontent.com/u/192614?v=3&s=400' />
                         <p class="card-header">Jason Grout</p>
                         <p class="card-info">Bloomberg<br><a href="https://github.com/jasongrout" target="_blank"><em>@jasongrout</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Jessica Hamrick's avatar picture" src='https://avatars2.githubusercontent.com/u/83444?v=3&s=400' />
+                        <img class="council-member-photo" alt="Jessica Hamrick's avatar picture" src='https://avatars2.githubusercontent.com/u/83444?v=3&s=400' />
                         <p class="card-header">Jessica Hamrick</p>
                         <p class="card-info">UC Berkeley<br><a href="https://github.com/jhamrick" target="_blank"><em>@jhamrick</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Jonathan Frederic's avatar picture" src='https://avatars2.githubusercontent.com/u/3292874?v=3&s=400' />
+                        <img class="council-member-photo" alt="Jonathan Frederic's avatar picture" src='https://avatars2.githubusercontent.com/u/3292874?v=3&s=400' />
                         <p class="card-header">Jonathan Frederic</p>
                         <p class="card-info">Cal Poly, San Luis Obispo<br><a href="https://github.com/jdfreder" target="_blank"><em>@jdfreder</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Kyle Kelley's avatar picture" src='https://avatars1.githubusercontent.com/u/836375?v=3&s=400' />
+                        <img class="council-member-photo" alt="Kyle Kelley's avatar picture" src='https://avatars1.githubusercontent.com/u/836375?v=3&s=400' />
                         <p class="card-header">Kyle Kelley</p>
                         <p class="card-info">Netflix<br><a href="https://github.com/rgbkrk" target="_blank"><em>@rgbkrk</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Matthias Bussonnier's avatar picture" src='https://avatars2.githubusercontent.com/u/335567?v=3&s=400' />
+                        <img class="council-member-photo" alt="Matthias Bussonnier's avatar picture" src='https://avatars2.githubusercontent.com/u/335567?v=3&s=400' />
                         <p class="card-header">Matthias Bussonnier</p>
                         <p class="card-info">UC Berkeley<br><a href="https://github.com/carreau" target="_blank"><em>@carreau</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Min Ragan-Kelley's avatar picture" src='https://avatars0.githubusercontent.com/u/151929?v=3&s=400' />
+                        <img class="council-member-photo" alt="Min Ragan-Kelley's avatar picture" src='https://avatars0.githubusercontent.com/u/151929?v=3&s=400' />
                         <p class="card-header">Min Ragan-Kelley</p>
                         <p class="card-info">Simula Research Lab<br><a href="https://github.com/minrk" target="_blank"><em>@minrk</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Peter Parente's avatar picture" src='https://avatars2.githubusercontent.com/u/153745?v=3&s=400' />
+                        <img class="council-member-photo" alt="Peter Parente's avatar picture" src='https://avatars2.githubusercontent.com/u/153745?v=3&s=400' />
                         <p class="card-header">Peter Parente</p>
                         <p class="card-info">MaxPoint<br><a href="https://github.com/parente" target="_blank"><em>@parente</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Sylvain Corlay's avatar picture" src='https://avatars0.githubusercontent.com/u/2397974?v=3&s=400' />
+                        <img class="council-member-photo" alt="Sylvain Corlay's avatar picture" src='https://avatars0.githubusercontent.com/u/2397974?v=3&s=400' />
                         <p class="card-header">Sylvain Corlay</p>
                         <p class="card-info">QuantStack<br><a href="https://github.com/sylvaincorlay" target="_blank"><em>@sylvaincorlay</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Thomas Kluyver's avatar picture" src='https://avatars0.githubusercontent.com/u/327925?v=3&s=400' />
+                        <img class="council-member-photo" alt="Thomas Kluyver's avatar picture" src='https://avatars0.githubusercontent.com/u/327925?v=3&s=400' />
                         <p class="card-header">Thomas Kluyver</p>
                         <p class="card-info">UC Berkeley<br><a href="https://github.com/takluyver" target="_blank"><em>@takluyver</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Steven Silvester's avatar picture" src='https://avatars2.githubusercontent.com/u/2096628?v=3&s=400' />
+                        <img class="council-member-photo" alt="Steven Silvester's avatar picture" src='https://avatars2.githubusercontent.com/u/2096628?v=3&s=400' />
                         <p class="card-header">Steven Silvester</p>
                         <p class="card-info">Continuum Analytics<br><a href="https://github.com/blink1073" target="_blank"><em>@blink1073</em></a> on GitHub</p>
                     </div>
                     <div class="col-md-4 material">
-                        <img alt="Carol Willing's avatar picture" src='https://avatars1.githubusercontent.com/u/2680980?v=3&s=400' />
+                        <img class="council-member-photo" alt="Carol Willing's avatar picture" src='https://avatars1.githubusercontent.com/u/2680980?v=3&s=400' />
                         <p class="card-header">Carol Willing</p>
                         <p class="card-info">Cal Poly<br><a href="https://github.com/willingc" target="_blank"><em>@willingc</em></a> on GitHub</p>
                     </div>

css/logo-nav.css

@@ -399,15 +399,22 @@ body {
 }
 
 /* .Card-header, .card-info, .card-link, and .material are used for cards within the steering council section of the page. */
+.council-member-photo {
+    width: 200px;
+    border-top-left-radius: 2px;
+    border-top-right-radius: 2px;
+    margin-top: 0px;
+    margin-left: -15px;
+}
 .card-header {
     float:left;
-    font-size: 19px;
+    font-size: 16px;
     margin-top: 10px;
     text-align: left;
 }
 .card-info {
     float:left;
-    font-size: 15px;
+    font-size: 13px;
     margin-top: 0;
     text-align: left;
 }
@@ -427,23 +434,13 @@ body {
     border-radius: 2px;
     box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
     display: inline-block;
-    height: 300px;
+    height: 290px;
     margin: 1rem;
     position: relative;
     transition: all 0.2s ease-in-out;
     width: 200px;
 }
 
-.material > img {
-    width: 100%;
-    display: inline;
-    margin-top: 12px;
-    border-radius: 9px;
-    /* border: 2px solid lightgray; */
-    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
-}
-
-
 /* Styling for the Sponsor logos on About page*/
 .sponsor {
     margin: 16px 0;