From 1434c24f7434a808800973f5a947e0253f93e6da Mon Sep 17 00:00:00 2001
From: Paolo Memoli <paolo@100shapes.com>
Date: Wed, 7 Oct 2015 18:01:26 +0100
Subject: [PATCH] updated events theme

---
 demo-event.html                | 21 +++++++++++++++++----
 themes/css/climb-event.css     | 29 +++++++++++++++++++++++++++--
 themes/css/climb-event.css.map |  2 +-
 themes/sass/climb-event.scss   | 33 +++++++++++++++++++++++++++++----
 4 files changed, 74 insertions(+), 11 deletions(-)
diff --git a/demo-event.html b/demo-event.html
index 1db80f1..fe615e7 100644
--- a/demo-event.html
+++ b/demo-event.html
@@ -5,10 +5,11 @@
         <meta charset="utf-8">
         <link rel="stylesheet" type="text/css" href="themes/css/climb-event.css">
         <link rel="stylesheet" type="text/css" href="https://rawgit.com/anselmh/object-fit/master/dist/polyfill.object-fit.css">
+        <link href='https://fonts.googleapis.com/css?family=Work+Sans:500' rel='stylesheet' type='text/css'>
         <title>Climb Theme Demos</title>
         <style>
             body {
-                font-family: "futura-pt", sans-serif;
+                font-family: 'Work Sans', sans-serif;
                 font-style: normal;
                 font-weight: 400;
                 margin: 0;
@@ -17,11 +18,11 @@
     </head>
 
     <body>
-        <div class="climb-wall climb-event" data-collection-id="55c1e00845284e26681c4929" data-limit="4">
+        <div class="climb-wall climb-event" data-collection-id="56154f4a45284e226c3b785b" data-limit="4">
         </div>
         <script src="//cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js"></script>
         <script src="//rawgit.com/Climb-social/react-climb-social/master/dist/react-climb-social.js"></script>
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/packery/1.4.3/packery.pkgd.min.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
         <script src="https://rawgit.com/anselmh/object-fit/master/dist/polyfill.object-fit.min.js"></script>
         <script type="text/javascript">
         window.Climb = {
@@ -29,9 +30,21 @@
         };
         objectFit.polyfill({
             selector: 'img', // this can be any CSS selector
-            fittype: 'cover', // either contain, cover, fill or none
+            fittype: 'contain', // either contain, cover, fill or none
             disableCrossDomain: 'true' // either 'true' or 'false' to not parse external CSS files.
         });
+
+        $(function() {
+            $(document).keydown(function(e) {
+                if(e.which == 37) {
+                    $($('.climb__tile')[1]).addClass('on');
+                    $($('.climb__tile')[0]).remove();
+                    return; // exit this handler for other keys
+                }
+                e.preventDefault(); // prevent the default action (scroll / move caret)
+            });
+
+        });
         </script>
     </body>
 
diff --git a/themes/css/climb-event.css b/themes/css/climb-event.css
index acbcf16..4a12b32 100644
--- a/themes/css/climb-event.css
+++ b/themes/css/climb-event.css
@@ -62,6 +62,9 @@
   position: absolute;
   right: 0px; }
 
