sugarcss 1.0.0

data/stylesheets/sugar/vendors/animatecss/specials/_hinge.scss

@@ -0,0 +1,29 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, hinge) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, hinge); @keyframes hinge {
+  0% {
+    transform-origin: top left;
+    animation-timing-function: ease-in-out;
+  }
+
+  20%, 60% {
+    transform: rotate3d(0, 0, 1, 80deg);
+    transform-origin: top left;
+    animation-timing-function: ease-in-out;
+  }
+
+  40%, 80% {
+    transform: rotate3d(0, 0, 1, 60deg);
+    transform-origin: top left;
+    animation-timing-function: ease-in-out;
+    opacity: 1;
+  }
+
+  100% {
+    transform: translate3d(0, 700px, 0);
+    opacity: 0;
+  }
+}
+
+%hinge {
+  animation-name: hinge;
+}
+}

data/stylesheets/sugar/vendors/animatecss/specials/_rollIn.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rollIn) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rollIn); /* originally authored by Nick Pettit - https://github%com/nickpettit/glide */
+
+@keyframes rollIn {
+  from {
+    opacity: 0;
+    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
+  }
+
+  100% {
+    opacity: 1;
+    transform: none;
+  }
+}
+
+%rollIn {
+  animation-name: rollIn;
+}
+}

data/stylesheets/sugar/vendors/animatecss/specials/_rollOut.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rollOut) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rollOut); /* originally authored by Nick Pettit - https://github%com/nickpettit/glide */
+
+@keyframes rollOut {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
+  }
+}
+
+%rollOut {
+  animation-name: rollOut;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_entrances/_zoomIn.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomIn) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomIn); @keyframes zoomIn {
+  from {
+    opacity: 0;
+    transform: scale3d(.3, .3, .3);
+  }
+
+  50% {
+    opacity: 1;
+  }
+}
+
+%zoomIn {
+  animation-name: zoomIn;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_entrances/_zoomInDown.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomInDown) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomInDown); @keyframes zoomInDown {
+  from {
+    opacity: 0;
+    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
+  }
+
+  60% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+  }
+}
+
+%zoomInDown {
+  animation-name: zoomInDown;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_entrances/_zoomInLeft.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomInLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomInLeft); @keyframes zoomInLeft {
+  from {
+    opacity: 0;
+    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
+  }
+
+  60% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+  }
+}
+
+%zoomInLeft {
+  animation-name: zoomInLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_entrances/_zoomInRight.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomInRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomInRight); @keyframes zoomInRight {
+  from {
+    opacity: 0;
+    transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
+  }
+
+  60% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+  }
+}
+
+%zoomInRight {
+  animation-name: zoomInRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_entrances/_zoomInUp.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomInUp) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomInUp); @keyframes zoomInUp {
+  from {
+    opacity: 0;
+    transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
+  }
+
+  60% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+  }
+}
+
+%zoomInUp {
+  animation-name: zoomInUp;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_exits/_zoomOut.scss

@@ -0,0 +1,19 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomOut) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomOut); @keyframes zoomOut {
+  from {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0;
+    transform: scale3d(.3, .3, .3);
+  }
+
+  100% {
+    opacity: 0;
+  }
+}
+
+%zoomOut {
+  animation-name: zoomOut;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_exits/_zoomOutDown.scss

@@ -0,0 +1,19 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomOutDown) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomOutDown); @keyframes zoomOutDown {
+  40% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
+  }
+
+  100% {
+    opacity: 0;
+    transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
+    transform-origin: center bottom;
+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+  }
+}
+
+%zoomOutDown {
+  animation-name: zoomOutDown;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_exits/_zoomOutLeft.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomOutLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomOutLeft); @keyframes zoomOutLeft {
+  40% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
+  }
+
+  100% {
+    opacity: 0;
+    transform: scale(.1) translate3d(-2000px, 0, 0);
+    transform-origin: left center;
+  }
+}
+
+%zoomOutLeft {
+  animation-name: zoomOutLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_exits/_zoomOutRight.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomOutRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomOutRight); @keyframes zoomOutRight {
+  40% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
+  }
+
+  100% {
+    opacity: 0;
+    transform: scale(.1) translate3d(2000px, 0, 0);
+    transform-origin: right center;
+  }
+}
+
+%zoomOutRight {
+  animation-name: zoomOutRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/zooming_exits/_zoomOutUp.scss

@@ -0,0 +1,19 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, zoomOutUp) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, zoomOutUp); @keyframes zoomOutUp {
+  40% {
+    opacity: 1;
+    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
+    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
+  }
+
+  100% {
+    opacity: 0;
+    transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
+    transform-origin: center bottom;
+    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
+  }
+}
+
+%zoomOutUp {
+  animation-name: zoomOutUp;
+}
+}

data/stylesheets/sugar/vendors/cssgram/_1977.scss

