reactive-css 0.1.0

data/README.mkdn

@@ -0,0 +1,54 @@
+Compass / Reactive Boilerplate Template
+=======================================
+
+Boilerplate template consisting of 3 partials and 2 helper files.
+
+
+Installation
+============
+
+From the command line:
+
+    (sudo) gem install reactive
+
+Add to a project:
+
+    // rails: compass.config, other: config.rb
+    require 'reactive'
+
+    // command line
+    compass install reactive
+    
+Or create a new project:
+
+    compass -r reactive -f reactive project_directory
+
+
+Reset
+==========
+Standard Reset from Eric Meyers
+To import use @import("reactive/reset");
+
+
+Clearfix
+==========
+Clearfix with has layout option for ie. Requires a boolean to enable/disable item.
+To import use @import("reactive/clearfix");
+To use @include clearfix;
+
+
+Variable to enable/disable ie is: $legacy-support-for-ie
+
+
+Font Library
+============
+HTML fonts available by calling a variable
+$helvetica
+$geneva
+$lucida
+$verdana
+$cambria
+$palatino
+$times
+$courier
+$monaco

data/lib/reactive.rb

@@ -0,0 +1,3 @@
+require 'compass'
+extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
+Compass::Frameworks.register('reactive', :path => extension_path)

data/stylesheets/_reactive.scss

@@ -0,0 +1,2 @@
+@import "reactive/reset";
+@import "reactive/clearfix";

data/stylesheets/reactive-css/_clearfix.scss

@@ -0,0 +1,24 @@
+@import "has-layout";
+
+@mixin clearfix {
+	&:before {
+		content: "\0020"; 
+		display: block; 
+		height: 0; 
+		visibility: hidden;
+	}
+	&:after {
+		content: "\0020"; 
+		display: block; 
+		height: 0; 
+		visibility: hidden;
+		clear: both;
+	}
+	@include has-layout;
+}
+@mixin cleartext {
+	overflow:hidden; 
+	font-size:0; 
+	line-height:0; 
+	text-indent:-9999px;
+}

data/stylesheets/reactive-css/_font-library.scss

@@ -0,0 +1,9 @@
+$helvetica: "helvetica neue", arial, helvetica, freesans, "liberation sans", "numbus sans l", sans-serif;
+$geneva: geneva, tahoma, "dejavu sans condensed", sans-serif;
+$lucida: "lucida grande", "lucia sans unicode", "lucida sans", lucida, sans-serif;
+$verdana: verdana, "bitstream vera sans", "dejavu sans", "liberation sans", geneva, sans-serif;
+$cambria: cambria, georgia, "bitstream charter", "century schoolbook l", "liberation serif", times, serif;
+$palatino: "palatino linotype", palatino, palladio, "urw palladio l", "book antiqua", "liberation serif", times, serif;
+$times: times, "times new roman", "nimbus roman no9 l", freeserif, "liberation serif", serif;
+$courier: "courier new", courier, freemono, "nimbus mono l", "liberation mono", monospace;
+$monaco: monaco, "lucida console", "dejavu sans mono", "bitstream vera sans mono", "liberation mono", monospace;

data/stylesheets/reactive-css/_has-layout.scss

@@ -0,0 +1,46 @@
+@import "support";
+
+// The `zoom` approach generates less CSS but does not validate.
+// Set this to `block` to use the display-property to hack the
+// element to gain layout.
+$default-has-layout-approach: zoom !default;
+
+// This mixin causes an element matching the selector
+// to gain the "hasLayout" property in internet explorer.
+// More information on [hasLayout](http://reference.sitepoint.com/css/haslayout).
+@mixin has-layout($approach: $default-has-layout-approach) {
+  @if $legacy-support-for-ie {
+    @if $approach == zoom {
+      @include has-layout-zoom;
+    } @else if $approach == block {
+      @include has-layout-block;
+    } @else {
+      @warn "Unknown has-layout approach: #{$approach}";
+      @include has-layout-zoom;
+    }
+  }
+}
+
+@mixin has-layout-zoom {
+  @if $legacy-support-for-ie {
+    *zoom: 1;
+  }
+}
+
+@mixin has-layout-block {
+  @if $legacy-support-for-ie {
+    // This makes ie6 get layout
+    display: inline-block;
+    // and this puts it back to block
+    & { display: block; }
+  }
+}
+
+// A hack to supply IE6 (and below) with a different property value.
+// [Read more](http://www.cssportal.com/css-hacks/#in_css-important).
+@mixin bang-hack($property, $value, $ie6-value) {
+  @if $legacy-support-for-ie6 {
+    #{$property}: #{$value} !important;
+    #{$property}: #{$ie6-value};
+  }
+}

data/stylesheets/reactive-css/_reset.scss

@@ -0,0 +1,31 @@
+/* RESET (meyerweb.com/eric/tools/css/reset/)*/
+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, figcaption, figure, footer, header, hgroup, menu, nav, section, 
+summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; font: inherit;
+vertical-align: baseline;}
+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;}
+ins {text-decoration: none;}
+del {text-decoration: line-through;}
+table {border-collapse: collapse;border-spacing: 0;}
+
+/* REACTIVE - BASE STYLES
+ -----------------------------------------------------------------------------------------------------------*/
+input[type=button], input[type=submit], button { cursor: pointer; }
+menu li { margin: 0; } 
+#skipLinks{	height: 1px; left: -999em; position: absolute; top: -999em; width: 1px; }
+em, i{font-style:italic;}strong, b{font-weight:bold;}
+
+/* STRUCTURE
+ -----------------------------------------------------------------------------------------------------------*/
+html, body{
+	width:100%;
+	height:100%;
+	}
+

