version bump and new filter added: maven

Author: una

.publish

@@ -0,0 +1 @@
+Subproject commit 7b5bea875657c1df5b9383a4500970b0373493d6

site/css/demo-site.css

@@ -199,9 +199,8 @@
     z-index: 3; }
 
   .gingham::after {
-    background: -webkit-linear-gradient(left, rgba(66, 10, 14, 0.2), transparent);
-    background: linear-gradient(to right, rgba(66, 10, 14, 0.2), transparent);
-    mix-blend-mode: darken; }
+    background: lavender;
+    mix-blend-mode: soft-light; }
 
 /*
  *
@@ -1015,6 +1014,47 @@
     background: #382c34;
     mix-blend-mode: color-dodge; }
 
+/*
+ *
+ * Maven
+ *
+ */
+
+.maven {
+  position: relative;
+  -webkit-filter: sepia(0.25) brightness(0.95) contrast(0.95) saturate(1.5);
+          filter: sepia(0.25) brightness(0.95) contrast(0.95) saturate(1.5); }
+  
+  .maven img {
+    width: 100%;
+    z-index: 1; }
+  
+  .maven:before {
+    content: '';
+    display: block;
+    height: 100%;
+    width: 100%;
+    top: 0;
+    left: 0;
+    position: absolute;
+    pointer-events: none;
+    z-index: 2; }
+  
+  .maven:after {
+    content: '';
+    display: block;
+    height: 100%;
+    width: 100%;
+    top: 0;
+    left: 0;
+    position: absolute;
+    pointer-events: none;
+    z-index: 3; }
+  
+  .maven:after {
+    background: rgba(3, 230, 26, 0.2);
+    mix-blend-mode: hue; }
+
 ::-moz-selection {
   background: #9b1c9b;
   color: white; }
