magic_stylez 0.0.0.13 → 0.0.0.19

data/vendor/assets/stylesheets/magic/content/_forms.scss

@@ -141,39 +141,9 @@ form.corset, .form {
 }
 
 
-.btn-group-block.input-group {
-	.btn {
-		text-align: left;
-		padding: 10px;
-		&.icn {
-			text-align: center;
-		}
-	}
-}
 
-.btn-group-block {
-	@include box-sizing(border-box);
-	display: table;
-    width: 100%;
-    margin: 0 0 10px;
-	text-decoration: none;
-    .btn {
-		display: table-cell;
-		width: auto;
-		width: 99%;
-		&.icn { width: 1%; }
-		border-collapse: separate;
-        border-spacing: 0;
-		@include border-radius(0);
-		&:first-child { @include border-left-radius(5px); }
-        &:last-child { @include border-right-radius(5px); }
-    }
-	.btn + .btn {
-		border-left: none;
-	}
-	&.half { width: 50%; margin-left: auto; margin-right: auto; }
-	&:hover { text-decoration: none !important; }
-}
+
+
 
 .fullpage-table > .table-row > * {
 	.btn-group-block { margin: 0; }
@@ -203,41 +173,3 @@ form.corset, .form {
 
 
 
-.btn-app, .btn-google, .btn-facebook, .btn-twitter {
-    // padding: 5px 22px !important;
-    color: #fff;
-    &:hover, &:active {
-        color: #fff;
-    }
-    &.icn { font-size: 24px !important; padding: 2px 7px 0 7px !important; line-height: 28px !important; }
-}
-
-.btn-socials {
-	padding: 5px 22px !important;
-}
-
-.btn-facebook {
-  background: #3b5998;
-  text-shadow: 0 1px 0 #3b5998;
-  vertical-align: middle;
-  &:hover { background: darken(#3b5998, 5%); }
-  &:active { background: darken(#3b5998, 10%) \9; }
-}
-
-.btn-google {
-  background: #dd4b39;
-  text-shadow: 0 1px 0 #dd4b39;
-  &:hover { background: #e74b37; }
-  &:active { background: #be3e2e; }
-}
-
-.btn-twitter {
-  background: #00aced;
-  text-shadow: 0 1px 0 #00aced;
-  &:hover { background: darken(#00aced, 10%); }
-  &:active { background: darken(#00aced, 20%); }
-}
-
-.btn-paypal {
-	background: #12398c;
-}

data/vendor/assets/stylesheets/magic/content/_inputs.scss

@@ -0,0 +1,149 @@
+// Form control sizing
+//
+// Relative text size, padding, and border-radii changes for form controls. For
+// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
+// element gets special love because it's special, and that's a fact!
+// [converter] $parent hack
+@mixin inpt-sizing($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
+	$input-height: $input-height + 1;
+	&#{$parent} > * { height: $input-height; }
+	&#{$parent} > .icn {
+		height: $input-height;
+		max-height: $input-height;
+		font-size: $font-size * 1.2;
+		padding: $padding-vertical 2px;
+		line-height: floor(($font-size * $line-height));
+		@include inpt_icn_width( ($font-size * $line-height), $padding-base-vertical );
+	}
+	&#{$parent} > .inpt > input {
+		height: $input-height;
+	    padding: $padding-vertical $padding-horizontal $padding-vertical 5px;
+	    font-size: $font-size;
+	    line-height: $line-height;
+	    border-radius: $border-radius;
+	}
+}
+@mixin inpt_icn_width( $lineHeight: 20px, $verticalPadding: 10px ) {
+	$wdth: 2 + $lineHeight + $verticalPadding * 2;
+	min-width: $wdth;
+	max-width: $wdth;
+}
+
+
+.inpt-splited, .inpt-divided {
+	
+	display: table;
+    width: auto;
+	width: 100%;
+	// margin: 0 0 10px; 
+	padding: 0 !important;
+	// font-size: $font-size-base;
+	// line-height: $line-height-base;
+	// color: $input-color;
+	background-color: $input-bg;
+	background-image: none; // Reset unusual Firefox-on-Android default style
+	
+	border: 1px solid $input-border;
+	border-radius: $input-border-radius;
+	@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
+	@include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s);
+	
+	& > * {
+		display: table-cell; position: relative;
+		padding: 0; margin: 0;
+		
+		height: $input-height-base + 1;
+		font-size: inherit;
+		line-height: inherit;
+		color: inherit;
+		background-color: inherit;
+		background-image: none; // Reset unusual Firefox-on-Android default style
+		text-shadow: inherit;
+		width: auto;
+		width: 98%;
+		@include border-radius(0);
+		vertical-align: middle;
+		border: none;
+		@include box-shadow( none );
+		
+		
+		&:first-child, &:first-child input { @include border-left-radius($border-radius-base); }
+		&:last-child, &:last-child input { @include border-right-radius($border-radius-base); }
+		
+		&.inpt {
+			input, label, textarea {
+				display: block; position: relative;
+				padding: $padding-base-vertical $padding-base-horizontal $padding-base-vertical 5px;
+				margin: 0;
+				height: $input-height-base + 1;
+				@include box-sizing(border-box);
+				border: none;
+				@include box-shadow( none );
+				outline: none;
+				width: 100%;
+			}
+		}
+		
+		&.icn { 
+			width: 2%;
+			font-size: $font-size-base * 1.2;
+			line-height: $line-height-computed;
+			padding: $padding-base-vertical 2px;
+			text-align: center;
+			color: lighten($input-color, 20%);
+			@include inpt_icn_width( $line-height-computed, $padding-base-vertical );
+		}
+	}
+	
+	// Make inputs at least the height of their button counterpart (base line-height + padding + border)
+	@include inpt-sizing('.input-xs', $input-height-xs, $padding-xs-vertical, $padding-xs-horizontal, $font-size-small, $line-height-small, $border-radius-small);
+
+	@include inpt-sizing('.input-sm', $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);
+
+	@include inpt-sizing('.input-lg', $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large);
+  
+  
+
+  // Customize the `:focus` state to imitate native WebKit styles.
+  @include form-control-focus();
+
+  // Placeholder
+  @include placeholder();
+
+  // Disabled and read-only inputs
+  //
+  // HTML5 says that controls under a fieldset > legend:first-child won't be
+  // disabled if the fieldset is disabled. Due to implementation difficulty, we
+  // don't honor that edge case; we style them as disabled anyway.
+  &[disabled],
+  &[readonly],
+  fieldset[disabled] & {
+    cursor: not-allowed;
+    background-color: $input-bg-disabled;
+    opacity: 1; // iOS fix for unreadable disabled content
+  }
+
+  // [converter] extracted textarea& to textarea.form-control
+}
+
+
+
+// Reset height for `textarea`s
+textarea.form-control {
+  height: auto;
+  height: $line-height-computed * 2 + $padding-base-vertical * 2;
+  width: 100% !important;
+  max-width: 100%;
+}
+
+
+
+// Form control sizing
+//
+// Build on `.form-control` with modifier classes to decrease or increase the
+// height and font-size of form controls.
+
+@include input-size('.input-xs', $input-height-xs, $padding-xs-vertical, $padding-xs-horizontal, $font-size-small, $line-height-small, $border-radius-small);
+
+
+

data/vendor/assets/stylesheets/magic/content/_navbar.scss

@@ -0,0 +1,59 @@
+// some changes to twbs navbar
+
+// Basics of a navbar
+// $navbar-height:                    50px !default;
+// $navbar-margin-bottom:             $line-height-computed !default;
+// $navbar-border-radius:             $border-radius-base !default;
+// $navbar-padding-horizontal:        floor(($grid-gutter-width / 2)) !default;
+// $navbar-padding-vertical:          (($navbar-height - $line-height-computed) / 2) !default;
+// $navbar-collapse-max-height:       340px !default;
+
+/*
+.navbar
+	.header
+		.navbar-brand
+	.navbar-collapse
+		
+
+*/
+.navbar {
+	
+	
+	
+	// default hight 50px
+	a.btn {
+		@include vertical-padding( $navbar-padding-vertical / 2 - 1 );
+		@include vertical-margin( $navbar-padding-vertical / 2 );
+	}
+	
+	
+		
+		
+		
+	
+	
+}
+
+@media (max-width: $grid-float-breakpoint) {
+	.navbar {
+		&.navbar-slidebar {
+			.navbar-collapse {
+				display: block; position: fixed;
+				top: 0; right: auto; bottom: 0; left: 0;
+				background: $dark-bg;
+				@include transform( translateZ( 0 ) );
+				@include transform( translateX( -222px ) ); 
+				width: 220px;
+				max-height: none;
+				overflow-y: scroll;
+				@include transition (all 0.7s ease-in-out);
+				.btn { @include horizontal-margin( 15px ); width: auto; }
+				&.on { @include transform( translateX( 0 ) );  }
+			}
+			
+			&.fixed-top .navbar-collapse, &.navbar-fixed-top .navbar-collapse {
+				top: 50px;
+			}
+		}
+	}
+}

data/vendor/assets/stylesheets/magic/corporate/_fonts.scss

@@ -23,7 +23,7 @@ $monoFontFamily:        Monaco, Menlo, Consolas, "Courier New", monospace !defau
 
 $magicSans: 			$sansFontFamily;
 $magicCondensedSans: 	$sansFontFamily;
-$magicHandwritten: 		cursive;
+$magicHandwritten: 		'Gloria Hallelujah', cursive;
 
 
 

data/vendor/assets/stylesheets/magic/corporate/_typo.scss

@@ -26,8 +26,15 @@ $font-size-h6:            ceil(($font-size-base * 0.85)) !default; // ~12px
 
 //** Unit-less `line-height` for use in components like buttons.
 $line-height-base:        1.428571429 !default; // 20/14
+$line-height-large:         1.33 !default;
+$line-height-small:         1.5 !default;
+
+
 //** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
-$line-height-computed:    floor(($font-size-base * $line-height-base)) !default; // ~20px
+$line-height-computed:       floor(($font-size-base * $line-height-base)) !default; // ~20px
+$line-height-computed-lg:    floor(($font-size-large * $line-height-large)) !default; // ~20px
+$line-height-computed-sm:    floor(($font-size-small * $line-height-small)) !default; // ~20px
+$line-height-computed-xs:    floor(($font-size-small * $line-height-small)) !default; // ~20px
 
 //** By default, this inherits from the `<body>`.
 // $headings-font-family:    inherit !default;

data/vendor/assets/stylesheets/magic/corporate/_variables.scss

@@ -36,9 +36,6 @@ $padding-small-horizontal:  10px !default;
 $padding-xs-vertical:       1px !default;
 $padding-xs-horizontal:     5px !default;
 
-$line-height-large:         1.33 !default;
-$line-height-small:         1.5 !default;
-
 $border-radius-base:        4px !default;
 $border-radius-large:       6px !default;
 $border-radius-small:       3px !default;
@@ -71,6 +68,7 @@ $input-height-base:              ($line-height-computed + ($padding-base-vertica
 $input-height-large:             (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default;
 //** Small `.form-control` height
 $input-height-small:             (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default;
+$input-height-xs:                (floor($font-size-small * $line-height-small) + ($padding-xs-vertical * 2) + 2) !default;
 
 
 

data/vendor/assets/stylesheets/magic/effects/_noise.scss

@@ -0,0 +1,36 @@
+/*
+
+CSS Noise Code Snippet by James Brocklehurst.
+Find out more at http://www.mightymeta.co.uk/1269/css-noise/
+
+Instructions:
+
+1. Add the snippet to the bottom of your main stylesheet.
+
+2. Add class="noise" to HTML elements to apply noise, use class="body-noise" for body element only.
+
+3. Use grouped selectors instead if you want to avoid unsemantic class attributes.
+
+*/
+
+/*** SNIPPET STARTS ***/
+
+.noise {
+	position: relative;
+	z-index: 1;
+	}
+		
+.noise:before, .body-noise:before {
+	content: "";
+	position: absolute;
+	z-index: -1;
+	top:0;
+	bottom:0;
+	left:0;
+	right:0;
+	opacity: .42;
+	background-image: url(data:image/png;base64,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);
+
+	}
+
+/*** SNIPPET ENDS ***/

data/vendor/assets/stylesheets/magic/effects/_shadows.scss

@@ -23,14 +23,14 @@
 
 
 @mixin raised_shadow( $color, $times: 3, $horizontal: 0, $vertical: 10px, $blur: 10px, $size: -10px ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	@include make_shadows($horizontal, $vertical, $blur, $size, $color, $times);
 }
 
 @mixin pseudo_raised_shadow($color,$times:3,$gap:10px,$radius:3px,$horizontal:0,$vertical:3px,$blur:7px,$size:0){
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	// z-index: 3;
 	&:before {
 		content: ""; display: block; position: absolute; width:auto;
@@ -46,8 +46,8 @@
 }
 
 @mixin lifted_shadow( $color, $times: 3, $horizontal: 0, $vertical: 15px, $blur: 10px, $size: 0 ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	&:before, &:after {
 		content: ""; display: block; position: absolute;
 		bottom:15px;
@@ -67,8 +67,8 @@
 }
 
 @mixin perspective_shadow( $color, $times: 3, $degre: 30, $blur: 10px ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	&:before, &:after {
 		content: ""; display: block; position: absolute;
 		background: transparent;
@@ -92,8 +92,8 @@
 }
 
 @mixin vertical_curves( $color, $times: 3, $horizontal: 0, $vertical: 0, $blur: 15px, $size: 0 ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	&:before {
 		content: ""; display: block; position: absolute;
 		top: 10px; bottom: 10px;
@@ -105,8 +105,8 @@
 }
 
 @mixin horizontal_curves( $color, $times: 3, $horizontal: 0, $vertical: 0, $blur: 15px, $size: 0 ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	&:before {
 		content: ""; display: block; position: absolute;
 		top: 0; bottom: 0;
@@ -118,8 +118,8 @@
 }
 
 @mixin vertical_shine( $color, $times: 1, $width: 3px, $blur: 10px, $size: 0 ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	overflow: hidden;
 	&:before, &:after {
 		content: ""; display: block; position: absolute; z-index: 55;
@@ -139,8 +139,8 @@
 }
 
 @mixin horizontal_shine( $color, $times: 1, $width: 3px, $blur: 10px, $size: 0 ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	overflow: hidden;
 	&:before, &:after {
 		content: ""; display: block; position: absolute; z-index: 55;
@@ -163,8 +163,8 @@
 	$that: "";
 	$horizontal: 0;
 	$vertical: 0;
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	&:before {
 		content:""; position:absolute; z-index: -2;
 		@if $position == top {
@@ -202,8 +202,8 @@
 	$that: "";
 	$horizontal: 0;
 	$vertical: 0;
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	overflow:hidden;
 	&:before {
 		content:""; position:absolute; z-index: 3;
@@ -241,8 +241,8 @@
 
 
 @mixin paper_shadow( $color, $times: 3 ) {
-	position: relative;
-	display: block;
+	// position: relative;
+	// display: block;
 	&:before {
 		content:""; position:absolute; z-index: -2;
 		// @include make_shadows($horizontal, $vertical, $blur, $size, $color, $times);