waterfall_bourbon_neat_rails 1.0.2 → 1.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 9b40e8881cf3b3dff16e93d35f64f04af2bce5ab
-  data.tar.gz: 74fe32dab65ede644426ee0aec0c8e291082f29b
+  metadata.gz: 3fc86f4c8c9dffdb4a64be7aaffc36834afb4d88
+  data.tar.gz: 23cc7b32de67229b5e0dd8a10684bcc3c01d069c
 SHA512:
-  metadata.gz: 97de2f9bbf4742abf32f866c382563ee0cdd9eeb7e61b60ac98c42ea187aea7fa812d69ce4b42551440a767a415b70fc61df9acfa11b2f9407b4b2cd0ff14e2b
-  data.tar.gz: 87b3fa6c6898635a7565970ad32b78016f23f363c3f0e555f7abea5643217a1036ed7bd9aa6c72c0860dfb1f6618d8a4a1bf07bf9bc5209376d3a4edb851dfc9
+  metadata.gz: eb5af719eb7ab5b80c8af4dab30d9adc3d9640bcddbd060576a3a939a6879fa0577b1c6930ddd7b2cba176d7bce18b70eff730ae30360d5054acf6b79df3843a
+  data.tar.gz: ecb78bc19987909bacf1eff48a227e80081b0cf94ed75c8b929ae631c3af3c81f86019f18f36f7cd437285c81883b605b8c18b86c641d053d6f43ecce9a022aa

data/app/assets/javascripts/waterfall_bourbon_neat_rails/application.js

@@ -7,4 +7,4 @@
 
 //= require libs/chosen.jquery
 //= require libs/jquery-ui-1.10.4.min
-//= require libs/jquery.ui.timepicker
+//= require libs/jquery.ui.timepicker

data/app/assets/libs/abc.js

@@ -0,0 +1,3 @@
+"use strict";
+
+var AADDII = "value";

data/app/assets/stylesheets/base/_base.scss

@@ -4,11 +4,9 @@
 // Variables
 @import 'variables';
 
-// Neat Settings -- uncomment if using Neat -- must be imported before Neat
-@import 'grid-settings';
-
 // Mixins
 @import 'mixins/flash';
+@import 'mixins/container';
 
 // Extends
 @import 'extends/button';

data/app/assets/stylesheets/base/mixins/_container.scss

@@ -0,0 +1,7 @@
+@mixin container{
+  @include outer-container;
+  @include media($large-screen);
+  @include media($medium-screen);
+  @include media($tablet);
+  @include media($mobile);
+}

data/app/assets/stylesheets/custom/_pages.scss