@@ -1058,7 +1098,6 @@ pre, code {
 
 code {
   font-family: monospace;
-  padding: 0;
   padding: .25em .5em; }
 
 .highlight {

site/css/demo-site.min.css

@@ -129,7 +129,13 @@ <h2 class="title--top-sub">A tiny (&lt;1kb gzipped!) library for recreating <a h
               <figcaption>Lo-Fi</figcaption>
             </figure>
           </li>
-                                                            <li class="demo__item">
+                                              <li class="demo__item">
+            <figure class="maven">
+              <img>
+              <figcaption>Maven</figcaption>
+            </figure>
+          </li>
+                                <li class="demo__item">
             <figure class="mayfair">
               <img>
               <figcaption>Mayfair</figcaption>
@@ -274,7 +280,8 @@ <h3>Available Classes</h3>
                                               <li>Kelvin: <code>class="kelvin"</code></li>
                                 <li>Lark: <code>class="lark"</code></li>
                                 <li>Lo-Fi: <code>class="lofi"</code></li>
-                                                            <li>Mayfair: <code>class="mayfair"</code></li>
+                                              <li>Maven: <code>class="maven"</code></li>
+                                <li>Mayfair: <code>class="mayfair"</code></li>
                                 <li>Moon: <code>class="moon"</code></li>
                                 <li>Nashville: <code>class="nashville"</code></li>
                                 <li>Perpetua: <code>class="perpetua"</code></li>
@@ -333,7 +340,8 @@ <h3>Available Extends</h3>
                                               <li>Kelvin: <code>@extend %kelvin;</code></li>
                                 <li>Lark: <code>@extend %lark;</code></li>
                                 <li>Lo-Fi: <code>@extend %lofi;</code></li>
-                                                            <li>Mayfair: <code>@extend %mayfair;</code></li>
+                                              <li>Maven: <code>@extend %maven;</code></li>
+                                <li>Mayfair: <code>@extend %mayfair;</code></li>
                                 <li>Moon: <code>@extend %moon;</code></li>
                                 <li>Nashville: <code>@extend %nashville;</code></li>
                                 <li>Perpetua: <code>@extend %perpetua;</code></li>
@@ -398,7 +406,8 @@ <h3>Available Mixins</h3>
                                               <li>Kelvin: <code>@include kelvin();</code></li>
                                 <li>Lark: <code>@include lark();</code></li>
                                 <li>Lo-Fi: <code>@include lofi();</code></li>
-                                                            <li>Mayfair: <code>@include mayfair();</code></li>
+                                              <li>Maven: <code>@include maven();</code></li>
+                                <li>Mayfair: <code>@include mayfair();</code></li>
                                 <li>Moon: <code>@include moon();</code></li>
                                 <li>Nashville: <code>@include nashville();</code></li>
                                 <li>Perpetua: <code>@include perpetua();</code></li>

site/index.html

@@ -2117,7 +2117,7 @@ <h3>CSSgram</h3>
 
     </section>
       <section id="Maven">
-      <h2 class="filter-header"><a href="#Maven">Maven</a> <span class="done  done--nope">✗</span></h2>
+      <h2 class="filter-header"><a href="#Maven">Maven</a> <span class="done  done--yep">✓</span></h2>
 
       <div class="headers">
         <h3>Instagram</h3>

site/test/index.html

@@ -198,9 +198,8 @@
     z-index: 3; }
 
   .gingham::after {
-    background: -webkit-linear-gradient(left, rgba(66, 10, 14, 0.2), transparent);
-    background: linear-gradient(to right, rgba(66, 10, 14, 0.2), transparent);
-    mix-blend-mode: darken; }
+    background: lavender;
+    mix-blend-mode: soft-light; }
 
 /*
  *
@@ -1013,3 +1012,44 @@
   .kelvin::before {
     background: #382c34;
     mix-blend-mode: color-dodge; }
+
+/*
+ *
+ * Maven
+ *
+ */
+
+.maven {
+  position: relative;
+  -webkit-filter: sepia(0.25) brightness(0.95) contrast(0.95) saturate(1.5);
+          filter: sepia(0.25) brightness(0.95) contrast(0.95) saturate(1.5); }
+  
+  .maven img {
+    width: 100%;
+    z-index: 1; }
+  
+  .maven:before {
+    content: '';
+    display: block;
+    height: 100%;
+    width: 100%;
+    top: 0;
+    left: 0;
+    position: absolute;
+    pointer-events: none;
+    z-index: 2; }
+  
+  .maven:after {
+    content: '';
+    display: block;
+    height: 100%;
+    width: 100%;
+    top: 0;
+    left: 0;
+    position: absolute;
+    pointer-events: none;
+    z-index: 3; }
+  
+  .maven:after {
+    background: rgba(3, 230, 26, 0.2);
+    mix-blend-mode: hue; }

source/css/cssgram.css

@@ -36,6 +36,5 @@
     z-index: 3; }
 
   .gingham::after {
-    background: -webkit-linear-gradient(left, rgba(66, 10, 14, 0.2), transparent);
-    background: linear-gradient(to right, rgba(66, 10, 14, 0.2), transparent);
-    mix-blend-mode: darken; }
+    background: lavender;
+    mix-blend-mode: soft-light; }

source/css/cssgram.min.css

@@ -8,11 +8,11 @@
   position: relative;
   -webkit-filter: sepia(0.25) brightness(0.95) contrast(0.95) saturate(1.5);
           filter: sepia(0.25) brightness(0.95) contrast(0.95) saturate(1.5); }
-
+  
   .maven img {
     width: 100%;
     z-index: 1; }
-
+  
   .maven:before {
     content: '';
     display: block;
@@ -23,7 +23,7 @@
     position: absolute;
     pointer-events: none;
     z-index: 2; }
-
+  
   .maven:after {
     content: '';
     display: block;
@@ -34,7 +34,7 @@
     position: absolute;
     pointer-events: none;
     z-index: 3; }
-
+  
   .maven:after {
-    background: rgba(3,230,26,0.20);
+    background: rgba(3, 230, 26, 0.2);
     mix-blend-mode: hue; }