aesthetics-rails 0.1.1.pre.alpha → 0.1.3.pre.alpha

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: dfffdff646b23c1c92d655938d44997e6f1bc2db
-  data.tar.gz: 570bebeafa5ecf28ca3f989af86222c7cfdf967f
+  metadata.gz: 3c8afa2176e7fb9d5bf256c50df4dafe157276ce
+  data.tar.gz: 9731048ad4f5090c51b85e0db47a56cbb9ea99a7
 SHA512:
-  metadata.gz: 9dc6d8201a840e28a82c652253baee8b12b9daa11846ee414acd31a0c7a7c1c857fd40f54421e206e4b05711db76a4327751e2977d7cde83e1c228862ee00432
-  data.tar.gz: a57a212950de04a2e209155a3b09aed47f344d91afdac740d1c05ee9f346a9b299bab9864ac0132f6c9477aec1308a63f76f307a0b6b4bb18e1b84440d1cb6be
+  metadata.gz: f0d6eea982f608127062c16d2def5344bb0592cb9e6810d3872cc10228e0117e145d39bc7e535105e6505e859bcd77b6426825c673d6aed5fe818526259b95e1
+  data.tar.gz: 891430e95c870f382bcf5373839d958c8ad645d66061702d6ff62cff52ab092ff89818c32c1ec0b6bb8624e21858869f03d1146afeb09fdacae785f3e1a20e23

data/assets/javascripts/aesthetics.js

@@ -0,0 +1,8 @@
+(function() {
+  $(function() {
+    return $('.js-dropdownToggle').click(function() {
+      return $('.dropdown-menu').toggleClass('is-active');
+    });
+  });
+
+}).call(this);

data/assets/stylesheets/aesthetics.scss

@@ -41,6 +41,7 @@
 //=========================
 @import "components/buttons";
 @import "components/container";
+@import "components/dropdowns";
 @import "components/forms";
 @import "components/navbar";
 @import "components/utilities";

data/assets/stylesheets/components/_buttons.scss

@@ -16,23 +16,26 @@
 //=========================
 button,
 .btn {
+  @include transition(all, 0.35s, ease-in-out);
   display: inline-block;
   height: auto;
   margin: 0;
-  padding: 6px 12px;
-  border-radius: 6px;
+  margin: 0;
+  padding: 8px 16px;
+  border: none;
+  border-radius: 4px;
   font-size: inherit;
   font-weight: normal;
-  line-height: 1.42857143;
+  font-family: $type-helvetica;
+  text-decoration: none;
+  text-align: center;
   text-align: center;
   text-decoration: none;
+  line-height: $type-baseLineHeight;
   vertical-align: middle;
   cursor: pointer;
+  white-space: no-wrap;
   -webkit-appearance: none;
-  box-shadow: 0 2px 0 #c6c6c6;
-  -webkit-transition: border 0.3s linear,color 0.3s linear,background-color 0.3s linear;
-  transition: border 0.3s linear,color 0.3s linear,background-color 0.3s linear;
-  -webkit-font-smoothing: subpixel-antialiased;
 }
 
 button:after,
@@ -63,10 +66,6 @@ button:hover, .btn:hover { text-decoration: none }
   background-color: #474747;
 }
 
-.btn.is-fixed {
-  position: fixed;
-}
-
 //=========================
 // 3) Button Themes
 //=========================
