From: Philippe Barbosa <contact@philippebarbosa.com>
Date: Sun, 3 Apr 2016 21:42:20 +0000 (+0200)
Subject: Updated program list page layout (masonry)
X-Git-Url: https://git.parisson.com/?a=commitdiff_plain;h=83e3199153d16155ae98eeba1c18311108afe9a8;p=mezzo.git

Updated program list page layout (masonry)
---

diff --git a/app/festival/static/css/index.css b/app/festival/static/css/index.css
index 17bde558..df8f62e7 100755
--- a/app/festival/static/css/index.css
+++ b/app/festival/static/css/index.css
@@ -1954,18 +1954,24 @@ th {
   zoom: 1;
 }
 
-/* line 34, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_pagination.scss */
+/* line 31, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_pagination.scss */
+.pagination > li.active a {
+  font-weight: 700;
+  color: #000;
+}
+
+/* line 38, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_pagination.scss */
 .pagination > li > a {
   padding: 0.45rem;
   margin: -0.45rem;
 }
 
-/* line 39, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_pagination.scss */
+/* line 43, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_pagination.scss */
 .pagination-first a:before {
   content: "\00AB" "\00A0";
 }
 
-/* line 43, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_pagination.scss */
+/* line 47, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/components/_pagination.scss */
 .pagination-last a:after {
   content: "\00A0" "\00BB";
 }
@@ -2906,30 +2912,31 @@ th {
 
 /* line 9, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__sizer,
+.msry__sizer,
 .artist__item {
   width: 50%;
 }
 
-/* line 17, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+/* line 18, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__item {
   float: left;
   padding: 0.5rem;
 }
 
-/* line 25, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+/* line 26, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__item__inner {
   position: relative;
   box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.4);
 }
 
-/* line 38, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+/* line 39, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__item .artist__img {
   position: relative;
   padding: 0;
   margin: 0;
 }
 
-/* line 42, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+/* line 43, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__item .artist__img__copyright {
   position: absolute;
   bottom: 0;
@@ -2942,12 +2949,12 @@ th {
   color: white;
 }
 
-/* line 55, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+/* line 56, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__item img {
   display: block;
 }
 
-/* line 59, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+/* line 60, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__item__name {
   display: block;
   width: 100%;
@@ -2957,7 +2964,7 @@ th {
   margin: 0;
 }
 
-/* line 70, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+/* line 71, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
 .artist__item__name span {
   display: inline-block;
   *display: inline;
@@ -3535,28 +3542,29 @@ th {
   }
   /* line 9, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
   .artist__sizer,
+  .msry__sizer,
   .artist__item{
     width: 33.33333%;
   }
-  /* line 17, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+  /* line 18, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
   .artist__item{
     padding: 0 0.5rem 1rem;
   }
-  /* line 25, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+  /* line 26, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
   .artist__item__inner{
     transition: .3s;
   }
-  /* line 31, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+  /* line 32, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
   .artist__item__inner:hover{
     box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, 0.8);
     -webkit-transform: scale(1.01);
     transform: scale(1.01);
   }
-  /* line 59, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+  /* line 60, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
   .artist__item__name{
     padding: 0.8rem;
   }
-  /* line 70, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
+  /* line 71, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/artist-card.scss */
   .artist__item__name span{
     font: 700 0.8rem "Interstate", "Helvetica Neue", Helvetica, Arial, sans-serif;
   }
@@ -3572,7 +3580,7 @@ th {
   .event__card, .event__card--alt, .event__card--full{
     float: left;
     width: 31%;
-    margin: 0 .5rem 0 .5rem;
+    margin: 0 .5rem 1rem .5rem;
   }
   /* line 19, /Users/philippebarbosa/Sites/ircam-manifeste/app/festival/static/scss/modules/event-card.scss */
   .event__card--full{
diff --git a/app/festival/static/js/index.js b/app/festival/static/js/index.js
index 56e951f3..e2569fd4 100644
--- a/app/festival/static/js/index.js
+++ b/app/festival/static/js/index.js
@@ -4,12 +4,12 @@ $(function() {
      * Masonry
      * @author Philippe Barbosa
      */
-    var $grid = $('.artist__list');
+    var $grid = $('.msry__container');
     $grid.imagesLoaded( function(){
         $grid.masonry({
-          itemSelector: '.artist__item',
+          itemSelector: '.msry__item',
           percentPosition: true,
-          columnWidth: '.artist__sizer'
+          columnWidth: '.msry__sizer'
         });
     });
 
diff --git a/app/festival/static/scss/modules/artist-card.scss b/app/festival/static/scss/modules/artist-card.scss
index a1aab0e1..4230d84b 100644
--- a/app/festival/static/scss/modules/artist-card.scss
+++ b/app/festival/static/scss/modules/artist-card.scss
@@ -7,6 +7,7 @@
 }
 
 .artist__sizer,
+.msry__sizer,
 .artist__item {
   width: 50%;
   @media (min-width : $desktop ) {
diff --git a/app/festival/static/scss/modules/event-card.scss b/app/festival/static/scss/modules/event-card.scss
index 1e9d9a55..394a1f4d 100644
--- a/app/festival/static/scss/modules/event-card.scss
+++ b/app/festival/static/scss/modules/event-card.scss
@@ -13,7 +13,7 @@
   @media (min-width : $desktop ) {
       float: left;
       width: 31%;
-      margin: 0 .5rem 0 .5rem
+      margin: 0 .5rem 1rem .5rem;
   }
 
 &--full {
diff --git a/app/festival/templates/festival/artist_list.html b/app/festival/templates/festival/artist_list.html
index 1e532c5b..01359d2e 100644
--- a/app/festival/templates/festival/artist_list.html
+++ b/app/festival/templates/festival/artist_list.html
@@ -7,10 +7,10 @@
 {% endblock %}
 
 {% block main %}
-<div class="artist__list">
-    <div class="artist__sizer"></div>
+<div class="artist__list msry__container">
+    <div class="msry__sizer"></div>
      {% for artist in object_list %}
-        <div class="artist__item">
+        <div class="artist__item msry__item">
             <div class="artist__item__inner">
                 <a href="{% url 'festival-artist-detail' artist.slug %}" class="artist__item__inner">
                     <figure class="artist__img">
diff --git a/app/templates/agenda/event_list.html b/app/templates/agenda/event_list.html
index 0fc41093..b3d787ed 100644
--- a/app/templates/agenda/event_list.html
+++ b/app/templates/agenda/event_list.html
@@ -66,9 +66,11 @@
     {% endif %}
 {% endif %}
 
+<div class="msry__container">
+    <div class="msry__sizer">
 {% for event in events.object_list %}
     {% block event_list_event_title %}
-        <div class="event__card">
+        <div class="event__card msry__item">
             {% if event.featured_image %}
                 {% block event_list_event_featured_image %}
                     <a href="{{ event.get_absolute_url }}" class="event__thumbnail">
@@ -135,6 +137,8 @@
 {% endblock %}
 </div>
 {% endfor %}
+    </div>
+</div>
 
 <a href='{% icalendar_url %}' target="_blank" class="small  push-ical">{% trans "Subscribe to all events in" %} Google Calendar/Outlook/iCal</a>