data/stylesheets/reactive-css/_support.scss

@@ -0,0 +1,36 @@
+// Usually compass hacks apply to both ie6 & 7 -- set this to false to disable support for both.
+$legacy-support-for-ie: true !default;
+
+// Setting this to false will result in smaller output, but no support for ie6 hacks
+$legacy-support-for-ie6: $legacy-support-for-ie !default;
+
+// Setting this to false will result in smaller output, but no support for ie7 hacks
+$legacy-support-for-ie7: $legacy-support-for-ie !default;
+
+// Setting this to false will result in smaller output, but no support for legacy ie8 hacks
+$legacy-support-for-ie8: $legacy-support-for-ie !default;
+
+// @private
+// The user can simply set $legacy-support-for-ie and 6, 7, and 8 will be set accordingly,
+// But in case the user set each of those explicitly, we need to sync the value of
+// this combined variable.
+$legacy-support-for-ie: $legacy-support-for-ie6 or $legacy-support-for-ie7 or $legacy-support-for-ie8;
+
+// Support for mozilla in experimental css3 properties (-moz).
+$experimental-support-for-mozilla      : true !default;
+// Support for webkit in experimental css3 properties (-webkit).
+$experimental-support-for-webkit       : true !default;
+// Support for webkit's original (non-standard) gradient syntax.
+$support-for-original-webkit-gradients : true !default;
+// Support for opera in experimental css3 properties (-o).
+$experimental-support-for-opera        : true !default;
+// Support for microsoft in experimental css3 properties (-ms).
+$experimental-support-for-microsoft    : true !default;
+// Support for khtml in experimental css3 properties (-khtml).
+$experimental-support-for-khtml        : false !default;
+// Support for svg in experimental css3 properties.
+// Setting this to true might add significant size to your
+// generated stylesheets.
+$experimental-support-for-svg          : false !default;
+// Support for CSS PIE in experimental css3 properties (-pie).
+$experimental-support-for-pie          : false !default;

data/templates/project/manifest.rb

@@ -0,0 +1,16 @@
+# Make sure you list all the project template files here in the manifest.
+description "A basic install of the commonly used styles for Reactive."
+stylesheet 'screen.scss', :media => 'screen, projection'
+
+help %Q{
+By default a basic reset and clearfix is included on first install. To use the clear fix simply type @include clearfix inside the declaration as follows:
+
+.example {
+	@include clearfix
+}
+
+}
+
+welcome_message %Q{
+Thank you for using the SASS Reactive Extension. Should you have any questions please ask Sam Chalmers (the king of FEDs).
+}

data/templates/project/screen.scss

@@ -0,0 +1,7 @@
+/*
+  Welcome to the Reactive Extension.
+  In this file you should write your main styles. (or centralize your imports)
+  Import this file using the following HTML or equivalent:
+  <link href="/stylesheets/screen.css" media="screen, projection" />
+
+@import reactive-css/reset

metadata

@@ -0,0 +1,88 @@
+--- !ruby/object:Gem::Specification 
+name: reactive-css
+version: !ruby/object:Gem::Version 
+  hash: 27
+  prerelease: 
+  segments: 
+  - 0
+  - 1
+  - 0
+  version: 0.1.0
+platform: ruby
+authors: 
+- Ritchie Anesco
+autorequire: 
+bindir: bin
+cert_chain: []
+
+date: 2012-05-10 00:00:00 Z
+dependencies: 
+- !ruby/object:Gem::Dependency 
+  name: compass
+  prerelease: false
+  requirement: &id001 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 29
+        segments: 
+        - 0
+        - 11
+        version: "0.11"
+  type: :runtime
+  version_requirements: *id001
+description: Boilerplate template implementation for compass
+email: ritchie.anesco@reactive.com
+executables: []
+
+extensions: []
+
+extra_rdoc_files: []
+
+files: 
+- README.mkdn
+- lib/reactive.rb
+- stylesheets/_reactive.scss
+- stylesheets/reactive-css/_clearfix.scss
+- stylesheets/reactive-css/_font-library.scss
+- stylesheets/reactive-css/_has-layout.scss
+- stylesheets/reactive-css/_reset.scss
+- stylesheets/reactive-css/_support.scss
+- templates/project/manifest.rb
+- templates/project/screen.scss
+homepage: http://www.reactive.com/
+licenses: []
+
+post_install_message: 
+rdoc_options: []
+
+require_paths: 
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      hash: 3
+      segments: 
+      - 0
+      version: "0"
+required_rubygems_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      hash: 3
+      segments: 
+      - 0
+      version: "0"
+requirements: []
+
+rubyforge_project: 
+rubygems_version: 1.8.24
+signing_key: 
+specification_version: 3
+summary: Boilerplate template implementation for compass
+test_files: []
+