sakura_toolkit 0.0.2

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 2541b2329b1ee22e491160c8532077cb15c65a5b
+  data.tar.gz: 08a97c2abe93735a87d9cd7ad62bd88642ee3e35
+SHA512:
+  metadata.gz: 47ad299e965da46328d0c99813b3bea6b710964964845fa1a02f5aacca9daff75238756b14bf92ef61b61fba28aa2168b27f92a5148d794dee5aac7260acc799
+  data.tar.gz: 9bb283ee9a0f996247c934fc19a11ea977cf92927e4d975928dd47b8c44d8921dd191cd6c7b819d141c4ba94e0cc72c1c4a2366bba58b734a772962ae423f663

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright 2016 Thomas Cullen
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/Rakefile

@@ -0,0 +1,34 @@
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+require 'rdoc/task'
+
+RDoc::Task.new(:rdoc) do |rdoc|
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title    = 'SakuraToolkit'
+  rdoc.options << '--line-numbers'
+  rdoc.rdoc_files.include('README.rdoc')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+
+
+
+
+
+Bundler::GemHelper.install_tasks
+
+require 'rake/testtask'
+
+Rake::TestTask.new(:test) do |t|
+  t.libs << 'lib'
+  t.libs << 'test'
+  t.pattern = 'test/**/*_test.rb'
+  t.verbose = false
+end
+
+
+task default: :test

data/bin/sakura

@@ -0,0 +1,3 @@
+#!/usr/bin/env ruby
+require File.dirname(__FILE__) + '/../lib/sakura_toolkit/cli.rb'
+SakuraToolkit::Cli.start

data/lib/sakura_toolkit.rb

@@ -0,0 +1,3 @@
+module SakuraToolkit
+  require 'sakura_toolkit/engine' if defined?(Rails)
+end

data/lib/sakura_toolkit/cli.rb

@@ -0,0 +1,27 @@
+require 'pathname'
+require 'fileutils'
+require 'thor'
+
+module SakuraToolkit
+  class Cli < Thor
+    desc 'install', 'Install sakura to the current directory'
+    def install
+      FileUtils.cp_r sakura_dir_path, install_path
+      FileUtils.cp sakura_path, File.join(install_path, 'sakura.scss')
+    end
+
+    private
+
+    def install_path
+      Dir.pwd
+    end
+
+    def sakura_dir_path
+      File.join(File.dirname(__FILE__), '../../toolkit/sakura/')
+    end
+
+    def sakura_path
+      File.join(File.dirname(__FILE__), '../../toolkit/sakura.scss')
+    end
+  end
+end

data/lib/sakura_toolkit/engine.rb

@@ -0,0 +1,5 @@
+module SakuraToolkit
+  class Engine < ::Rails::Engine
+    config.assets.paths << File.expand_path('../../../toolkit/', __FILE__)
+  end
+end

data/lib/sakura_toolkit/version.rb

@@ -0,0 +1,3 @@
+module SakuraToolkit
+  VERSION = "0.0.2"
+end

data/toolkit/sakura.scss

@@ -0,0 +1,7 @@
+@import 'sakura/ui';
+@import 'sakura/utilities';
+@import 'sakura/animation';
+
+@mixin sakura {
+  @include components;
+}

data/toolkit/sakura/_animation.scss

@@ -0,0 +1,2 @@
+@import 'animation/slides';
+@import 'animation/transitions';

data/toolkit/sakura/_ui.scss

@@ -0,0 +1,9 @@
+@import 'ui/grid';
+@import 'ui/base';
+@import 'ui/recipes';
+@import 'ui/components';
+
+@mixin ui-kit {
+  @include reset;
+  @include ui-typography;
+}

data/toolkit/sakura/_utilities.scss

@@ -0,0 +1,4 @@
+@import 'utilities/reset';
+@import 'utilities/mixins';
+@import 'utilities/functions';
+@import 'utilities/media_queries';

data/toolkit/sakura/_variables.scss

@@ -0,0 +1,2 @@
+/// @type Cubic Bezier
+$easing-pop: cubic-bezier(.65, .2, .25, 1.22) !default;