@@ -136,68 +136,69 @@ body#main{
 			}
 		}
 		.registration_container{
-			padding: 20px;	
+			@include outer-container;
+			@include pad(20px 0);	
 
 			form{
-				@include clearfix;
-				@include outer-container;
-
+				@include fill-parent;
+				
 				.field_container{
-					@include span-columns(10);
-					@include clearfix;
-					@include center;
+					@include span-columns(14);
+					@include shift(1);
 					background-color: transparent;
-					float: none;
 					
 					legend{
 						@include font-attr(1.4em, $medium_blue, bold);
 					}
+					
 					fieldset{
-						padding: 10px 30px;
+					  @include fill-parent;
+						@include pad(10px 0);
+						margin-top: 10px;
+						
 						legend{
 							@include font-attr(1.2em, $medium_blue, bold);
 						}
+						
+						.form_inputs{
+						  @include span-columns(12 of 14);
+						  @include shift(1);
+						}
 					}
 				}
 
 				.form_inputs.acc_info, .form_inputs.acc_details{
 					
 					.left_column, .right_column{
-						@include span-columns(5 of 10);
+						@include span-columns(6 of 12);
 					}
 
 					.left_column{
 						.user_details_phone_number{
-							@include span-columns(3 of 5);
+							@include span-columns(4 of 6);
 						}
 						.user_details_phone_extension{
-							@include span-columns(2 of 5);
+							@include span-columns(2 of 6);
 							@include omega;
 						}
 					}
 
 					.right_column{
 						.logo_preview{
-							max-width: 375px;
-
 							.img_container{
+							  @include border(solid, 1px, $light_blue);
+							  @include pad(5px);
 								height: 200px;
-								padding: 5px;
 								overflow: hidden;
-								@include border(solid, 1px, $light_blue);
 								box-shadow: 0 0 1px 1px;
-
-								img{
-									max-width: 100%;
-								}
 							}
 
 							.headshot{
-								width:200px;
+								max-width:200px;
 							}
 						}
 						.partner_state{
-							@include span-columns(1 of 5);
+							@include span-columns(2 of 6);
 
 							select{
 								height: 40px;
@@ -239,12 +240,11 @@ body#main{
 					}
 				}
 				.form_actions{
-					@include span-columns(10);
-					float: none;
-					margin-right: auto !important;
-					@include center;
-					padding:10px;
+					@include span-columns(14);
+					@include shift(1);
 					@include clearfix;
+					
+					margin-top:20px;
 					color: $light_blue;
 
 					input{
@@ -290,30 +290,66 @@ body#landing-page{
 			position: relative;
 		}
 		.container{
+		  @include outer-container;
+		  background: transparent;
+		  border:none;
 			min-height: 400px;
 			margin-top:10px;
 
 			.url{
-				margin-top: 20px;
-				@include span-columns(6);
-				@include center;
-				float:none;
-			}
+				@include span-columns(8);
+				@include shift(4);
+				@include pad(20px 0);
 
-			.url__item{
-				width: 100%;
-				height: 40px;
-				padding-left: 5px;
-				@include border(solid, 1px, $sky_blue);
-				@include border-radius;
+				margin-top: 20px;
+				background-color: rgba(255, 255, 255, 0.91);
+				
+				p{
+				  @include span-columns(6 of 8);
+				  @include shift(1);
+				}
+				
+				select{
+				  @include span-columns(2 of 8);
+				  @include shift(1);
+				}
+				
+				.url__item{
+          height: 40px;
+          
+          @include span-columns(6 of 8);
+          @include shift(1);
+          @include border(solid, 1px, $sky_blue);
+          @include border-radius;
+          @include pad(0 0 0 5px);
+        }
 			}
 
 			form{
-				width: 500px;
-				margin: 10px auto;
+			  @include pad(20px 0);
+				@include span-columns(8);
+				@include shift(4);
+				
+				@include media($medium-screen) {
+				  @include span-columns(12);
+				  @include shift(2);
+				}
+				
+				@include media($tablet) {
+				  @include span-columns(14);
+          @include shift(1);
+				}
+				
+				background-color: rgba(255, 255, 255, 0.91);
+			}
+			
+			.form_inputs, .form_actions, .edit-user-email{
+			  @include margin(10px 0 0 0);
+			  @include span-columns(6 of 8);
+			  @include shift(1);
 			}
+			
 			.form_actions{;
-				padding: 10px 0;
 				@include clearfix;
 				color: $light_blue;
 				
@@ -441,9 +477,11 @@ body#landing-page{
 		}
 	}
 	.footer{
+	  position: fixed;
+	  width:100%;
+	  bottom:0;
 		footer{
 			background-color: $medium_blue;
-			bottom: 0;
 		}
 	}
 }

data/app/assets/stylesheets/custom/_variables.scss

@@ -2,16 +2,6 @@ $base-value: 14;
 $baseColor: #000;
 $primaryFontFamily: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
 
-
-//**** Neat Grid ****
-$max-width: em(960, $base-value); // Max width of outer container
-
-//**** Breakpoints ****
-$desktop: min-width 850px;
-$tablet: min-width 750px;
-$tablet-only: min-width 750px max-width 849px;
-$mobile-only: max-width 749px;
-
 //**** Colors ****
 $black:                 #111111;
 $blue:                  #0e3651;
@@ -54,5 +44,3 @@ $default_border_radius: 5px;
 $default_font_size: 1em;
 $default_font_color: #000;
 $default_font_weight: normal;
-
-$breakpoint-alpha: 980px; // adjust to your needs - used for the landing page table

data/app/assets/stylesheets/custom/components/_captcha.scss

@@ -1,24 +1,27 @@
 //variable
 $title-font-color: $light_blue;
 
-#captcha-wrapper{
-	@include span-columns(12);
-	margin-top: 15px;
-}
-
-#captcha-image{
-	margin-top:	5px;
-	float: left;
-}
+// #captcha-wrapper{
+	// @include fill-parent;
+	// margin-top: 15px;
+// }
 
 #captcha-title{
+  @include span-columns(10 of 12);
+  @include shift(1);
+  @indlude pad(5px 0);
 	font-size: 16px;
 	color: $title-font-color;
 }
 
+#captcha-image{
+  @include span-columns(2 of 12);
+  @include shift(1);
+  margin-top: 5px;
+}
+
 #captcha-input{