@@ -75,6 +74,7 @@ button:hover, .btn:hover { text-decoration: none }
   // Primary Theme
 //=======================
 .btn--primary {
+  @include box-shadow(1px, 1px, 0, #c6c6c6);
   color: #fff;
   background-color: $color-primary;
 }
@@ -89,6 +89,7 @@ button:hover, .btn:hover { text-decoration: none }
   // General Themes
 //=======================
 .btn--success {
+  @include box-shadow(1px, 1px, 0, #c6c6c6);
   color: #fff;
   background-color: $color-success;
 }
@@ -100,6 +101,7 @@ button:hover, .btn:hover { text-decoration: none }
 }
 
 .btn--warning {
+  @include box-shadow(1px, 1px, 0, #c6c6c6);
   color: #fff;
   background-color: $color-warning;
 }
@@ -111,6 +113,7 @@ button:hover, .btn:hover { text-decoration: none }
 }
 
 .btn--danger {
+  @include box-shadow(1px, 1px, 0, #c6c6c6);
   color: #fff;
   background-color: $color-danger;
 }
@@ -122,6 +125,7 @@ button:hover, .btn:hover { text-decoration: none }
 }
 
 .btn--info {
+  @include box-shadow(1px, 1px, 0, #c6c6c6);
   color: #fff;
   background-color: $color-info;
 }
@@ -148,9 +152,8 @@ button:hover, .btn:hover { text-decoration: none }
 }
 
 .btn--lg {
-  padding: 10px 16px;
-  font-size: 18px;
-  line-height: 1.3333333;
+  padding: 8.5px 17px;
+  font-size: 1.125rem;
   border-radius: 6px;
 }
 
@@ -158,25 +161,20 @@ button:hover, .btn:hover { text-decoration: none }
 .btn--lg.btn--circle {
   width: 90px;
   height: 90px;
-  line-height: 70px;
 }
 
 .btn--square,
 .btn--circle {
   width: 66px;
   height: 66px;
-  line-height: 54px;
 }
 
 .btn--sm {
-  padding: 5px 10px;
-  font-size: 12px;
-  line-height: 1.5;
-  border-radius: 3px;
+  padding: 6px 12px;
+  font-size: 0.875rem;
 }
 .btn--sm.btn--square,
 .btn--sm.btn--circle {
   width: 44px;
   height: 44px;
-  line-height: 34px;
 }

data/assets/stylesheets/components/_dropdowns.scss

@@ -0,0 +1,43 @@
+//==================================================
+// Dropdowns.scss
+//==================================================
+
+
+.dropdown-menu {
+  @include box-shadow(0, 6px, 12px, rgba(0, 0, 0, 0.2) );
+  position: absolute;
+  left: 0;
+  padding-left: 0;
+  list-style: none;
+  display: none;
+  background-color: #fff;
+  color: #333;
+  border: 1px solid rgba(0, 0, 0, .15);
+  border-radius: 4px;
+  text-align: left;
+}
+
+.dropdown-menu.is-active {
+  display: block;
+}
+
+.dropdown-menu-item a {
+  display: block;
+  padding: 5px 12px;
+  color: inherit;
+  white-space: nowrap;
+}
+.dropdown-menu-item a:hover {
+  background-color: #eee;
+}
+
+.caret {
+  display: inline-block;
+  width: 0;
+  height: 0;
+  margin-left: 2px;
+  vertical-align: middle;
+  border-top: 4px dashed;
+  border-right: 4px solid transparent;
+  border-left: 4px solid transparent;
+}

data/assets/stylesheets/components/_utilities.scss

@@ -6,7 +6,7 @@
 //
 // Index
 // -----
-// 1) Debugging Utility
+// 1) Visual
 // 2) Layout
 // 3) Positioning
 // 4) Text Alignment
@@ -16,14 +16,10 @@
 
 
 //=========================
-// 1) Debugging Utility
-//
-// Disable = uncomment
-// Please disable after work is done
-// If styling border, it might be a good idea to disable it
+// 1) Visual
 //=========================
-*, *:before, *:after {
- // outline: 1px solid green;
+.u-flat {
+  box-shadow: none;
 }
 
 //=========================
@@ -72,6 +68,10 @@
   position: fixed;
 }
 
+.u-relative {
+  position: relative;
+}
+
 //=========================
 // 4) Text Alignment
 //=========================

data/assets/stylesheets/settings/_colors.scss

@@ -13,7 +13,7 @@
 //=========================
 $blue:                     rgb(2, 170, 245);
 $oceanBlue:                rgb(1, 132, 184);
-$shamrock:                rgb(72, 201, 176);
+$emerald:                 rgb(46, 204, 113);
 $moonYellow:              rgb(244, 211, 19);
 $cinnabar:                 rgb(231, 76, 60);
 $gulfBlue:                 rgb(65, 91, 118);
@@ -22,7 +22,7 @@ $gulfBlue:                 rgb(65, 91, 118);
 // 2) Theme Colors
 //=========================
 $color-primary: $blue;
-$color-success: $shamrock;
+$color-success: $emerald;
 $color-warning: $moonYellow;
 $color-danger: $cinnabar;
 $color-info: $gulfBlue;

data/lib/aesthetics/rails/version.rb

@@ -1,5 +1,5 @@
 module Aesthetics
   module Rails
-    VERSION = "0.1.1-alpha"
+    VERSION = "0.1.3-alpha"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: aesthetics-rails
 version: !ruby/object:Gem::Version
-  version: 0.1.1.pre.alpha
+  version: 0.1.3.pre.alpha
 platform: ruby
 authors:
 - Duane Adam
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2015-04-21 00:00:00.000000000 Z
+date: 2015-04-24 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -65,11 +65,13 @@ files:
 - README.md
 - Rakefile
 - aesthetics-rails.gemspec
+- assets/javascripts/aesthetics.js
 - assets/stylesheets/_mixins.scss
 - assets/stylesheets/_normalize.scss
 - assets/stylesheets/aesthetics.scss
 - assets/stylesheets/components/_buttons.scss
 - assets/stylesheets/components/_container.scss
+- assets/stylesheets/components/_dropdowns.scss
 - assets/stylesheets/components/_forms.scss
 - assets/stylesheets/components/_global.scss
 - assets/stylesheets/components/_navbar.scss