data/toolkit/sakura/animation/_slides.scss

@@ -0,0 +1,18 @@
+@import '../utilities/mixins';
+
+@mixin animations-slides {
+
+  // slide-in-left
+  @include keyframes('slide-in-left') {
+    0% {
+      opacity: 0;
+      @include transform(translate(200px, 0));
+    }
+
+    100% {
+      opacity: 1;
+      @include transform(translate(0, 0));
+    }
+  }
+
+}

data/toolkit/sakura/animation/_transitions.scss

@@ -0,0 +1,63 @@
+@import '../utilities/mixins';
+
+$pop: cubic-bezier(.65, .2, .25, 1.22);
+
+/// Sets the transition property for an element
+/// @param $values
+///   The values for the transition attribute.
+/// @example scss - Usage
+///   .example {
+///     @include transition(all 0.3s $pop);
+///   }
+@mixin transition($values) {
+  @include prefix(transition, $values, webkit moz);
+}
+
+/// Scales the element
+/// @param $to
+///   The value to scale to.
+/// @param $duration
+///   The amount of time it should take for the transition to occur.
+/// @param $easing
+///   The timing function for the transition.
+/// @example scss - Usage
+///   .example:hover {
+///     @include transition-scale(2);
+///   }
+@mixin transition-scale($to: 1, $duration: .3s, $easing: $pop) {
+  @include visible();
+  @include transition(transform $duration $easing);
+  @include transform(scale($to));
+}
+
+/// Slides the element along the X axis
+/// @param $to
+///   The amount of px's to move the element.
+/// @param $duration
+///   The amount of time it should take for the transition to occur.
+/// @param $easing
+///   The timing function for the transition.
+/// @example scss - Usage
+///   .example:hover {
+///     @include transition-slide-x(100px);
+///   }
+@mixin transition-slide-x($amount: 0, $duration: .3s, $easing: $pop) {
+  @include transition(transform $duration $easing);
+  @include transform(translate($amount, 0));
+}
+
+/// Slides the element along the Y axis
+/// @param $to
+///   The amount of px's to move the element.
+/// @param $duration
+///   The amount of time it should take for the transition to occur.
+/// @param $easing
+///   The timing function for the transition.
+/// @example scss - Usage
+///   .example:hover {
+///     @include transition-slide-y(100px);
+///   }
+@mixin transition-slide-y($amount: 0, $duration: .3s, $easing: $pop) {
+  @include transition(transform $duration $easing);
+  @include transform(translate(0, $amount));
+}

data/toolkit/sakura/ui/_base.scss

@@ -0,0 +1,7 @@
+@import 'typography';
+@import '../utilities/reset';
+
+@mixin ui-base {
+  @include reset;
+  @include ui-typography;
+}

data/toolkit/sakura/ui/_components.scss

@@ -0,0 +1,8 @@
+@import 'components/icons';
+@import 'components/forms';
+@import 'components/buttons';
+
+@mixin components {
+  @include components-icons;
+  @include components-buttons;
+}

data/toolkit/sakura/ui/_grid.scss

@@ -0,0 +1,39 @@
+@import '../utilities/functions';
+
+$sassy-grid-width: 1020 !default;
+$sassy-column-width: 50 !default;
+$sassy-column-padding: 35 !default;
+
+@mixin ui-grid($class: '.grid', $column_selector: '.col') {
+  $column_selector: $column_selector;
+  #{$class} {
+    width: 100%;
+    margin: 0 auto;
+    max-width: $sassy-grid-width;
+
+    $padding-percentage: percentage_of($sassy-column-padding, $sassy-grid-width);
+
+    #{$column_selector} {
+      display: inline-block;
+      box-sizing: border-box;
+      margin-left: $padding-percentage / 2;
+      margin-right: $padding-percentage / 2;
+    }
+
+    @for $i from 1 to 13 {
+      $current-column-width: ($sassy-column-width * $i + $sassy-column-padding * ($i - 1)) / $sassy-grid-width;
+
+      #{$column_selector}-#{$i} {
+        @extend #{$column_selector};
+        width: ($current-column-width * 100%);
+      }
+    }
+
+    // Responsive Columns
+    @media only screen and (max-width : 600px) {
+      @for $i from 1 to 13 {
+        #{$column_selector}-#{$i} { width: 100%; }
+      }
+    }
+  }
+}

