compass 0.10.0.rc4 → 0.10.0.rc5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/VERSION.yml +1 -1
- data/examples/css3/extensions/fancy-fonts/templates/project/Prociono.otf +0 -0
- data/examples/css3/extensions/fancy-fonts/templates/project/bgrove.otf +0 -0
- data/examples/css3/extensions/fancy-fonts/templates/project/bgrove.ttf +0 -0
- data/examples/css3/extensions/fancy-fonts/templates/project/fancy-fonts.sass +7 -4
- data/examples/css3/extensions/fancy-fonts/templates/project/manifest.rb +5 -4
- data/examples/css3/gradients.html.haml +8 -0
- data/examples/css3/images/button_bg.png +0 -0
- data/examples/css3/images/example.png +0 -0
- data/examples/css3/src/fancy-fonts.scss +9 -3
- data/examples/css3/src/gradients.scss +35 -26
- data/examples/css3/src/main.scss +3 -3
- data/features/command_line.feature +4 -3
- data/frameworks/compass/stylesheets/compass/_reset.scss +1 -1
- data/frameworks/compass/stylesheets/compass/css3/_background-clip.scss +12 -12
- data/frameworks/compass/stylesheets/compass/css3/_background-origin.scss +12 -12
- data/frameworks/compass/stylesheets/compass/css3/_background-size.scss +1 -1
- data/frameworks/compass/stylesheets/compass/css3/_border-radius.scss +12 -12
- data/frameworks/compass/stylesheets/compass/css3/_box-shadow.scss +6 -2
- data/frameworks/compass/stylesheets/compass/css3/_box-sizing.scss +3 -1
- data/frameworks/compass/stylesheets/compass/css3/_box.scss +27 -9
- data/frameworks/compass/stylesheets/compass/css3/_columns.scss +33 -7
- data/frameworks/compass/stylesheets/compass/css3/_gradient.scss +25 -7
- data/frameworks/compass/stylesheets/compass/css3/_opacity.scss +18 -8
- data/frameworks/compass/stylesheets/compass/css3/_shared.scss +14 -14
- data/frameworks/compass/stylesheets/compass/css3/_text-shadow.scss +12 -13
- data/frameworks/compass/stylesheets/compass/css3/_transform.scss +6 -2
- data/frameworks/compass/stylesheets/compass/css3/_transition.scss +12 -4
- data/frameworks/compass/stylesheets/compass/reset/_utilities.scss +133 -0
- data/frameworks/compass/stylesheets/compass/utilities/_text.scss +1 -0
- data/frameworks/compass/stylesheets/compass/utilities/general/_reset.scss +2 -122
- data/frameworks/compass/stylesheets/compass/utilities/lists/_bullets.scss +1 -1
- data/frameworks/compass/stylesheets/compass/utilities/tables/_alternating-rows-and-columns.scss +4 -4
- data/frameworks/compass/stylesheets/compass/utilities/text/_ellipsis.scss +22 -9
- data/frameworks/compass/stylesheets/compass/utilities/text/_nowrap.scss +1 -2
- data/frameworks/compass/stylesheets/compass/utilities/text/_replacement.scss +19 -8
- data/frameworks/compass/templates/ellipsis/ellipsis.sass +3 -0
- data/lib/compass.rb +0 -7
- data/lib/compass/app_integration/rails/configuration_defaults.rb +1 -1
- data/lib/compass/app_integration/rails/templates/compass-install-rails.rb +10 -26
- data/lib/compass/commands/help.rb +1 -1
- data/lib/compass/commands/project_base.rb +1 -0
- data/lib/compass/commands/update_project.rb +5 -2
- data/lib/compass/commands/watch_project.rb +1 -0
- data/lib/compass/sass_extensions/functions/display.rb +2 -1
- data/lib/compass/sass_extensions/functions/gradient_support.rb +11 -0
- data/lib/compass/version.rb +9 -0
- data/test/fixtures/stylesheets/compass/css/reset.css +0 -4
- metadata +11 -8
- data/examples/css3/extensions/fancy-fonts/templates/project/Vtks Revolt.ttf +0 -0
- data/examples/css3/extensions/fancy-fonts/templates/project/angelina.ttf +0 -0
- data/examples/css3/images/fresh-peas.jpg +0 -0
@@ -1,122 +1,2 @@
|
|
1
|
-
//
|
2
|
-
|
3
|
-
// Global reset rules.
|
4
|
-
// For more specific resets, use the reset mixins provided below
|
5
|
-
@mixin global-reset {
|
6
|
-
html, body, div, span, applet, object, iframe,
|
7
|
-
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
8
|
-
a, abbr, acronym, address, big, cite, code,
|
9
|
-
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
10
|
-
small, strike, strong, sub, sup, tt, var,
|
11
|
-
dl, dt, dd, ol, ul, li,
|
12
|
-
fieldset, form, label, legend,
|
13
|
-
table, caption, tbody, tfoot, thead, tr, th, td {
|
14
|
-
@include reset-box-model;
|
15
|
-
@include reset-font; }
|
16
|
-
*:focus {
|
17
|
-
@include reset-focus; }
|
18
|
-
body {
|
19
|
-
@include reset-body; }
|
20
|
-
ol, ul {
|
21
|
-
@include reset-list-style; }
|
22
|
-
/* tables still need 'cellspacing="0"' in the markup */
|
23
|
-
table {
|
24
|
-
@include reset-table; }
|
25
|
-
caption, th, td {
|
26
|
-
@include reset-table-cell; }
|
27
|
-
q, blockquote {
|
28
|
-
@include reset-quotation; }
|
29
|
-
a img {
|
30
|
-
@include reset-image-anchor-border; } }
|
31
|
-
|
32
|
-
// Reset all elements within some selector scope.To reset the selector itself,
|
33
|
-
// mixin the appropriate reset mixin for that element type as well. This could be
|
34
|
-
// useful if you want to style a part of your page in a dramatically different way.
|
35
|
-
@mixin nested-reset {
|
36
|
-
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
|
37
|
-
pre, a, abbr, acronym, address, code, del, dfn, em, img,
|
38
|
-
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr {
|
39
|
-
@include reset-box-model;
|
40
|
-
@include reset-font; }
|
41
|
-
/* tables still need 'cellspacing="0"' in the markup */
|
42
|
-
table {
|
43
|
-
@include reset-table; }
|
44
|
-
caption, th, td {
|
45
|
-
@include reset-table-cell; }
|
46
|
-
q, blockquote {
|
47
|
-
@include reset-quotation; }
|
48
|
-
a img {
|
49
|
-
@include reset-image-anchor-border; } }
|
50
|
-
|
51
|
-
//Mixins partials
|
52
|
-
@mixin reset-box-model {
|
53
|
-
margin: 0;
|
54
|
-
padding: 0;
|
55
|
-
border: 0;
|
56
|
-
outline: 0; }
|
57
|
-
|
58
|
-
@mixin reset-font {
|
59
|
-
font: {
|
60
|
-
weight: inherit;
|
61
|
-
style: inherit;
|
62
|
-
size: 100%;
|
63
|
-
family: inherit; };
|
64
|
-
vertical-align: baseline; }
|
65
|
-
|
66
|
-
@mixin reset-focus {
|
67
|
-
outline: 0; }
|
68
|
-
|
69
|
-
@mixin reset-body {
|
70
|
-
line-height: 1;
|
71
|
-
color: black;
|
72
|
-
background: white; }
|
73
|
-
|
74
|
-
@mixin reset-list-style {
|
75
|
-
list-style: none; }
|
76
|
-
|
77
|
-
@mixin reset-table {
|
78
|
-
border-collapse: separate;
|
79
|
-
border-spacing: 0;
|
80
|
-
vertical-align: middle; }
|
81
|
-
|
82
|
-
@mixin reset-table-cell {
|
83
|
-
text-align: left;
|
84
|
-
font-weight: normal;
|
85
|
-
vertical-align: middle; }
|
86
|
-
|
87
|
-
@mixin reset-quotation {
|
88
|
-
quotes: "" "";
|
89
|
-
&:before, &:after {
|
90
|
-
content: ""; } }
|
91
|
-
|
92
|
-
@mixin reset-image-anchor-border {
|
93
|
-
border: none; }
|
94
|
-
|
95
|
-
@mixin reset-html5 {
|
96
|
-
section, article, aside, header, footer, nav, dialog, figure {
|
97
|
-
display: block; } }
|
98
|
-
|
99
|
-
//**
|
100
|
-
// Resets the display of inline and block elements to their default display
|
101
|
-
// according to their tag type. Elements that have a default display that varies across
|
102
|
-
// versions of html or browser are not handled here, but this covers the 90% use case.
|
103
|
-
// Usage Example:
|
104
|
-
// // Turn off the display for both of these classes
|
105
|
-
// .unregistered-only, .registered-only
|
106
|
-
// display: none
|
107
|
-
// // Now turn only one of them back on depending on some other context.
|
108
|
-
// body.registered
|
109
|
-
// +reset-display(".registered-only")
|
110
|
-
// body.unregistered
|
111
|
-
// +reset-display(".unregistered-only")
|
112
|
-
@mixin reset-display($selector: "", $important: false) {
|
113
|
-
#{append-selector(elements-of-type("inline"), $selector)} {
|
114
|
-
@if $important {
|
115
|
-
display: inline !important; }
|
116
|
-
@else {
|
117
|
-
display: inline; } }
|
118
|
-
#{append-selector(elements-of-type("block"), $selector)} {
|
119
|
-
@if $important {
|
120
|
-
display: block !important; }
|
121
|
-
@else {
|
122
|
-
display: block; } } }
|
1
|
+
// This module has moved.
|
2
|
+
@import "compass/reset/utilities";
|
@@ -28,7 +28,7 @@
|
|
28
28
|
margin-left: 0;
|
29
29
|
li {
|
30
30
|
padding-left: $padding;
|
31
|
-
background: image-url($bullet-icon) no-repeat
|
31
|
+
background: image-url($bullet-icon) no-repeat ($padding - $width) / 2 ($line-height - $height) / 2;
|
32
32
|
list-style-type: none;
|
33
33
|
}
|
34
34
|
}
|
data/frameworks/compass/stylesheets/compass/utilities/tables/_alternating-rows-and-columns.scss
CHANGED
@@ -1,20 +1,20 @@
|
|
1
1
|
@mixin alternating-rows-and-columns($even-row-color, $odd-row-color, $dark-intersection, $header-color: white, $footer-color: white) {
|
2
2
|
th {
|
3
3
|
background-color: $header-color;
|
4
|
-
&.even {
|
4
|
+
&.even, &:nth-child(2n) {
|
5
5
|
background-color: $header-color - $dark-intersection; } }
|
6
6
|
tr.odd {
|
7
7
|
td {
|
8
8
|
background-color: $odd-row-color;
|
9
|
-
&.even {
|
9
|
+
&.even, &:nth-child(2n) {
|
10
10
|
background-color: $odd-row-color - $dark-intersection; } } }
|
11
11
|
tr.even {
|
12
12
|
td {
|
13
13
|
background-color: $even-row-color;
|
14
|
-
&.even {
|
14
|
+
&.even, &:nth-child(2n) {
|
15
15
|
background-color: $even-row-color - $dark-intersection; } } }
|
16
16
|
tfoot {
|
17
17
|
th, td {
|
18
18
|
background-color: $footer-color;
|
19
|
-
&.even {
|
19
|
+
&.even, &:nth-child(2n) {
|
20
20
|
background-color: $footer-color - $dark-intersection; } } } }
|
@@ -1,12 +1,25 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
//
|
1
|
+
@import "compass/css3/shared";
|
2
|
+
|
3
|
+
// To get firefox2 support, you must install the ellipsis pattern:
|
4
|
+
//
|
5
|
+
// compass install compass/ellipsis
|
6
|
+
$firefox2-ellipsis: false !default;
|
4
7
|
|
8
|
+
// This technique, by [Justin Maxwell](http://code404.com/), was originally
|
9
|
+
// published [here](http://mattsnider.com/css/css-string-truncation-with-ellipsis/).
|
10
|
+
// Firefox implementation by [Rikkert Koppes](http://www.rikkertkoppes.com/thoughts/2008/6/).
|
5
11
|
@mixin ellipsis($no-wrap: true) {
|
6
|
-
@if $no-wrap {
|
7
|
-
white-space: nowrap; }
|
12
|
+
@if $no-wrap { white-space: nowrap; }
|
8
13
|
overflow: hidden;
|
9
|
-
text-overflow
|
10
|
-
|
11
|
-
|
12
|
-
|
14
|
+
@include experimental(text-overflow, ellipsis,
|
15
|
+
not -moz,
|
16
|
+
not -webkit,
|
17
|
+
-o,
|
18
|
+
-ms,
|
19
|
+
not -khtml,
|
20
|
+
official
|
21
|
+
);
|
22
|
+
@if $experimental-support-for-mozilla and $firefox2-ellipsis {
|
23
|
+
-moz-binding: stylesheet-url(unquote("xml/ellipsis.xml#ellipsis"));
|
24
|
+
}
|
25
|
+
}
|
@@ -1,21 +1,32 @@
|
|
1
1
|
// Hides html text and replaces it with an image.
|
2
2
|
// If you use this on an inline element, you will need to change the display to block or inline-block.
|
3
3
|
// Also, if the size of the image differs significantly from the font size, you'll need to set the width and/or height.
|
4
|
-
//
|
5
|
-
//
|
6
|
-
//
|
7
|
-
//
|
8
|
-
//
|
9
|
-
//
|
4
|
+
//
|
5
|
+
// Parameters:
|
6
|
+
//
|
7
|
+
// * `img` -- the relative path from the project image directory to the image.
|
8
|
+
// * `x` -- the x position of the background image.
|
9
|
+
// * `y` -- the y position of the background image.
|
10
10
|
@mixin replace-text($img, $x: 50%, $y: 50%) {
|
11
11
|
@include hide-text;
|
12
12
|
background: {
|
13
13
|
image: image-url($img);
|
14
14
|
repeat: no-repeat;
|
15
|
-
position: $x $y;
|
15
|
+
position: $x $y;
|
16
|
+
};
|
17
|
+
}
|
18
|
+
|
19
|
+
// Like the `replace-text` mixin, but also sets the width
|
20
|
+
// and height of the element according the dimensions of the image.
|
21
|
+
@mixin replace-text-with-dimensions($img, $x: 50%, $y: 50%) {
|
22
|
+
@include replace-text($img, $x, $y);
|
23
|
+
width: image-width($img);
|
24
|
+
height: image-height($img);
|
25
|
+
}
|
16
26
|
|
17
27
|
// Hides text in an element so you can see the background.
|
18
28
|
@mixin hide-text {
|
19
29
|
text-indent: -9999em;
|
20
30
|
overflow: hidden;
|
21
|
-
text-align: left;
|
31
|
+
text-align: left;
|
32
|
+
}
|
@@ -1,3 +1,6 @@
|
|
1
|
+
// Since you've installed the xml file, you must set
|
2
|
+
// $firefox2-ellipsis to true before importing.
|
3
|
+
$firefox2-ellipsis: true
|
1
4
|
@import compass/utilities/text/ellipsis
|
2
5
|
|
3
6
|
// You can delete this sass file if you want, it's just an example of how to use the ellipsis mixin.
|
data/lib/compass.rb
CHANGED
@@ -6,13 +6,6 @@ end
|
|
6
6
|
end
|
7
7
|
|
8
8
|
module Compass
|
9
|
-
extend Compass::Version
|
10
|
-
def self.const_missing(const)
|
11
|
-
# This avoid reading from disk unless the VERSION is requested.
|
12
|
-
if const == :VERSION
|
13
|
-
version[:string]
|
14
|
-
end
|
15
|
-
end
|
16
9
|
def base_directory
|
17
10
|
File.expand_path(File.join(File.dirname(__FILE__), '..'))
|
18
11
|
end
|
@@ -43,8 +43,7 @@ puts "==================================================="
|
|
43
43
|
puts
|
44
44
|
|
45
45
|
# css framework prompt
|
46
|
-
css_framework = ask("What CSS Framework do you want to use with Compass?
|
47
|
-
css_framework = "blueprint" if css_framework.blank?
|
46
|
+
css_framework = ask("What CSS Framework install do you want to use with Compass?")
|
48
47
|
|
49
48
|
# sass storage prompt
|
50
49
|
sass_dir = ask("Where would you like to keep your sass files within your project? (default: 'app/stylesheets')")
|
@@ -55,40 +54,25 @@ css_dir = ask("Where would you like Compass to store your compiled css files? (d
|
|
55
54
|
css_dir = "public/stylesheets/compiled" if css_dir.blank?
|
56
55
|
|
57
56
|
# use sudo for gem commands?
|
58
|
-
use_sudo =
|
57
|
+
use_sudo = nil
|
59
58
|
if sudo_is_an_option? # dont give them the option if they are on a system that can't use sudo (aka windows)
|
60
59
|
use_sudo = yes?("Use sudo for the gem commands? (the default for your system is #{sudo_is_an_option? ? 'yes' : 'no'})")
|
61
60
|
end
|
61
|
+
use_sudo = sudo_is_an_option? if use_sudo.blank?
|
62
62
|
|
63
63
|
# define dependencies
|
64
|
-
gem "haml", :version => ">=
|
65
|
-
gem "compass", :version => ">= 0.
|
64
|
+
gem "haml", :version => ">=3.0.0.rc.3"
|
65
|
+
gem "compass", :version => ">= 0.10.0.rc4"
|
66
66
|
|
67
67
|
# install and unpack
|
68
|
-
rake "gems:install GEM=haml", :sudo => use_sudo
|
69
|
-
rake "gems:install GEM=compass", :sudo => use_sudo
|
70
|
-
rake "gems:unpack GEM=compass"
|
71
|
-
|
72
|
-
# load any compass framework plugins
|
73
|
-
if css_framework =~ /960/
|
74
|
-
gem "compass-960-plugin", :lib => "ninesixty"
|
75
|
-
rake "gems:install GEM=compass-960-plugin", :sudo => use_sudo
|
76
|
-
css_framework = "960" # rename for command
|
77
|
-
plugin_require = "-r ninesixty"
|
78
|
-
end
|
68
|
+
rake "gems:install GEM=haml --trace", :sudo => use_sudo
|
69
|
+
rake "gems:install GEM=compass --trace", :sudo => use_sudo
|
70
|
+
rake "gems:unpack GEM=compass --trace"
|
79
71
|
|
80
72
|
# build out compass command
|
81
|
-
compass_command = "compass
|
82
|
-
compass_command <<
|
83
|
-
|
84
|
-
# Require compass during plugin loading
|
85
|
-
file 'vendor/plugins/compass/init.rb', <<-CODE
|
86
|
-
# This is here to make sure that the right version of sass gets loaded (haml 2.2) by the compass requires.
|
87
|
-
require 'compass'
|
88
|
-
CODE
|
73
|
+
compass_command = "compass init rails . --css-dir=#{css_dir} --sass-dir=#{sass_dir} "
|
74
|
+
compass_command << "--using #{css_framework} " unless css_framework.blank?
|
89
75
|
|
90
76
|
# integrate it!
|
91
77
|
run "haml --rails ."
|
92
78
|
run compass_command
|
93
|
-
|
94
|
-
puts "Compass (with #{css_framework}) is all setup, have fun!"
|
@@ -29,12 +29,15 @@ module Compass
|
|
29
29
|
|
30
30
|
def perform
|
31
31
|
compiler = new_compiler_instance
|
32
|
+
check_for_sass_files!(compiler)
|
33
|
+
compiler.run
|
34
|
+
end
|
35
|
+
|
36
|
+
def check_for_sass_files!(compiler)
|
32
37
|
if compiler.sass_files.empty? && !dry_run?
|
33
38
|
message = "Nothing to compile. If you're trying to start a new project, you have left off the directory argument.\n"
|
34
39
|
message << "Run \"compass -h\" to get help."
|
35
40
|
raise Compass::Error, message
|
36
|
-
else
|
37
|
-
compiler.run
|
38
41
|
end
|
39
42
|
end
|
40
43
|
|
@@ -15,7 +15,8 @@ module Compass::SassExtensions::Functions::Display
|
|
15
15
|
:"table-cell" => %w{th td}
|
16
16
|
}
|
17
17
|
|
18
|
-
# returns a comma delimited string for all the
|
18
|
+
# returns a comma delimited string for all the
|
19
|
+
# elements according to their default css3 display value.
|
19
20
|
def elements_of_type(display)
|
20
21
|
Sass::Script::String.new(DEFAULT_DISPLAY.fetch(display.value.to_sym).join(", "))
|
21
22
|
end
|
@@ -57,12 +57,19 @@ module Compass::SassExtensions::Functions::GradientSupport
|
|
57
57
|
assert_list(color_list)
|
58
58
|
normalize_stops!(color_list)
|
59
59
|
max = color_list.values.last.stop
|
60
|
+
last_value = nil
|
60
61
|
color_stops = color_list.values.map do |pos|
|
61
62
|
# have to convert absolute units to percentages for use in color stop functions.
|
62
63
|
stop = pos.stop
|
63
64
|
stop = stop.div(max).times(Sass::Script::Number.new(100,["%"])) if stop.numerator_units == max.numerator_units
|
65
|
+
# Make sure the color stops are specified in the right order.
|
66
|
+
if last_value && last_value.value > stop.value
|
67
|
+
raise Sass::SyntaxError.new("Color stops must be specified in increasing order")
|
68
|
+
end
|
69
|
+
last_value = stop
|
64
70
|
"color-stop(#{stop.inspect}, #{pos.color.inspect})"
|
65
71
|
end
|
72
|
+
|
66
73
|
Sass::Script::String.new(color_stops.join(", "))
|
67
74
|
end
|
68
75
|
|
@@ -185,6 +192,10 @@ module Compass::SassExtensions::Functions::GradientSupport
|
|
185
192
|
pos.stop = pos.stop.times(Sass::Script::Number.new(1, ["px"]))
|
186
193
|
end
|
187
194
|
end
|
195
|
+
if (positions.last.stop.eq(Sass::Script::Number.new(0, ["px"])).to_bool ||
|
196
|
+
positions.last.stop.eq(Sass::Script::Number.new(0, ["%"])).to_bool)
|
197
|
+
raise Sass::SyntaxError.new("Color stops must be specified in increasing order")
|
198
|
+
end
|
188
199
|
nil
|
189
200
|
end
|
190
201
|
def assert_list(value)
|
data/lib/compass/version.rb
CHANGED
@@ -16,9 +16,6 @@ table, caption, tbody, tfoot, thead, tr, th, td {
|
|
16
16
|
font-family: inherit;
|
17
17
|
vertical-align: baseline; }
|
18
18
|
|
19
|
-
*:focus {
|
20
|
-
outline: 0; }
|
21
|
-
|
22
19
|
body {
|
23
20
|
line-height: 1;
|
24
21
|
color: black;
|
@@ -27,7 +24,6 @@ body {
|
|
27
24
|
ol, ul {
|
28
25
|
list-style: none; }
|
29
26
|
|
30
|
-
/* tables still need 'cellspacing="0"' in the markup */
|
31
27
|
table {
|
32
28
|
border-collapse: separate;
|
33
29
|
border-spacing: 0;
|