1 files changed, 97 insertions, 0 deletions
diff --git a/app/assets/stylesheets/vendor/survival-kit/_effects.scss b/app/assets/stylesheets/vendor/survival-kit/_effects.scss
new file mode 100644
index 0000000..488a83a
--- /dev/null
+++ b/app/assets/stylesheets/vendor/survival-kit/_effects.scss
@@ -0,0 +1,97 @@
+// Survival ✚ Kit
+
+// Add a Bendy shadow to a squar element.
+// @author Chris Eppstein
+@mixin bendy-shadow($width, $angle: 5deg, $color: rgba(#333, 0.5)) {
+  @include box-shadow(0 10px 5px -5px $color);
+  position: relative;
+  z-index: 1;
+  &:before, &:after {
+    @include box-shadow(0 10px 10px 1px $color);
+    bottom: 2px;
+    content: "";
+    height: 10px;
+    position: absolute;
+    width: $width / 2;
+    z-index: -1;
+  }
+  &:before {
+    @include rotate(-$angle);
+    left: 10px;
+  }
+  &:after {
+    @include rotate($angle);
+    right: 10px;
+  }
+}
+
+// Sexy button !
+@mixin shiny-button($light-color: #92CE2F, $dark-mix-color: #32D17C, $mix-percent: 40%) {
+  // Params
+  $bg-light:   $light-color;
+  $bg-dark: darken(mix($dark-mix-color, $bg-light, $mix-percent), 13%);
+
+  $border-inset-color: $bg-light;
+  $border-inside-light: lighten($border-inset-color, 13%);
+  $border-inside-dark: $border-inset-color;
+
+  $border-outside: darken($bg-dark, 9%);
+  $box-shadow:  rgba(35, 35, 35, 0.2);
+  $text-shadow: darken($bg-dark, 7%);
+
+  @extend .bradius-inner;
+  @include box-shadow(inset 1px 1px 0px $border-inside-light, inset -1px -1px 0px $border-inside-dark);
+  @include gradient($bg-light, $bg-dark);
+  @include text-shadow(2px 2px 1px $text-shadow);
+  border:1px solid $border-outside;
+  color:#FFF !important;
+
+  font-size:size(13px);
+  font-weight: bold;
+  padding: 9px 60px;
+  text-decoration: none;
+  text-decoration: none !important;
+  &:hover {
+    @include box-shadow(inset 0px 0px 1px $border-inside-light, 0px 2px 1px $box-shadow);
+    @include gradient(lighten($bg-light, 6%), lighten($bg-dark, 6%));
+  }
+  &:active {
+    @include box-shadow(inset 0px 2px 3px $bg-dark);
+    background: mix($bg-light, $bg-dark, 50%);
+  }
+  &.small {
+    font-size: 12px;
+    padding: 7px 22px;
+  }
+}
+
+//
+// @TODO: Add docs to shiny-button-colors!
+//
+@mixin shiny-button-colors($light-color: #92CE2F, $dark-mix-color: #32D17C, $mix-percent: 40%) {
+  // Params
+  $bg-light:   $light-color;
+  $bg-dark: darken(mix($dark-mix-color, $bg-light, $mix-percent), 13%);
+
+  $border-inset-color: $bg-light;
+  $border-inside-light: lighten($border-inset-color, 13%);
+  $border-inside-dark: $border-inset-color;
+
+  $border-outside: darken($bg-dark, 9%);
+  $box-shadow:  rgba(35, 35, 35, 0.2);
+  $text-shadow: darken($bg-dark, 7%);
+
+
+  @include box-shadow(inset 1px 1px 0px $border-inside-light, inset -1px -1px 0px $border-inside-dark);
+  @include gradient($bg-light, $bg-dark);
+  @include text-shadow(2px 2px 1px $text-shadow);
+  border:1px solid $border-outside;
+  &:hover {
+    @include box-shadow(inset 0px 0px 1px $border-inside-light, 0px 2px 1px $box-shadow);
+    @include gradient(lighten($bg-light, 6%), lighten($bg-dark, 6%));
+  }
+  &:active {
+    @include box-shadow(inset 0px 2px 3px $bg-dark);
+    background: mix($bg-light, $bg-dark, 50%);
+  }
+}
+\ No newline at end of file