data/toolkit/sakura/ui/_recipes.scss

@@ -0,0 +1,3 @@
+@import 'recipes/cards';
+@import 'recipes/modals';
+@import 'recipes/notifications';

data/toolkit/sakura/ui/_typography.scss

@@ -0,0 +1,38 @@
+$textCopy: #707F8E !default;
+$textHeader: #474D54 !default;
+$font-family: 'Lato', sans-serif !default;
+
+@mixin ui-typography($base: 15px) {
+
+  * { font-family: $font-family; }
+  html, body { font-size: $base; }
+
+  h1 {
+    font-weight: 500;
+    font-size: 2.3rem;
+    line-height: 50px;
+    color: $textHeader;
+    margin-bottom: 20px;
+  }
+
+  h2 {
+    font-weight: 500;
+    font-size: 2.8rem;
+    line-height: 44px;
+    color: $textHeader;
+  }
+
+  h3 {
+    font-weight: 300;
+    font-size: 2.4rem;
+    line-height: 32px;
+    color: $textHeader;
+  }
+
+  p{
+    color: $textCopy;
+    line-height: 28px;
+    font-size: inherit;
+    margin-bottom: 30px;
+  }
+}

data/toolkit/sakura/ui/components/_buttons.scss

@@ -0,0 +1,49 @@
+$buttonText: #fff !default;
+$buttonBG: #93A6B8 !default;
+$actionButtonText: #fff !default;
+$actionButtonBG: #459FF5 !default;
+$warningButtonText: #fff !default;
+$warningButtonBG: #FD6686 !default;
+
+@mixin components-buttons($class: '.button') {
+  #{$class} { @extend %button; }
+  #{$class}-warning { @extend %button-warning; }
+  #{$class}-disabled { @extend %button-disabled; }
+}
+
+%button {
+  border: none;
+  cursor: pointer;
+  font-size: 0.9em;
+  border-radius: 3px;
+  color: $buttonText;
+  display: inline-block;
+  text-decoration: none;
+  padding: 8px 15px 8px 15px;
+  background-color: $buttonBG;
+  box-shadow: 0 1px 3px rgba(#000, 0.1);
+  &:hover { background: darken($buttonBG, 5); }
+}
+
+%button-action {
+  @extend %button;
+  color: $actionButtonText;
+  background-color: $actionButtonBG;
+  &:hover { background-color: darken($actionButtonBG, 5); }
+}
+
+%button-warning {
+  @extend %button;
+  color: $warningButtonText;
+  background-color: $warningButtonBG;
+  &:hover { background-color: darken($warningButtonBG, 5); }
+}
+
+%button-disabled {
+  @extend %button;
+  color: #fff;
+  box-shadow: none;
+  cursor: not-allowed;
+  background-color: #D6DDE4;
+  &:hover { background-color: darken(#D6DDE4, 5); }
+}

data/toolkit/sakura/ui/components/_icons.scss

@@ -0,0 +1,11 @@
+@mixin components-icons($class: '.icon') {
+  #{$class} {
+    width: 20px;
+    height: 20px;
+    display: inline-block;
+    vertical-align: middle;
+    background-repeat: no-repeat;
+    background-position: -20px -20px;
+    background-image: url('toolkit/ui/icons.svg');
+  }
+}

data/toolkit/sakura/ui/icons.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="400px" height="400px" viewBox="0 0 400 400" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+    <title>icons</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="icons" sketch:type="MSArtboardGroup" fill="#5C636B">
+            <path d="M30,38 L30,38 C34.418278,38 38,34.418278 38,30 C38,25.581722 34.418278,22 30,22 C25.581722,22 22,25.581722 22,30 C22,34.418278 25.581722,38 30,38 L30,38 Z M30,40 L30,40 C24.4771525,40 20,35.5228475 20,30 C20,24.4771525 24.4771525,20 30,20 C35.5228475,20 40,24.4771525 40,30 C40,35.5228475 35.5228475,40 30,40 L30,40 Z" id="Shape" sketch:type="MSShapeGroup"></path>
+        </g>
+    </g>
+</svg>

data/toolkit/sakura/ui/recipes/_cards.scss

@@ -0,0 +1,10 @@
+@mixin white-tile($padding) {
+  @if $padding {
+    padding: $padding;
+  }
+
+  border-radius: 5px;
+  background-color: white;
+  box-shadow: 0 1px 3px rgba(#000, .15),
+              0 0 10px rgba(#000, .1);
+}

data/toolkit/sakura/ui/recipes/_notifications.scss

@@ -0,0 +1,44 @@
+@import '../../utilities/mixins';
+@import '../../variables';
+
+%notification {
+  @include position(fixed, 10px 10px null null);
+  @include animation(notification 3s $easing-pop forwards);
+  width: 280px;
+  color: #707F8E;
+  font-size: 14px;
+  line-height: 20px;
+  border-radius: 5px;
+  padding: 15px 20px;
+  background-color: white;
+  box-shadow: 0 1px 3px rgba(#000, .15),
+              0 0 10px rgba(#000, .1);
+}
+
+@mixin recipes-notification($class: '.notification') {
+  #{$class} {
+    @extend %notification;
+  }
+
+  @include keyframes(notification) {
+    0% {
+      opacity: 0;
+      @include transform(translate(200px, 0));
+    }
+
+    20% {
+      opacity: 1;
+      @include transform(translate(0, 0));
+    }
+
+    80% {
+      opacity: 1;
+      @include transform(translate(0, 0));
+    }
+
+    100% {
+      opacity: 0;
+      @include transform(translate(0, 100px));
+    }
+  };
+}

data/toolkit/sakura/utilities/_functions.scss

@@ -0,0 +1,3 @@
+@function percentage_of($a, $b) {
+  @return ($a / $b) * 100%;
+}

data/toolkit/sakura/utilities/_media_queries.scss

@@ -0,0 +1,64 @@
+$mobile-width-breakpoint: 420px !default;
+$mobile-height-breakpoint: 700px !default;
+/// Outputs the media query for mobile devices. The mixin can also be used
+/// inside an elements styling.
+/// @example scss - Usage
+///   @incude for-mobile {
+///     .example { ... }
+///   }
+///
+///   .example {
+///     width: 200px;
+///     @include for-mobile { width: 100%; }
+///   }
+@mixin for-mobile($orientation: portrait) {
+  @media only screen
+  and (min-device-width : $mobile-width-breakpoint)
+  and (max-device-width : $mobile-height-breakpoint)
+  and (orientation: $orientation) {
+    @content;
+  }
+}
+
+$tablet-width-breakpoint: 770px !default;
+$tablet-height-breakpoint: 1024px !default;
+/// Outputs the media query for tablet devices. The mixin can also be used
+/// inside an elements styling.
+/// @example scss - Usage
+///   @incude for-tablet {
+///     .example { ... }
+///   }
+///
+///   .example {
+///     width: 200px;
+///     @include for-tablet { width: 100%; }
+///   }
+@mixin for-tablet($orientation: portrait) {
+  @media only screen
+  and (min-device-width : $tablet-width-breakpoint)
+  and (max-device-width : $tablet-height-breakpoint)
+  and (orientation: $orientation) {
+    @content;
+  }
+}
+
+/// Outputs the media query for retina laptop devices. The mixin can also be used
+/// inside an elements styling.
+/// @example scss - Usage
+///   @incude for-retina {
+///     .example { ... }
+///   }
+///
+///   .example {
+///     width: 200px;
+///     @include for-retina { width: 100%; }
+///   }
+@mixin for-retina {
+  @media screen
+  and (min-device-width: 1200px)
+  and (max-device-width: 1600px)
+  and (-webkit-min-device-pixel-ratio: 2)
+  and (min-resolution: 192dpi) {
+    @content;
+  }
+}

data/toolkit/sakura/utilities/_mixins.scss

@@ -0,0 +1,153 @@
+/// Prefixes an attribute with a given list of vendors.
+/// @param $attr
+///   The attribute title.
+/// @param $value
+///   The attribute value.
+/// @param $vendors
+///   The list of vendors you would like to prefix for.
+/// @example scss - Usage
+///   .example {
+///     @include prefix(border-radius, 5px, webkit moz mz);
+///   }
+@mixin prefix($attr, $value, $vendors: webkit moz mz) {
+  #{$attr}: $value;
+  @each $vendor in $vendors {
+    -#{$vendor}-#{$attr}: $value;
+  }
+}
+
+/// Positions an element.
+/// @param $position
+///   The position value for the element styling
+/// @param $positioning
+///   The top, right, bottom and left attribute values in that order. Values
+///   that are set to null will be ignored.
+/// @example scss - Example
+///   .example {
+///     @include position(absolute, 50px null null 20px);
+///   }
+@mixin position($position: absolute, $positioning: null null null null) {
+  position: $position;
+
+  $coordinates: (
+    top:    nth($positioning, 1),
+    left:   nth($positioning, 4),
+    right:  nth($positioning, 2),
+    bottom: nth($positioning, 3)
+  );
+
+  @each $side, $value in $coordinates {
+    @if $value {
+      #{$side}: $value;
+    }
+  }
+}
+
+/// Applys the transform attribute to an element with all of its vendor prefixes
+/// @param $values
+///   The value of the transform attribute
+/// @example scss - Usage
+///   .example {
+///     @include transform(translate(20px, 0));
+///   }
+@mixin transform($values) {
+  @include prefix(transform, $values, webkit moz);
+}
+
+/// Hides an element. This uses opacity and visibility rather than display: none
+/// to hide an element so that it can be used with animations and transitions.
+/// @example scss - Usage
+///   .example {
+///     @include hidden;
+///   }
+@mixin hidden {
+  opacity: 0;
+  visibility: hidden;
+}
+
+/// Makes an element visible. This uses opacity and visiblility so that it can
+/// be used with animations and transitions.
+/// @example scss - Usage
+///   .example {
+///     @include visible;
+///   }
+@mixin visible {
+  opacity: 1;
+  visibility: visible;
+}
+
+/// Generates a triangle
+/// @param $direction
+///   The direction the triangle should be facing
+/// @param $color
+///   The colour of the triangle
+/// @param $size
+///   The size of the triangle
+/// @example scss - Usage
+///   .example {
+///     @include triangle('down', #000, 10px);
+///   }
+@mixin triangle($direction: 'up', $color: #fff, $size: 5px) {
+  width: 0;
+  height: 0;
+  display: block;
+
+  @if $direction == 'top' {
+    border-left: $size solid transparent;
+  	border-right: $size solid transparent;
+  	border-bottom: $size solid $color;
+  } @else if $direction == 'right' {
+    border-top: $size solid transparent;
+    border-bottom: $size solid transparent;
+  	border-left: $size solid $color;
+  } @else if $direction == 'bottom' {
+    border-top: $size solid $color;
+    border-right: $size solid transparent;
+    border-left: $size solid transparent;
+  } @else if $direction == 'left' {
+    border-top: $size solid transparent;
+  	border-right: $size solid $color;
+  	border-bottom: $size solid transparent;
+  } @else if $direction == 'top-left' {
+    border-top: $size solid $color;
+    border-right: $size solid transparent;
+  } @else if $direction == 'top-right' {
+    border-top: $size solid $color;
+    border-left: $size solid transparent;
+  } @else if $direction == 'bottom-left' {
+    border-bottom: $size solid $color;
+    border-right: $size solid transparent;
+  } @else if $direction == 'bottom-right' {
+    border-bottom: $size solid $color;
+    border-left: $size solid transparent;
+  }
+}
+
+// clear-fix
+@mixin clear-fix {
+  &::after {
+    clear: both;
+    content: '';
+    display: table;
+  }
+}
+
+
+@mixin keyframes($animation) {
+  @-webkit-keyframes #{$animation} {
+    @content;
+  }
+
+  @-moz-keyframes #{$animation} {
+    @content;
+  }
+
+  @keyframes #{$animation} {
+    @content;
+  }
+}
+
+
+@mixin animation($values) {
+  @include prefix(animation, $values);
+}

data/toolkit/sakura/utilities/_reset.scss

@@ -0,0 +1,53 @@
+/// Outputs eric meyers CSS reset.
+/// @example scss - Output
+///   @import reset;
+@mixin reset {
+  /* http://meyerweb.com/eric/tools/css/reset/
+   v2.0 | 20110126
+   License: none (public domain)
+  */
+
+  html, body, div, span, applet, object, iframe,
+  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+  a, abbr, acronym, address, big, cite, code,
+  del, dfn, em, img, ins, kbd, q, s, samp,
+  small, strike, strong, sub, sup, tt, var,
+  b, u, i, center,
+  dl, dt, dd, ol, ul, li,
+  fieldset, form, label, legend,
+  table, caption, tbody, tfoot, thead, tr, th, td,
+  article, aside, canvas, details, embed,
+  figure, figcaption, footer, header, hgroup,
+  menu, nav, output, ruby, section, summary,
+  time, mark, audio, video {
+  	margin: 0;
+  	padding: 0;
+  	border: 0;
+  	font-size: 100%;
+  	vertical-align: baseline;
+  }
+  /* HTML5 display-role reset for older browsers */
+  article, aside, details, figcaption, figure,
+  footer, header, hgroup, menu, nav, section {
+  	display: block;
+  }
+  body {
+  	line-height: 1;
+  }
+  ol, ul {
+  	list-style: none;
+  }
+  blockquote, q {
+  	quotes: none;
+  }
+  blockquote:before, blockquote:after,
+  q:before, q:after {
+  	content: '';
+  	content: none;
+  }
+  table {
+  	border-collapse: collapse;
+  	border-spacing: 0;
+  }
+  * { box-sizing: border-box; }
+}

metadata

@@ -0,0 +1,103 @@
+--- !ruby/object:Gem::Specification
+name: sakura_toolkit
+version: !ruby/object:Gem::Version
+  version: 0.0.2
+platform: ruby
+authors:
+- Thomas Cullen
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2016-01-29 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: rails
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.2'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.2'
+- !ruby/object:Gem::Dependency
+  name: thor
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.19'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.19'
+description: A lightweight SASS framework that lets you keep control
+email:
+- thomascullen92@gmail.com
+executables:
+- sakura
+extensions: []
+extra_rdoc_files: []
+files:
+- MIT-LICENSE
+- Rakefile
+- bin/sakura
+- lib/sakura_toolkit.rb
+- lib/sakura_toolkit/cli.rb
+- lib/sakura_toolkit/engine.rb
+- lib/sakura_toolkit/version.rb
+- toolkit/sakura.scss
+- toolkit/sakura/_animation.scss
+- toolkit/sakura/_ui.scss
+- toolkit/sakura/_utilities.scss
+- toolkit/sakura/_variables.scss
+- toolkit/sakura/animation/_slides.scss
+- toolkit/sakura/animation/_transitions.scss
+- toolkit/sakura/ui/_base.scss
+- toolkit/sakura/ui/_components.scss
+- toolkit/sakura/ui/_grid.scss
+- toolkit/sakura/ui/_recipes.scss
+- toolkit/sakura/ui/_typography.scss
+- toolkit/sakura/ui/components/_buttons.scss
+- toolkit/sakura/ui/components/_forms.scss
+- toolkit/sakura/ui/components/_icons.scss
+- toolkit/sakura/ui/icons.svg
+- toolkit/sakura/ui/recipes/_cards.scss
+- toolkit/sakura/ui/recipes/_modals.scss
+- toolkit/sakura/ui/recipes/_notifications.scss
+- toolkit/sakura/utilities/_functions.scss
+- toolkit/sakura/utilities/_media_queries.scss
+- toolkit/sakura/utilities/_mixins.scss
+- toolkit/sakura/utilities/_reset.scss
+homepage: https://github.com/thomascullen/sakura
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.5.1
+signing_key: 
+specification_version: 4
+summary: The Sakura Toolkit
+test_files: []