@@ -0,0 +1,16 @@
+$cssgram : () !default;/*
+ * 1977
+ *
+ */
+
+
+
+$cssgram : append($cssgram, _1977); 
 %cssgram-_1977 {
+  @extend %filter-base;
+  filter: contrast(1.1) brightness(1.1) saturate(1.3);
+
+  &:after{
+    background: rgba(243, 106, 188, .3);
+    mix-blend-mode: screen;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_aden.scss

@@ -0,0 +1,18 @@
+$cssgram : () !default;/*
+ *
+ * Aden
+ *
+ */
+
+
+
+
+$cssgram : append($cssgram, aden); 
 %cssgram-aden {
+  @extend %filter-base;
+  filter: hue-rotate(-20deg) contrast(.9) saturate(.85) brightness(1.2);
+
+  &::after {
+    background: linear-gradient(to right, rgba(66, 10, 14, .2), transparent);
+    mix-blend-mode: darken;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_brooklyn.scss

@@ -0,0 +1,17 @@
+$cssgram : () !default;/*
+ *
+ * Brooklyn
+ *
+ */
+
+
+
+$cssgram : append($cssgram, brooklyn); 
 %cssgram-brooklyn {
+  @extend %filter-base;
+  filter: contrast(.9) brightness(1.1);
+
+  &::after {
+    background: radial-gradient(circle, rgba(168, 223, 193, .4) 70%, rgb(196, 183, 200));
+    mix-blend-mode: overlay;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_cssgram.scss

@@ -0,0 +1,18 @@
+$cssgram : () !default;@import 'shared';
+@import 'aden';
+@import 'inkwell';
+@import 'perpetua';
+@import 'reyes';
+@import 'gingham';
+@import 'toaster';
+@import 'walden';
+@import 'hudson';
+@import 'earlybird';
+@import 'mayfair';
+@import 'lofi';
+@import '1977';
+@import 'brooklyn';
+@import 'xpro2';
+@import 'nashville';
+@import 'lark';
+@import 'moon';

data/stylesheets/sugar/vendors/cssgram/_earlybird.scss

@@ -0,0 +1,17 @@
+$cssgram : () !default;/*
+ *
+ * Earlybird
+ *
+ */
+
+
+
+$cssgram : append($cssgram, earlybird); 
 %cssgram-earlybird {
+  @extend %filter-base;
+  filter: contrast(.9) sepia(.2);
+
+  &::after {
+    background: radial-gradient(circle, rgb(208, 186, 142) 20%, rgb(54, 3, 9) 85%, rgb(29, 2, 16) 100%);
+    mix-blend-mode: overlay;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_gingham.scss

@@ -0,0 +1,17 @@
+$cssgram : () !default;/*
+ *
+ * Gingham
+ *
+ */
+
+
+
+$cssgram : append($cssgram, gingham); 
 %cssgram-gingham {
+  @extend %filter-base;
+  filter: brightness(1.05) hue-rotate(-10deg);
+
+  &::after {
+    background: linear-gradient(to right, rgba(66, 10, 14, .2), transparent);
+    mix-blend-mode: darken;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_hudson.scss

@@ -0,0 +1,18 @@
+$cssgram : () !default;/*
+ *
+ * Hudson
+ *
+ */
+
+
+ //needs work!
+$cssgram : append($cssgram, hudson); 
 %cssgram-hudson {
+  @extend %filter-base;
+  filter: brightness(1.2) contrast(.9) saturate(1.1);
+
+  &::after {
+    background: radial-gradient(circle, rgb(166, 177, 255) 50%, rgb(52, 33, 52));
+    mix-blend-mode: multiply;
+    opacity: .5;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_inkwell.scss

@@ -0,0 +1,11 @@
+$cssgram : () !default;/*
+ *
+ * Inkwell
+ *
+ */
+
+
+$cssgram : append($cssgram, inkwell); 
 %cssgram-inkwell {
+  @extend %filter-base;
+  filter: sepia(.3) contrast(1.1) brightness(1.1) grayscale(1);
+}

data/stylesheets/sugar/vendors/cssgram/_lark.scss

@@ -0,0 +1,21 @@
+$cssgram : () !default;/*
+ * Lark
+ *
+ */
+
+
+
+$cssgram : append($cssgram, lark); 
 %cssgram-lark {
+  @extend %filter-base;
+  filter: contrast(.9);
+
+  &::after {
+    background: rgba(242, 242, 242, .8);
+    mix-blend-mode: darken;
+  }
+
+  &::before {
+    background: rgb(34, 37, 63);
+    mix-blend-mode: color-dodge;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_lofi.scss

@@ -0,0 +1,16 @@
+$cssgram : () !default;/*
+ * Lo-fi
+ *
+ */
+
+
+
+$cssgram : append($cssgram, lofi); 
 %cssgram-lofi {
+  @extend %filter-base;
+  filter: saturate(1.1) contrast(1.5);
+
+  &::after {
+    background: radial-gradient(circle, transparent 70%, rgb(34, 34, 34) 150%);
+    mix-blend-mode: multiply;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_mayfair.scss

@@ -0,0 +1,18 @@
+$cssgram : () !default;/*
+ *
+ * Mayfair
+ *
+ */
+
+
+
+$cssgram : append($cssgram, mayfair); 
 %cssgram-mayfair {
+  @extend %filter-base;
+  filter: contrast(1.1) saturate(1.1);
+
+  &::after {
+    background: radial-gradient(circle at 40% 40%, rgba(255, 255, 255, .8), rgba(255, 200, 200, .6), rgb(17, 17, 17) 60%);
+    mix-blend-mode: overlay;
+    opacity: .4;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_moon.scss

@@ -0,0 +1,21 @@
+$cssgram : () !default;/*
+ * Moon
+ *
+ */
+
+
+
+$cssgram : append($cssgram, moon); 
 %cssgram-moon {
+  @extend %filter-base;
+  filter: grayscale(1) contrast(1.1) brightness(1.1);
+
+  &::before {
+    background: rgb(160, 160, 160);
+    mix-blend-mode: soft-light;
+  }
+
+  &::after {
+    background: rgb(56, 56, 56);
+    mix-blend-mode: lighten;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_nashville.scss

@@ -0,0 +1,22 @@
+$cssgram : () !default;/*
+ *
+ * Nashville
+ *
+ */
+
+
+
+$cssgram : append($cssgram, nashville); 
 %cssgram-nashville {
+  @extend %filter-base;
+  filter: sepia(.2) contrast(1.2) brightness(1.05) saturate(1.2);
+
+  &::after {
+    background: rgba(0, 70, 150, .4);
+    mix-blend-mode: lighten;
+  }
+
+  &::before {
+    background: rgba(247, 176, 153, .56);
+    mix-blend-mode: darken;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_perpetua.scss

@@ -0,0 +1,17 @@
+$cssgram : () !default;/*
+ *
+ * Perpetua
+ *
+ */
+
+
+
+$cssgram : append($cssgram, perpetua); 
 %cssgram-perpetua {
+  @extend %filter-base;
+
+  &::after {
+    background: linear-gradient(to bottom, rgb(0, 91, 154), rgb(230, 193, 61));
+    mix-blend-mode: soft-light;
+    opacity: .5;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_reyes.scss

@@ -0,0 +1,18 @@
+$cssgram : () !default;/*
+ *
+ * Reyes
+ *
+ */
+
+
+
+$cssgram : append($cssgram, reyes); 
 %cssgram-reyes {
+  @extend %filter-base;
+  filter: sepia(.22) brightness(1.1) contrast(.85) saturate(.75);
+
+   &::after {
+    background: rgb(239, 205, 173);
+    mix-blend-mode: soft-light;
+    opacity: .5;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_shared.scss

@@ -0,0 +1,29 @@
+$cssgram : () !default;%pseudo-elem {
+  content: '';
+  display: block;
+  height: 100%;
+  width: 100%;
+  top: 0;
+  left: 0;
+  position: absolute;
+  pointer-events: none;
+}
+
+%filter-base {
+  position: relative;
+
+  img {
+    width: 100%;
+    z-index: 1;
+  }
+
+  &:before {
+    @extend %pseudo-elem;
+    z-index: 2;
+  }
+
+  &:after {
+    @extend %pseudo-elem;
+    z-index: 3;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_toaster.scss

@@ -0,0 +1,17 @@
+$cssgram : () !default;/*
+ *
+ * Toaster
+ *
+ */
+
+
+
+$cssgram : append($cssgram, toaster); 
 %cssgram-toaster {
+  @extend %filter-base;
+  filter: contrast(1.5) brightness(.9);
+
+  &::after {
+    background: radial-gradient(circle, rgb(128, 78, 15), rgb(59, 0, 59));
+    mix-blend-mode: screen;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_walden.scss

@@ -0,0 +1,18 @@
+$cssgram : () !default;/*
+ *
+ * Walden
+ *
+ */
+
+
+
+$cssgram : append($cssgram, walden); 
 %cssgram-walden {
+  @extend %filter-base;
+  filter: brightness(1.1) hue-rotate(-10deg) sepia(.3) saturate(1.6);
+
+  &::after {
+    background: rgb(0, 68, 204);
+    mix-blend-mode: screen;
+    opacity: .3;
+  }
+}

data/stylesheets/sugar/vendors/cssgram/_xpro2.scss

@@ -0,0 +1,17 @@
+$cssgram : () !default;/*
+ *
+ * X-Pro II
+ *
+ */
+
+
+
+$cssgram : append($cssgram, xpro2); 
 %cssgram-xpro2 {
+  @extend %filter-base;
+  filter: sepia(.3);
+
+  &::after {
+    background: radial-gradient(circle, rgb(230, 231, 224) 40%, rgba(43, 42, 161, .6) 110%);
+    mix-blend-mode: color-burn;
+  }
+}