+.climb-event a {
+  text-decoration: none;
+  color: #215cff; }
 .climb-event .climb__tile {
   display: none; }
   .climb-event .climb__tile:first-child, .climb-event .climb__tile:nth-child(2) {
@@ -78,9 +81,31 @@
   .climb-event .climb__tile.on {
     display: block;
     transform: translate3d(0, 0, 0); }
+.climb-event .climb__tile--has-media .climb__tile__content {
+  left: 200px;
+  height: 123px;
+  right: 0;
+  border-radius: 0;
+  bottom: 0;
+  text-align: left;
+  flex-direction: row; }
+.climb-event .climb__tile__content {
+  text-align: center;
+  position: absolute;
+  height: auto;
+  width: auto;
+  left: 100px;
+  right: 100px;
+  bottom: 45%;
+  background-color: rgba(255, 255, 255, 0.8);
+  border-radius: 10px; }
 .climb-event .climb__tile__image {
-  object-fit: cover;
+  object-fit: contain;
   width: 100%;
-  height: 100%; }
+  height: 85%; }
+.climb-event .climb__tile__message {
+  font-size: 150%; }
+.climb-event .climb__tile__author {
+  bottom: 50px; }
 
 /*# sourceMappingURL=climb-event.css.map */
diff --git a/themes/css/climb-event.css.map b/themes/css/climb-event.css.map
index 0b1706b..9ab86e3 100644
--- a/themes/css/climb-event.css.map
+++ b/themes/css/climb-event.css.map
@@ -1,6 +1,6 @@
 {
 "version": 3,
-"mappings": "AAAA,YAAa;EACX,OAAO,EAAE,KAAK;EACd,KAAK,EAAE,IAAI;;AAGb,YAAa;EACX,KAAK,EAAE,IAAI;EACX,QAAQ,EAAE,QAAQ;EAClB,QAAQ,EAAE,MAAM;EAChB,MAAM,EAAE,KAAK;EAEb,wBAAyB;IAN3B,YAAa;MAOT,KAAK,EAAE,IAAI;EAGb,wBAAyB;IAV3B,YAAa;MAWT,KAAK,EAAE,GAAG;EAGZ,wBAAyB;IAd3B,YAAa;MAeT,KAAK,EAAE,GAAG;EAGZ,wBAAyB;IAlB3B,YAAa;MAmBT,KAAK,EAAE,GAAG;;AAId,qBAAsB;EACpB,UAAU,EAAE,UAAU;EACtB,OAAO,EAAE,IAAI;EACb,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,eAAe,EAAE,MAAM;EACvB,cAAc,EAAE,MAAM;EACtB,QAAQ,EAAE,QAAQ;EAClB,OAAO,EAAE,IAAI;;AAGf,mBAAoB;EAClB,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,IAAI;EACjB,IAAI,EAAE,GAAG;EACT,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,CAAC;;AAGR,qBAAsB;EACpB,OAAO,EAAE,CAAC;;AAGZ,oBAAqB;EACjB,QAAQ,EAAE,QAAQ;EAClB,MAAM,EAAC,GAAG;EACV,IAAI,EAAE,GAAG;EACT,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,GAAG;EACZ,wBAAI;IACA,aAAa,EAAE,IAAI;IACnB,KAAK,EAAE,IAAI;EAGf,mDAA+B;IAC3B,OAAO,EAAE,YAAY;IACrB,UAAU,EAAE,IAAI;IAChB,cAAc,EAAE,GAAG;IACnB,WAAW,EAAE,GAAG;EAGpB,oDAAgC;IAC5B,OAAO,EAAE,IAAI;;AAIrB,yBAA0B;EACtB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAC,GAAG;;ACzET,yBAAa;EACT,OAAO,EAAG,IAAI;EACd,6EAA8B;IAC1B,OAAO,EAAE,EAAE;IACX,QAAQ,EAAE,QAAQ;IAClB,OAAO,EAAE,KAAK;IACd,MAAM,EAAG,IAAI;IACb,KAAK,EAAI,IAAI;IACb,mBAAmB,EAXZ,IAAK;EAahB,sCAAe;IACX,SAAS,EAAE,uBAAuB;EAEtC,6BAAM;IACF,SAAS,EAAE,wBAAwB;EAIvC,4BAAK;IACD,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,oBAAoB;AAMvC,gCAAoB;EAChB,UAAU,EAAE,KAAK;EACjB,KAAK,EAAO,IAAI;EAChB,MAAM,EAAM,IAAI",
+"mappings": "AAAA,YAAa;EACX,OAAO,EAAE,KAAK;EACd,KAAK,EAAE,IAAI;;AAGb,YAAa;EACX,KAAK,EAAE,IAAI;EACX,QAAQ,EAAE,QAAQ;EAClB,QAAQ,EAAE,MAAM;EAChB,MAAM,EAAE,KAAK;EAEb,wBAAyB;IAN3B,YAAa;MAOT,KAAK,EAAE,IAAI;EAGb,wBAAyB;IAV3B,YAAa;MAWT,KAAK,EAAE,GAAG;EAGZ,wBAAyB;IAd3B,YAAa;MAeT,KAAK,EAAE,GAAG;EAGZ,wBAAyB;IAlB3B,YAAa;MAmBT,KAAK,EAAE,GAAG;;AAId,qBAAsB;EACpB,UAAU,EAAE,UAAU;EACtB,OAAO,EAAE,IAAI;EACb,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,eAAe,EAAE,MAAM;EACvB,cAAc,EAAE,MAAM;EACtB,QAAQ,EAAE,QAAQ;EAClB,OAAO,EAAE,IAAI;;AAGf,mBAAoB;EAClB,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,IAAI;EACjB,IAAI,EAAE,GAAG;EACT,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,CAAC;;AAGR,qBAAsB;EACpB,OAAO,EAAE,CAAC;;AAGZ,oBAAqB;EACjB,QAAQ,EAAE,QAAQ;EAClB,MAAM,EAAC,GAAG;EACV,IAAI,EAAE,GAAG;EACT,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,GAAG;EACZ,wBAAI;IACA,aAAa,EAAE,IAAI;IACnB,KAAK,EAAE,IAAI;EAGf,mDAA+B;IAC3B,OAAO,EAAE,YAAY;IACrB,UAAU,EAAE,IAAI;IAChB,cAAc,EAAE,GAAG;IACnB,WAAW,EAAE,GAAG;EAGpB,oDAAgC;IAC5B,OAAO,EAAE,IAAI;;AAIrB,yBAA0B;EACtB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAC,GAAG;;ACzET,cAAE;EACE,eAAe,EAAE,IAAI;EACrB,KAAK,EAAE,OAAO;AAElB,yBAAa;EACT,OAAO,EAAG,IAAI;EACd,6EAA8B;IAC1B,OAAO,EAAE,EAAE;IACX,QAAQ,EAAE,QAAQ;IAClB,OAAO,EAAE,KAAK;IACd,MAAM,EAAG,IAAI;IACb,KAAK,EAAI,IAAI;IACb,mBAAmB,EAfZ,IAAK;EAiBhB,sCAAe;IACX,SAAS,EAAE,uBAAuB;EAEtC,6BAAM;IACF,SAAS,EAAE,wBAAwB;EAIvC,4BAAK;IACD,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,oBAAoB;AAKnC,0DAAsB;EAClB,IAAI,EAAE,KAAK;EACX,MAAM,EAAE,KAAK;EACb,KAAK,EAAE,CAAC;EACR,aAAa,EAAE,CAAC;EAChB,MAAM,EAAE,CAAC;EACT,UAAU,EAAE,IAAI;EAChB,cAAc,EAAE,GAAG;AAG3B,kCAAsB;EAClB,UAAU,EAAE,MAAM;EAClB,QAAQ,EAAE,QAAQ;EAClB,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,IAAI;EACX,IAAI,EAAE,KAAK;EACX,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,GAAG;EACX,gBAAgB,EAAE,wBAAqB;EACvC,aAAa,EAAE,IAAI;AAEvB,gCAAoB;EAChB,UAAU,EAAE,OAAO;EACnB,KAAK,EAAO,IAAI;EAChB,MAAM,EAAM,GAAG;AAEnB,kCAAsB;EAClB,SAAS,EAAE,IAAI;AAEnB,iCAAqB;EACjB,MAAM,EAAE,IAAI",
 "sources": ["../sass/base.scss","../sass/climb-event.scss"],
 "names": [],
 "file": "climb-event.css"
diff --git a/themes/sass/climb-event.scss b/themes/sass/climb-event.scss
index 4f4adbe..3771fc7 100644
--- a/themes/sass/climb-event.scss
+++ b/themes/sass/climb-event.scss
@@ -2,6 +2,10 @@
 $animation-length: 0.30s;
 
 .climb-event {
+    a {
+        text-decoration: none;
+        color: #215cff;
+    }
     .climb__tile {
         display : none;
         &:first-child, &:nth-child(2) {
@@ -25,18 +29,39 @@ $animation-length: 0.30s;
             transform: translate3d(0, 0, 0);
         }
     }
-    .climb__tile__content {
 
+    & .climb__tile--has-media {
+        .climb__tile__content {
+            left: 200px;
+            height: 123px;
+            right: 0;
+            border-radius: 0;
+            bottom: 0;
+            text-align: left;
+            flex-direction: row;
+        }
+    }
+    .climb__tile__content {
+        text-align: center;
+        position: absolute;
+        height: auto;
+        width: auto;
+        left: 100px;
+        right: 100px;
+        bottom: 45%;
+        background-color: rgba(255,255,255,0.8);
+        border-radius: 10px;
     }
     .climb__tile__image {
-        object-fit: cover;
+        object-fit: contain;
         width     : 100%;
-        height    : 100%;
+        height    : 85%;
     }
     .climb__tile__message {
-
+        font-size: 150%;
     }
     .climb__tile__author {
+        bottom: 50px;
         img {
 
         }
