compass-capucine 0.2.0 → 0.2.1

data/Gemfile

@@ -1,15 +1,7 @@
 source "http://rubygems.org"
 gem 'compass'
-# Add dependencies required to use your gem here.
-# Example:
-#   gem "activesupport", ">= 2.3.5"
 
-# Add dependencies to develop your gem here.
-# Include everything needed to run rake, tests, features, etc.
 group :development do
-  # gem "shoulda", ">= 0"
-  # gem "rdoc", "~> 3.12"
   gem "bundler", "~> 1.0.0"
   gem "jeweler", "~> 1.8.3"
-  # gem "rcov", ">= 0"
 end

data/README.md

@@ -1,17 +1,17 @@
 # Compass plugin from Capucine
 
-You can take a look at [Capucine](http://github.com/damln/Capucine).  
+You can take a look at [Capucine](http://github.com/damln/Capucine).
 
 <a target="_blank" href="https://twitter.com/share" class="twitter-share-button" data-via="damln">Tweet This</a>
 
 
-## Usage
+## Usage Standalone
 
 **Install the gem**
 
     gem install compass-capucine
 
-**Add it to your Gemfile**
+** or Add it to your Gemfile**
 
     gem 'compass-capucine'
 
@@ -26,7 +26,7 @@ You can take a look at [Capucine](http://github.com/damln/Capucine).
 **Import it into your SCSS file**
 
     @import "compass-capucine";
-    
+
 This will import that :
 
     @import "compass-capucine/box";
@@ -37,7 +37,7 @@ This will import that :
     @import "compass-capucine/normalize";
     @import "compass-capucine/normalize-plus";
     @import "compass-capucine/print";
-   
+
     @import "compass-capucine/helpers";
     @import "compass-capucine/box";
 
@@ -56,35 +56,31 @@ This will import that :
     bundle install
 
 **Add it to your Application.rb**
-        
+
     # Enable the asset pipeline
     config.assets.enabled = true
 
 **Import it into your SCSS file**
 
     @import "compass-capucine";
-    
- 
+
+
 # Mixins availables
 
-### Helpers 
+### Helpers
 
 - `unselectable`
-- `hidden`
 - `visually-hidden`
 - `clearfix`
-- `scale-img`
 - `selection ( $background_color , $font_color )`
 - `pressed-effect ( $top_margin, $left_margin, $right_margin )`
 - `vertical-gradient ( $top_color, $bottom_color )`
-- `fake-helvetica ( $failback_font )`
 - `smart-text-shadow ( $color, $pixels )`
 
 ### Box
 
 - `box ( $width, $height, $display )`
 - `circle ( $diam )`
-- `square ( $size, $display )`
 - `centerX`
 - `centerXY ( $width, $heigh, $position )`
 - `max-width ( $max )`

data/Rakefile

@@ -25,29 +25,8 @@ Jeweler::Tasks.new do |gem|
 end
 Jeweler::RubygemsDotOrgTasks.new
 
-# require 'rake/testtask'
-# Rake::TestTask.new(:test) do |test|
-#   test.libs << 'lib' << 'test'
-#   test.pattern = 'test/**/test_*.rb'
-#   test.verbose = true
-# end
 
-# require 'rcov/rcovtask'
-# Rcov::RcovTask.new do |test|
-#   test.libs << 'test'
-#   test.pattern = 'test/**/test_*.rb'
-#   test.verbose = true
-#   test.rcov_opts << '--exclude "gems/*"'
-# end
 
-task :default => :test
+task :default => :install
 
-# require 'rdoc/task'
-# Rake::RDocTask.new do |rdoc|
-#   version = File.exist?('VERSION') ? File.read('VERSION') : ""
 
-#   rdoc.rdoc_dir = 'rdoc'
-#   rdoc.title = "compass-capucine #{version}"
-#   rdoc.rdoc_files.include('README*')
-#   rdoc.rdoc_files.include('lib/**/*.rb')
-# end

data/VERSION

@@ -1 +1 @@
-0.2.0
+0.2.1

data/compass-capucine.gemspec

@@ -5,11 +5,11 @@
 
 Gem::Specification.new do |s|
   s.name = "compass-capucine"
-  s.version = "0.2.0"
+  s.version = "0.2.1"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
   s.authors = ["Damian Le Nouaille"]
-  s.date = "2012-05-28"
+  s.date = "2012-08-05"
   s.description = "Compass Plugin with helpers"
   s.email = "dam@dln.name"
   s.extra_rdoc_files = [
@@ -25,19 +25,32 @@ Gem::Specification.new do |s|
     "VERSION",
     "capucine-logo-mini.png",
     "compass-capucine.gemspec",
+    "examples/.compass_config.rb",
+    "examples/capucine.yaml",
+    "examples/css_generated/all.css",
+    "examples/css_generated/box.css",
+    "examples/css_generated/ie6.css",
+    "examples/css_generated/ie7.css",
+    "examples/css_generated/reset.css",
+    "examples/index.html",
+    "examples/sass/_box.scss",
+    "examples/sass/_helpers.scss",
+    "examples/sass/all.scss",
+    "examples/sass/ie6.scss",
+    "examples/sass/ie7.scss",
+    "examples/sass/reset.scss",
     "lib/compass-capucine.rb",
     "stylesheets/_compass-capucine.scss",
-    "stylesheets/compass-capucine/_box.sass",
-    "stylesheets/compass-capucine/_helpers.sass",
+    "stylesheets/compass-capucine/_box.scss",
+    "stylesheets/compass-capucine/_helpers.scss",
     "stylesheets/compass-capucine/_normalize-plus.scss",
     "stylesheets/compass-capucine/_normalize.scss",
-    "stylesheets/compass-capucine/_print.scss",
-    "stylesheets/compass-capucine/_reset.sass"
+    "stylesheets/compass-capucine/_print.scss"
   ]
   s.homepage = "http://github.com/damln/compass-capucine"
   s.licenses = ["MIT"]
   s.require_paths = ["lib"]
-  s.rubygems_version = "1.8.21"
+  s.rubygems_version = "1.8.24"
   s.summary = "Compass Plugin with helpers"
 
   if s.respond_to? :specification_version then

data/examples/.compass_config.rb

@@ -0,0 +1,24 @@
+# !!!! NEVER EDIT THIS FILE !!!!
+# ALWAYS EDIT : capucine.yaml
+
+
+
+require "compass-capucine"
+
+
+
+project_type = :stand_alone
+
+
+sass_dir = "sass"
+
+css_dir = "css_generated"
+
+images_dir = "public/images"
+
+output_style = :expanded
+
+line_comments = false
+
+sass_options = {:cache => false}
+

data/examples/capucine.yaml

@@ -0,0 +1,13 @@
+use_compass: true
+
+compass:
+  sass_dir: sass
+  css_dir: css_generated
+  output_style: expanded # compact | expanded | compressed
+
+compass_plugins:
+  - compass-capucine
+
+
+
+# DOCUMENTATION : http:// capucine.dln.name

data/examples/css_generated/all.css

@@ -0,0 +1,136 @@
+.square {
+  width: 100px;
+  height: 100px;
+  background: #F0C526;
+}
+
+.box {
+  width: 200px;
+  height: 100px;
+  background: #F78331;
+}
+
+.circle {
+  width: 100px;
+  height: 100px;
+  -webkit-border-radius: 50px;
+  -moz-border-radius: 50px;
+  -ms-border-radius: 50px;
+  -o-border-radius: 50px;
+  border-radius: 50px;
+  background: #F73158;
+}
+
+.centerXY {
+  display: block;
+  position: absolute;
+  width: 300px;
+  height: 100px;
+  top: 50%;
+  left: 50%;
+  margin-top: -50px;
+  margin-left: -150px;
+  position: fixed;
+  background: #9E1B90;
+}
+
+.max-width {
+  max-width: 200px;
+  height: 100px;
+  background: #C231F7;
+}
+
+.min-max-width {
+  min-width: 500px;
+  max-width: 800px;
+  height: 100px;
+  background: #5C31F7;
+  margin: 0 auto;
+}
+
+.max-width-no-ie6 {
+  max-width: 230px;
+}
+
+.min-max-width-no-ie6 {
+  min-width: 100px;
+  max-width: 230px;
+}
+
+.unselectable {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+  -moz-user-select: -moz-none;
+}
+
+.visually-hidden {
+  border: 0;
+  padding: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  width: 1px;
+  margin: -1px;
+  overflow: hidden;
+  position: absolute;
+}
+.visually-hidden.focusable:active, .visually-hidden.focusable:focus {
+  clip: auto;
+  height: auto;
+  padding: 0;
+  margin: 0;
+  overflow: visible;
+  position: static;
+  width: auto;
+}
+
+.clearfix {
+  clear: both;
+  display: block;
+  *zoom: 1;
+}
+.clearfix:before, .clearfix:after {
+  content: "\0020";
+  display: table;
+}
+.clearfix:after {
+  clear: both;
+}
+
+::-moz-selection {
+  background: #87e5ff;
+  color: #fefefe;
+}
+
+::selection {
+  background: #87e5ff;
+  color: #fefefe;
+}
+
+.pressed-effect:active {
+  position: relative;
+  top: 1px;
+}
+
+.vertical-gradient {
+  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #111111), color-stop(100%, #777777));
+  background-image: -webkit-linear-gradient(#111111, #777777);
+  background-image: -moz-linear-gradient(#111111, #777777);
+  background-image: -o-linear-gradient(#111111, #777777);
+  background-image: -ms-linear-gradient(#111111, #777777);
+  background-image: linear-gradient(#111111, #777777);
+  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF111111', endColorstr='#FF777777');
+  width: 200px;
+  height: 200px;
+}
+
+.smart-text-shadow {
+  width: 200px;
+  height: 200px;
+  text-shadow: #777777 0 1px 0;
+  color: #444;
+  text-align: center;
+  padding: 20px;
+}

data/examples/css_generated/box.css

@@ -0,0 +1,61 @@
+.square {
+  width: 100px;
+  height: 100px;
+  background: #F0C526;
+}
+
+.box {
+  width: 200px;
+  height: 100px;
+  background: #F78331;
+}
+
+.circle {
+  width: 100px;
+  height: 100px;
+  -webkit-border-radius: 50px;
+  -moz-border-radius: 50px;
+  -ms-border-radius: 50px;
+  -o-border-radius: 50px;
+  border-radius: 50px;
+  background: #F73158;
+}
+
+.centerXY {
+  display: block;
+  position: absolute;
+  width: 300px;
+  height: 100px;
+  top: 50%;
+  left: 50%;
+  margin-top: -50px;
+  margin-left: -150px;
+  background: #9E1B90;
+}
+
+.max-width {
+  max-width: 200px;
+  width: expression(document.body.clientWidth > parseInt("200px") ? "200px" : "auto");
+  height: 100px;
+  background: #C231F7;
+}
+
+.min-max-width {
+  min-width: 500px;
+  width: auto !important;
+  width: 500px;
+  max-width: 800px;
+  width: expression(document.body.clientWidth > parseInt("800px") ? "800px" : "auto");
+  height: 100px;
+  background: #5C31F7;
+  margin: 0 auto;
+}
+
+.max-width-no-ie6 {
+  max-width: 230px;
+}
+
+.min-max-width-no-ie6 {
+  min-width: 100px;
+  max-width: 230px;
+}

data/examples/css_generated/ie6.css

@@ -0,0 +1,140 @@
+.square {
+  width: 100px;
+  height: 100px;
+  background: #F0C526;
+}
+
+.box {
+  width: 200px;
+  height: 100px;
+  background: #F78331;
+}
+
+.circle {
+  width: 100px;
+  height: 100px;
+  -webkit-border-radius: 50px;
+  -moz-border-radius: 50px;
+  -ms-border-radius: 50px;
+  -o-border-radius: 50px;
+  border-radius: 50px;
+  background: #F73158;
+}
+
+.centerXY {
+  display: block;
+  position: absolute;
+  width: 300px;
+  height: 100px;
+  top: 50%;
+  left: 50%;
+  margin-top: -50px;
+  margin-left: -150px;
+  position: fixed;
+  background: #9E1B90;
+}
+
+.max-width {
+  max-width: 200px;
+  width: expression(document.body.clientWidth > parseInt("200px") ? "200px" : "auto");
+  height: 100px;
+  background: #C231F7;
+}
+
+.min-max-width {
+  min-width: 500px;
+  width: auto !important;
+  width: 500px;
+  max-width: 800px;
+  width: expression(document.body.clientWidth > parseInt("800px") ? "800px" : "auto");
+  height: 100px;
+  background: #5C31F7;
+  margin: 0 auto;
+}
+
+.max-width-no-ie6 {
+  max-width: 230px;
+}
+
+.min-max-width-no-ie6 {
+  min-width: 100px;
+  max-width: 230px;
+}
+
+.unselectable {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+  -moz-user-select: -moz-none;
+}
+
+.visually-hidden {
+  border: 0;
+  padding: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  width: 1px;
+  margin: -1px;
+  overflow: hidden;
+  position: absolute;
+}
+.visually-hidden.focusable:active, .visually-hidden.focusable:focus {
+  clip: auto;
+  height: auto;
+  padding: 0;
+  margin: 0;
+  overflow: visible;
+  position: static;
+  width: auto;
+}
+
+.clearfix {
+  clear: both;
+  display: block;
+  *zoom: 1;
+}
+.clearfix:before, .clearfix:after {
+  content: "\0020";
+  display: table;
+}
+.clearfix:after {
+  clear: both;
+}
+
+::-moz-selection {
+  background: #87e5ff;
+  color: #fefefe;
+}
+
+::selection {
+  background: #87e5ff;
+  color: #fefefe;
+}
+
+.pressed-effect:active {
+  position: relative;
+  top: 1px;
+}
+
+.vertical-gradient {
+  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #111111), color-stop(100%, #777777));
+  background-image: -webkit-linear-gradient(#111111, #777777);
+  background-image: -moz-linear-gradient(#111111, #777777);
+  background-image: -o-linear-gradient(#111111, #777777);
+  background-image: -ms-linear-gradient(#111111, #777777);
+  background-image: linear-gradient(#111111, #777777);
+  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF111111', endColorstr='#FF777777');
+  width: 200px;
+  height: 200px;
+}
+
+.smart-text-shadow {
+  width: 200px;
+  height: 200px;
+  text-shadow: #777777 0 1px 0;
+  color: #444;
+  text-align: center;
+  padding: 20px;
+}