From cd13eca15e7dca8202b7701baecd0991495467e0 Mon Sep 17 00:00:00 2001
From: fatimarafiqui <fatima.rafiqui@gmail.com>
Date: Mon, 3 Oct 2016 00:28:10 +0530
Subject: [PATCH] Added Sutro filter

---
 site/filters.json        |  2 +-
 source/scss/cssgram.scss |  3 ++-
 source/scss/sutro.scss   | 42 ++++++++++++++++++++++++++++++++++++++++
 3 files changed, 45 insertions(+), 2 deletions(-)
 create mode 100644 source/scss/sutro.scss

diff --git a/site/filters.json b/site/filters.json
index f9aab7e..8374661 100644
--- a/site/filters.json
+++ b/site/filters.json
@@ -167,7 +167,7 @@
         },
         {
             "name": "Sutro",
-            "is_done": false,
+            "is_done": true,
             "usage": "sutro"
         },
         {
diff --git a/source/scss/cssgram.scss b/source/scss/cssgram.scss
index d05975e..bdb09cf 100644
--- a/source/scss/cssgram.scss
+++ b/source/scss/cssgram.scss
@@ -20,4 +20,5 @@
 @import 'willow';
 @import 'rise';
 @import 'slumber';
-@import 'brannan'
\ No newline at end of file
+@import 'brannan';
+@import 'sutro';
\ No newline at end of file
diff --git a/source/scss/sutro.scss b/source/scss/sutro.scss
new file mode 100644
index 0000000..9a2cfa1
--- /dev/null
+++ b/source/scss/sutro.scss
@@ -0,0 +1,42 @@
+/*
+ *
+ * Sutro
+ *
+ */
+@import 'shared';
+
+// mixin to extend sutro filter
+// @mixin sutro
+// @param $filters... {filter} - Zero to many css filters to be added
+// @example
+//   img {
+//     @include sutro;
+//   }
+//   or
+//   img {
+//     @include sutro(blur(2px));
+//   }
+//   or
+//   img {
+//     @include sutro(blur(2px)) {
+//       /*...*/
+//     };
+//   }
+@mixin sutro($filters...) {
+  @extend %filter-base;
+  filter: brightness(0.75) contrast(1.3) sepia(0.5) hue-rotate(-25deg) $filters;
+
+  &::after {
+    background: rgba(0, 70, 150, 0);
+    mix-blend-mode: initial;
+  }
+
+
+  @content;
+}
+
+// sutro Instagram filter
+%sutro,
+.sutro {
+  @include sutro;
+}