From 3add294991933ee92bdb2b9b58843d50c70c7c6b Mon Sep 17 00:00:00 2001
From: Caryn Humphreys <c.humphreys@vehikl.com>
Date: Wed, 26 Oct 2016 20:03:14 -0400
Subject: [PATCH] adds helena filter

---
 site/filters.json        |  2 +-
 source/css/helena.css    | 41 +++++++++++++++++++++++++++++++++++++++
 source/scss/cssgram.scss |  3 ++-
 source/scss/helena.scss  | 42 ++++++++++++++++++++++++++++++++++++++++
 4 files changed, 86 insertions(+), 2 deletions(-)
 create mode 100644 source/css/helena.css
 create mode 100644 source/scss/helena.scss

diff --git a/site/filters.json b/site/filters.json
index d762217..001ab12 100644
--- a/site/filters.json
+++ b/site/filters.json
@@ -72,7 +72,7 @@
         },
         {
             "name": "Helena",
-            "is_done": false,
+            "is_done": true,
             "usage": "helena"
         },
         {
diff --git a/source/css/helena.css b/source/css/helena.css
new file mode 100644
index 0000000..0fea3b1
--- /dev/null
+++ b/source/css/helena.css
@@ -0,0 +1,41 @@
+/*
+ *
+ * Helena
+ *
+ */
+
+.helena {
+  position: relative;
+  -webkit-filter: hue-rotate(-18deg) sepia(0.3) saturate(1.3);
+          filter: hue-rotate(-18deg) sepia(0.3) saturate(1.3); }
+  
+  .helena img {
+    width: 100%;
+    z-index: 1; }
+  
+  .helena:before {
+    content: '';
+    display: block;
+    height: 100%;
+    width: 100%;
+    top: 0;
+    left: 0;
+    position: absolute;
+    pointer-events: none;
+    z-index: 2; }
+  
+  .helena:after {
+    content: '';
+    display: block;
+    height: 100%;
+    width: 100%;
+    top: 0;
+    left: 0;
+    position: absolute;
+    pointer-events: none;
+    z-index: 3; }
+  
+  .helena::after {
+    background: #007ccc;
+    mix-blend-mode: soft-light;
+    opacity: .3; }
diff --git a/source/scss/cssgram.scss b/source/scss/cssgram.scss
index e1776c7..e605511 100644
--- a/source/scss/cssgram.scss
+++ b/source/scss/cssgram.scss
@@ -22,4 +22,5 @@
 @import 'brannan';
 @import 'valencia';
 @import 'kelvin';
-@import 'maven';
\ No newline at end of file
+@import 'maven';
+@import 'helena';
diff --git a/source/scss/helena.scss b/source/scss/helena.scss
new file mode 100644
index 0000000..58271de
--- /dev/null
+++ b/source/scss/helena.scss
@@ -0,0 +1,42 @@
+/*
+ *
+ * Helena
+ *
+ */
+@import 'shared';
+
+// mixin to extend helena filter
+// @mixin helena
+// @param $filters... {filter} - Zero to many css filters to be added
+// @example
+//   img {
+//     @include helena;
+//   }
+//   or
+//   img {
+//     @include helena(blur(2px));
+//   }
+//   or
+//   img {
+//     @include helena(blur(2px)) {
+//       /*...*/
+//     };
+//   }
+@mixin helena($filters...) {
+  @include filter-base;
+  filter: hue-rotate(-18deg) sepia(0.3) saturate(1.3) $filters;
+
+  &::after {
+    background: #007ccc;
+    mix-blend-mode: soft-light;
+    opacity: .3;
+  }
+
+  @content;
+}
+
+// helena Instagram filter
+%helena,
+.helena {
+  @include helena;
+}