Merge pull request #291 from scala/style-events-more

style events page more

Author: sjrd

_includes/event-block.html

@@ -20,14 +20,14 @@
             {% if event.speaker.size > 0 %}
             <span class="speaker">{{event.speaker}}</span>
             {% else %}
-            <span class="speaker">Speaker TBA...</span>
+            <span class="speaker muted">Speaker TBA...</span>
             {% endif %}
         </td>
         <td>
             {% if event.title.size > 0 %}
             <span class="title">{{event.title}}</span>
             {% else %}
-            <span class="title">Talk title TBA...</span>
+            <span class="title muted">Talk title TBA...</span>
             {% endif %}
         </td>
         <td>

events.html

@@ -22,7 +22,7 @@ <h2 style="margin-bottom: 10px;">Scala Lunches at EPFL</h2>
       </p>
       <p>{{site.data.events.scala_lunches.header}}</p>
     </div>
-    <div class="card-list scala-lunches">
+    <div class="col-md-12 card-list scala-lunches">
       {% include event-block.html %}
     </div>
     <div class="col-md-12 title scala-lunches">

resources/css/main.scss

@@ -31,6 +31,7 @@ $link-color:      $orange;
 
 $grey-color:       #828282;
 $grey-color-light: lighten($grey-color, 40%);
+$grey-color-medium: lighten($grey-color, 7%);
 $grey-color-dark:  darken($grey-color, 25%);
 
 // Width of the content area
@@ -933,6 +934,14 @@ div.search {
 
 /* CARDS */
 
+.card-list {
+  margin: 20px 0 50px 0;
+
+  .muted {
+    color: $grey-color-medium;
+  }
+}
+
 .cards, .description-dialog {
   margin-top: 10px;
   @media(max-width: 991px) {