-	float:	left;
-	margin: 5px 0 0 10px;
-	width:	130px;
+  @include span-columns(2 of 12);
 	@include border-radius;
+  margin-top:5px;
 }

data/app/assets/stylesheets/custom/components/_form_v1.scss

@@ -1,5 +1,10 @@
-.business-hours{
-	@include span-columns(12);
+// .business-hours{
+	// @include span-columns(14);
+// }
+
+.days{
+  @include span-columns(12);
+  @include shift(1);
 }
 
 .day{

data/app/assets/stylesheets/custom/components/_table.scss

@@ -1,4 +1,5 @@
 //table component
+$table-breakpoint: 980px;
 
 .rwd-table {
   margin: 1em 0;
@@ -35,7 +36,7 @@
       display: inline-block;
       // end options
       
-      @media (min-width: $breakpoint-alpha) {
+      @media (min-width: $table-breakpoint) {
         display: none;
       }
     }
@@ -44,7 +45,7 @@
   th, td {
     text-align: left;
     
-    @media (min-width: $breakpoint-alpha) {
+    @media (min-width: $table-breakpoint) {
       display: table-cell;
       padding: .25em .5em;
       
@@ -73,7 +74,7 @@
   }  
   th, td {
     margin: .5em 1em;
-    @media (min-width: $breakpoint-alpha) { 
+    @media (min-width: $table-breakpoint) { 
       padding: 10px!important;
     }
   }

data/app/assets/stylesheets/custom/rules.txt

@@ -1,14 +0,0 @@
-Evitam nesting.
-
-Ex:  
-<ul class="list1">
-	<li class="list1-item"></li>
-</ul>
-
-when we select element using css selector we don;t use nesting, else max 1 level
-
-.list1{
-	.list1-item{
-
-	}
-}

data/app/assets/stylesheets/neat/_breakpoints.scss

@@ -0,0 +1,6 @@
+//media breakpoints which I can use in the neat media mixin
+
+$large-screen: new-breakpoint(max-width 1280px);
+$medium-screen: new-breakpoint(max-width 980px);
+$tablet: new-breakpoint(max-width 768px);
+$mobile: new-breakpoint(max-width 480px);

data/app/assets/stylesheets/neat/_settings.scss

@@ -0,0 +1,18 @@
+// here we have the grid settings
+
+//Sets the default layout direction of the grid. //LTR(left to right), RTL(right to left)
+$default_layout_direction: LTR;
+
+//Sets the total number of columns in the grid. Its value can be overridden inside a media query using the media() mixin.
+$grid-columns: 16;
+
+//Sets the max-width property of the element that includes outer-container().
+$max-width: 1280px;
+
+//apply box-sizing to all elements
+$border-box-sizing: true; 
+
+//Helpers. Displays the visual grid when set to true.
+$visual-grid: false;
+$visual-grid-color: yellow;
+$visual-grid-opacity: 0.5;

data/app/assets/stylesheets/partials/_layout.scss

@@ -151,10 +151,12 @@ body#main {
   text-align: center;
   color:white;
 
-  div.logo {
-    width: 430px;
-    padding: 4% 0px 6%;
-    margin: 0px auto;
+  .header{
+    .logo {
+      width: 430px;
+      padding: 4% 0px 6%;
+      margin: 0px auto;
+    }
   }
 
   span {

data/app/assets/stylesheets/waterfall_bourbon_neat_rails/application.scss

@@ -1,6 +1,8 @@
 @import "bourbon";
-@import "base/base"; /* Bitters needs to be imported before Neat */
+@import "neat/settings";
 @import "neat";
+@import "base/base";
+@import "neat/breakpoints";
 @import "partials/variables";
 @import "partials/layout";
 @import "partials/flash";

data/lib/waterfall_bourbon_neat_rails/version.rb

@@ -1,3 +1,3 @@
 module WaterfallBourbonNeatRails
-  VERSION = "1.0.2".freeze
+  VERSION = "1.0.3".freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: waterfall_bourbon_neat_rails
 version: !ruby/object:Gem::Version
-  version: 1.0.2
+  version: 1.0.3
 platform: ruby
 authors:
 - Waterfall Software Inc.
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-09-09 00:00:00.000000000 Z
+date: 2014-09-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -225,17 +225,18 @@ files:
 - app/assets/javascripts/libs/jquery.ui.timepicker.js
 - app/assets/javascripts/waterfall_bourbon_neat_rails.js
 - app/assets/javascripts/waterfall_bourbon_neat_rails/application.js
+- app/assets/libs/abc.js
 - app/assets/stylesheets/base/_base.scss
 - app/assets/stylesheets/base/_buttons.scss
 - app/assets/stylesheets/base/_flashes.scss
 - app/assets/stylesheets/base/_forms.scss
-- app/assets/stylesheets/base/_grid-settings.scss
 - app/assets/stylesheets/base/_lists.scss
 - app/assets/stylesheets/base/_typography.scss
 - app/assets/stylesheets/base/_variables.scss
 - app/assets/stylesheets/base/extends/_button.scss
 - app/assets/stylesheets/base/extends/_clearfix.scss
 - app/assets/stylesheets/base/extends/_hide-text.scss
+- app/assets/stylesheets/base/mixins/_container.scss
 - app/assets/stylesheets/base/mixins/_flash.scss
 - app/assets/stylesheets/custom/_components.scss
 - app/assets/stylesheets/custom/_functions.scss
@@ -254,6 +255,8 @@ files:
 - app/assets/stylesheets/custom/rules.txt
 - app/assets/stylesheets/libs/jquery-ui-1.10.4.min.css
 - app/assets/stylesheets/libs/jquery.ui.timepicker.css
+- app/assets/stylesheets/neat/_breakpoints.scss
+- app/assets/stylesheets/neat/_settings.scss
 - app/assets/stylesheets/normalize/README.md
 - app/assets/stylesheets/normalize/component.json
 - app/assets/stylesheets/normalize/normalize.css

data/app/assets/stylesheets/base/_grid-settings.scss

@@ -1,37 +0,0 @@
-@import 'neat-helpers'; // or '../neat/neat-helpers' when not in Rails
-
-// Neat Overrides
-// $column: 90px;
-// $gutter: 30px;
-// $grid-columns: 12;
-//$max-width: em(700);
-
-// Neat Breakpoints
-//$medium-screen: em(640);
-//$large-screen: em(860);
-
-//$medium-screen-up: new-breakpoint(min-width $medium-screen 4);
-//$large-screen-up: new-breakpoint(min-width $large-screen 8);
-
-// will be removed when things are done
-// $visual-grid: true;
-// $visual-grid-color: red;
-// $visual-grid-index: front;
-// $visual-grid-opacity: 0.1;
-
-$large-screen: new-breakpoint(max-width 1200px 12);
-$medium-screen: new-breakpoint(max-width 992px 8);
-$small-screen: new-breakpoint(max-width 768px 6);
-
-@mixin container{
-	@include outer-container;
-	@include media($large-screen){
-		max-width: 1200px;
-	}
-	@include media($medium-screen){
-		max-width: 980px;
-	}
-	@include media($small-screen){
-		max-width:760px;
-	}
-}