compass 0.12.4 → 1.0.0

data/examples/css3/index.html.haml

@@ -1,57 +0,0 @@
-!!!
-%html
-  %head
-    %link(href="stylesheets/fancy-fonts.css" rel="stylesheet" type="text/css")
-    %link(href="stylesheets/main.css" rel="stylesheet" type="text/css")
-    %link(href="stylesheets/gradient.css" rel="stylesheet" type="text/css")
-  %body
-    %h1 Compass CSS3 Module
-    #container
-      .examples
-        #background-clip.example
-          %h2 Background Clip & Origin
-          %pre.padding-box
-            %code<>
-              +background-clip("padding-box")<br />+background-origin("padding-box")
-          %pre.border-box
-            %code<>
-              +background-clip("border-box")<br />+background-origin("border-box")
-        .gutter
-        #background-size.example
-          %h2 Background Size
-          %pre.top-left
-            %code<>
-              +background-size(50% 50%)
-          %pre.centered
-            %code<>
-              +background-size(50% 50%)<br />background-position: center center
-        .gutter
-        #gradients.example
-          %h2 Gradients
-          %pre.horizontal
-            %code<>
-              :preserve
-                +linear-gradient(
-                  color_stops(#d92626, #2626d9),
-                  "left")
-          %pre.vertical
-            %code<>
-              :preserve
-                +linear-gradient(
-                  color_stops(#d92626, #2626d9))
-          %pre.radial
-            %code<>
-              +radial-gradient(<br>  color_stops(#d92626, #2626d9))
-          %a(href="gradients.html") More Gradients
-      .examples
-        #border-radius.example
-          %h2 Border Radius
-          %p This box has rounded corners
-        .gutter
-        #box-shadow.example
-          %h2 Box Shadow
-        .gutter
-        #box-sizing.example
-          %h2 Box Sizing
-
-

data/examples/css3/src/_base.scss

@@ -1,13 +0,0 @@
-@import "compass/utilities";
-@import "compass/css3";
-
-@mixin container {
-  @include clearfix;
-  overflow: auto; }
-
-@mixin row {
-  @include clearfix; }
-
-@mixin column {
-  float: left;
-  @include box-sizing(border-box); }

data/examples/css3/src/fancy-fonts.scss

@@ -1,13 +0,0 @@
-@import "compass/css3";
-
-@include font-face("Blooming Grove", font-files("bgrove.ttf", truetype, "bgrove.otf", opentype));
-
-@include font-face("Prociono", font-files("Prociono.otf", opentype));
-
-h1 {
-  font-family: "Blooming Grove";
-  font-size: 3em; }
-
-h2 {
-  font-family: "Prociono";
-  font-size: 2em; }

data/examples/css3/src/gradients.scss

@@ -1,86 +0,0 @@
-@import "compass/css3";
-
-#gradient {
-  width: 200px;
-  height: 100px;
-  border: 1px solid #777777; }
-
-thead th {
-  min-height: 50px;
-  min-width: 100px;
-  @include text-shadow(white); }
-
-th.linear {
-  @include background-image(linear-gradient(white, red 50%, yellow 75%, lime)); }
-
-th.radial {
-  @include background-image(radial-gradient(white, red 20px, yellow 30px, lime 40px)); }
-
-tr.default {
-  td.linear {
-    @include background-image(linear-gradient(#cc0000, #0000cc)); }
-  td.radial {
-    @include background-image(radial-gradient(#cc0000, #0000cc)); }
-  td.linear-code:before {
-    content: "+background-image(linear-gradient(#c00, #00c))"; }
-  td.radial-code:before {
-    content: "+background-image(radial-gradient(#c00, #00c))"; } }
-
-tr.top-left {
-  td.linear {
-    @include background-image(linear-gradient(top left, #cc0000, #0000cc)); }
-  td.radial {
-    @include background-image(radial-gradient(top left, #cc0000, #0000cc)); }
-  td.linear-code:before {
-    content: '+background-image(linear-gradient(top left, #c00, #00c))'; }
-  td.radial-code:before {
-    content: '+background-image(radial-gradient(top left, #c00, #00c))'; } }
-
-tr.bottom-right {
-  td.linear {
-    @include background-image(linear-gradient(bottom right, #cc0000, #0000cc)); }
-  td.radial {
-    @include background-image(radial-gradient(bottom right, #cc0000, #0000cc)); }
-  td.linear-code:before {
-    content: '+background-image(linear-gradient(bottom right, #c00, #00c))'; }
-  td.radial-code:before {
-    content: '+background-image(radial-gradient(bottom right, #c00, #00c))'; } }
-
-tr.three-color {
-  td.linear {
-    @include background-image(linear-gradient(#cc0000, white, #0000cc)); }
-  td.radial {
-    @include background-image(radial-gradient(#cc0000, white, #0000cc 50px)); }
-  td.linear-code:before {
-    content: "+background-image(linear-gradient(#c00, #fff, #00c))"; }
-  td.radial-code:before {
-    content: "+background-image(radial-gradient(#c00, #fff, #00c 50px))"; } }
-
-tr.four-color {
-  td.linear {
-    @include background-image(linear-gradient(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc)); }
-  td.radial {
-    @include background-image(radial-gradient(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc 50px)); }
-  td.linear-code:before {
-    content: "+background-image(linear-gradient(#c00, #0c0 25%, #0cc 75%, #00c))"; }
-  td.radial-code:before {
-    content: "+background-image(radial-gradient(#c00, #0c0 25%, #0cc 75%, #00c 50px))"; } }
-
-tr.filled-in {
-  td.linear {
-    @include background-image(linear-gradient(#cc0000 33%, #0000cc 66%)); }
-  td.radial {
-    @include background-image(radial-gradient(#cc0000 25px, #0000cc 75px)); }
-  td.linear-code:before {
-    content: "+background-image(linear-gradient(#c00 33%, #00c 66%))"; }
-  td.radial-code:before {
-    content: "+background-image(radial-gradient(#c00 25px, #00c 75px))"; } }
-tr.with-bg {
-  td.linear {
-    @include background-image(image-url("button_bg.png"), linear-gradient(top, #c00 33%, #00c 66%)); }
-  td.radial {
-    @include background-image(image-url("button_bg.png"), radial-gradient(center center, #c00 25px, #00c 75px)); }
-  td.linear-code:before {
-    content: "+background-image(image-url(\"button_bg.png\"), linear-gradient(top, #c00 33%, #00c 66%))"; }
-  td.radial-code:before {
-    content: "+background-image(image-url(\"button_bg.png\"), radial-gradient(center center, #c00 25px, #00c 75px))"; } }

data/examples/css3/src/main.scss

@@ -1,108 +0,0 @@
-@import "blueprint/reset";
-@import "base";
-@import "fancy-fonts";
-
-$border_color: #aaaaaa;
-
-#container {
-  @include container; }
-
-$min_width: 340px;
-
-.examples {
-  margin-bottom: 1em;
-  @include row;
-  min-width: $min_width * 3 + 20px * 2 + 20px; }
-
-h1 {
-  text-align: center; }
-
-.example, .gutter {
-  min-height: 21em; }
-
-.example {
-  @include column;
-  width: 30%;
-  min-width: $min_width;
-  border: 4px solid #{$border_color};
-  @include border-radius(0.667em);
-  @include single-box-shadow(darken($border_color, 40), 5px, 5px, 2px);
-  margin-bottom: 1em;
-  h2 {
-    margin: 0.5em 0 1em;
-    text-align: center; } }
-
-.inset {
-  @include single-box-shadow(darken($border_color, 40), 5px, 5px, 2px, 3px, inset);
-}
-
-.gutter {
-  display: block;
-  float: left;
-  width: 2.5%;
-  min-width: 20px;
-  content: " "; }
-
-.example {
-  @include background-image(linear-gradient(white, #cccccc));
-  pre {
-    padding: 1em;
-    margin: 1em;
-    color: white;
-    text-shadow: 1px 1px 2px black;
-    font-weight: bold; } }
-
-#background-clip {
-  pre {
-    background: transparent #{image_url("example.png")} no-repeat;
-    border: 1em solid rgba(255, 0, 0, 0.25); }
-  .padding-box {
-    @include background-clip(padding-box);
-    @include background-origin(padding-box); }
-  .border-box {
-    @include background-clip(border-box);
-    @include background-origin(border-box); } }
-
-#background-size {
-  pre {
-    background: transparent #{image_url("example.png")} no-repeat;
-    border: 1em solid #{mix(red, white, 0.5)};
-    border: 1em solid rgba(255, 0, 0, 0.25); }
-  .top-left {
-    @include background-size(50% 50%); }
-  .centered {
-    @include background-size(50% 50%);
-    background-position: center center; } }
-
-#gradients {
-  .horizontal {
-    @include background-image(left, linear-gradient(#d92626, #2626d9)); }
-  .vertical {
-    @include background-image(linear-gradient(#d92626, #2626d9)); }
-  .diagonal {
-    @include background-image(linear-gradient(right top, #d92626, #2626d9)); }
-  .radial {
-    /* +radial-gradient(color_stops(#d92626 0, #2626d9 1)) */
-    @include background-image(radial-gradient(#d92626 10px, #2626d9 150px));
-    // +radial-gradient("center center, 10, center center, 100", #d92626, #2626d9)
-    // background-image: -moz-radial-gradient(20px center, circle, #d92626 10px, #2626d9 100px)
-    // background-color: #2626d9
-  }
-  .radial-1 {
-    // A default radial gradient:
-    @include background-image(radial-gradient(#dddddd, #aaaaaa)); }
-  .radial-2 {
-    // A centered gradient
-    @include background-image(radial-gradient(#dddddd, #aaaaaa)); }
-  .radial-3 {
-    // A centered radial gradient at the top
-    @include background-image(radial-gradient(top center, #dddddd, #aaaaaa)); }
-  .radial-4 {
-    // A centered radial gradient with fixed color stops
-    @include background-image(radial-gradient(#dddddd 20px, #aaaaaa 50px)); }
-  .radial-5 {
-    // A centered gradient with several color stops
-    @include background-image(radial-gradient(#dddddd 20px, #aaaaaa 50%, #cc0000 200px)); }
-  .radial-6 {
-    // A centered gradient with color stops
-    @include background-image(radial-gradient(#00cc00 0px, #dddddd 20px, #aaaaaa 50px, #0000cc 100px)); } }

data/examples/downloader.rb

@@ -1,58 +0,0 @@
-require 'net/http'
-require 'fileutils'
-require 'rubygems'
-require 'zip/zip'
-
-
-def fetch(uri_str, limit = 10)
-  raise ArgumentError, 'HTTP redirect too deep' if limit == 0
-
-  url = URI.parse(uri_str)
-  http = Net::HTTP.new(url.host, url.port)
-  http.open_timeout = 10
-  http.read_timeout = 30
-  http.use_ssl = true
-  response = http.start do |http|
-     puts "getting #{url.path}"
-     http.request_get(url.path)
-  end
-  
-  case response
-  when Net::HTTPSuccess     then response
-  when Net::HTTPRedirection then fetch(response['location'], limit - 1)
-  else
-    response.error!
-  end
-end
-
-def install_from_github(user, project, ext_name, branch = "master", working_directory = Dir.pwd)
-  download_link = "https://github.com/#{user}/#{project}/zipball/#{branch}"
-  extdir = File.join(working_directory,'extensions')
-  
-  if !File.exists?("#{extdir}/#{ext_name}")
-    begin
-      puts "Downloading the #{ext_name} plugin into #{extdir}."
-      FileUtils.mkdir_p("#{extdir}")
-      zipfile = File.join(extdir, "#{ext_name}.zip")
-      open(zipfile, "wb") do |tgz|
-        tgz << fetch(download_link).body
-      end
-      puts "Unzipping the #{ext_name} plugin."
-      Zip::ZipFile::open(zipfile) { |zf|
-         zf.each { |e|
-           fpath = File.join(extdir, e.name)
-           FileUtils.mkdir_p(File.dirname(fpath))
-           zf.extract(e, fpath)
-         }
-      }
-      File.unlink(zipfile)
-      funky_directory = Dir.glob(File.join(extdir,"#{user}-#{project}-*"))[0]
-      FileUtils.mv(funky_directory, File.join(extdir, ext_name))
-      puts "#{ext_name} installed."
-    rescue Exception => e
-      FileUtils.rm_rf(extdir)
-      raise
-    end
-  end
-
-end

data/examples/ninesixty/bootstrap.rb

@@ -1,4 +0,0 @@
-require File.join(File.dirname(__FILE__), '..', 'downloader')
-
-install_from_github('nextmat', 'compass-960-plugin', 'ninesixty')
-

data/examples/ninesixty/clean.rb

@@ -1,2 +0,0 @@
-require 'fileutils'
-FileUtils.rm_rf "#{File.dirname(__FILE__)}/extensions"

data/examples/ninesixty/config.rb

@@ -1,10 +0,0 @@
-project_type = :stand_alone
-# Set this to the root of your project when deployed:
-http_path = "/"
-css_dir = "stylesheets"
-sass_dir = "src"
-images_dir = "images"
-output_style = :compact
-# To enable relative paths to assets via compass helper functions. Uncomment:
-# relative_assets = true
-sass_options = {:quiet => true}

data/examples/ninesixty/src/grid.scss

@@ -1,15 +0,0 @@
-/* 960 Grid System ~ Core CSS.
- * Learn more ~ http://960.gs/
- *
- * Licensed under GPL and MIT. */
-
-@import "compass/utilities/general/reset";
-@import "960/grid";
-
-@include global-reset;
-
-.container_12 {
-  @include grid-system(12); }
-
-.container_16 {
-  @include grid-system(16); }

data/examples/ninesixty/src/text.scss

@@ -1,8 +0,0 @@
-/* 960 Grid System ~ Text CSS.
- * Learn more ~ http://960.gs/
- *
- * Licensed under GPL and MIT. */
-
-@import "960/text";
-
-@include text;

data/examples/susy/bootstrap.rb

@@ -1,3 +0,0 @@
-require File.join(File.dirname(__FILE__), '..', 'downloader')
-
-install_from_github('ericam', 'compass-susy-plugin', 'susy')

data/examples/susy/clean.rb

@@ -1,2 +0,0 @@
-require 'fileutils'
-FileUtils.rm_rf "#{File.dirname(__FILE__)}/extensions"

data/examples/susy/config.rb

@@ -1,10 +0,0 @@
-project_type = :stand_alone
-# Set this to the root of your project when deployed:
-http_path = "/"
-css_dir = "stylesheets"
-sass_dir = "src"
-images_dir = "images"
-output_style = :compact
-# To enable relative paths to assets via compass helper functions. Uncomment:
-# relative_assets = true
-sass_options = {:quiet => true}

data/examples/susy/src/_base.scss

@@ -1,61 +0,0 @@
-//**
-//  Susy: Fixed-Elastic-Fluid grids without all the math
-//  By: Eric A. Meyer and OddBird Collective
-//  Site: www.oddbird.net/susy/
-//**
-
-// GRID
-// Set these values as needed for your grid layout.
-//  - defaults are shown.
-$grid_unit: em;
-
-$total_cols: 12;
-
-$col_width: 4;
-
-$gutter_width: 1;
-
-$side_gutter_width: $gutter_width;
-
-// OMEGA_FLOAT
-// By default, +omega elements are floated right.
-// You can override that globally here:
-// !omega_float = "right"
-
-// HACKS
-// Are you using hacks or conditional comments? Susy makes both possible.
-// Leave this as 'true' to use hacks, set it as false for conditional comments.
-// Conditional comments will require overrides for +omega, +inline-block and
-// several other mixins.
-// !hacks = true
-
-// FONT-SIZE
-// Override these values as needed (defaults are shown)
-//  - You set the font and line heights in pixels.
-//  - Susy will do the math and give you !base_font_size and !base_line_height
-//    variables, set flexibly against the common browser default of 16px
-$base_font_size_px: 16;
-
-$base_line_height_px: 24;
-
-// SUSY
-// Don't move this @import above the GRID and FONT-SIZE overrides.
-@import "susy/susy";
-
-// COLORS
-// Set any colors you will need later.
-$main: #194c66;
-
-$alt: #cc6633;
-
-// FONTS
-// Give yourself some font stacks to work with.
-@mixin sans-family {
-  font-family: Helvetica, Arial, sans-serif; }
-
-@mixin serif-family {
-  font-family: Baskerville, Palatino, serif; }
-
-// OTHER MIXINS
-// Mixins set here will be available in defaults, screen, print and IE
-// Or anywhere you import either base or defaults