susy 2.0.0.alpha.4 → 2.0.0.alpha.5
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -7
- data/README.md +2 -0
- data/VERSION +1 -0
- data/lib/compass-susy.rb +1 -0
- data/lib/susy.rb +12 -4
- data/sass/susy/_helpers.scss +2 -0
- data/sass/susy/_settings.scss +7 -20
- data/sass/susy/api/_float.scss +2 -0
- data/sass/susy/api/float/_container.scss +4 -6
- data/sass/susy/api/float/_end.scss +7 -11
- data/sass/susy/api/float/_isolate.scss +1 -1
- data/sass/susy/api/float/_span.scss +2 -8
- data/sass/susy/api/shared/_background.scss +24 -36
- data/sass/susy/api/shared/_container.scss +7 -13
- data/sass/susy/api/shared/_margins.scss +1 -1
- data/sass/susy/api/shared/_padding.scss +1 -1
- data/sass/susy/helpers/_box-sizing.scss +16 -0
- data/sass/susy/helpers/_clearfix.scss +15 -0
- data/sass/susy/helpers/_direction.scss +7 -10
- data/sass/susy/helpers/_nth.scss +2 -6
- data/sass/susy/language/_shared.scss +0 -1
- data/sass/susy/language/_susy.scss +4 -1
- data/sass/susy/language/shared/_settings.scss +55 -249
- data/sass/susy/language/susy/_background.scss +304 -90
- data/sass/susy/language/susy/_bleed.scss +109 -0
- data/sass/susy/language/susy/_container.scss +21 -40
- data/sass/susy/language/susy/_context.scss +34 -0
- data/sass/susy/language/susy/_gallery.scss +53 -39
- data/sass/susy/language/susy/_gutters.scss +105 -83
- data/sass/susy/language/susy/_isolate.scss +24 -31
- data/sass/susy/language/susy/_margins.scss +17 -71
- data/sass/susy/language/susy/_padding.scss +13 -29
- data/sass/susy/language/susy/_rows.scss +61 -33
- data/sass/susy/language/susy/_settings.scss +41 -0
- data/sass/susy/language/susy/_span.scss +125 -278
- data/sass/susy/math/_columns.scss +25 -50
- data/sass/susy/math/_container.scss +12 -27
- data/sass/susy/math/_location.scss +10 -22
- data/templates/project/README.md +3 -3
- metadata +44 -176
- data/docs/BUGS.md +0 -2
- data/docs/Gemfile.lock +0 -142
- data/docs/README.md +0 -54
- data/docs/config.rb +0 -120
- data/docs/lib/guide_helpers.rb +0 -19
- data/docs/source/apple-touch-icon-114x114-precomposed.png +0 -0
- data/docs/source/apple-touch-icon-144x144-precomposed.png +0 -0
- data/docs/source/apple-touch-icon-72x72-precomposed.png +0 -0
- data/docs/source/apple-touch-icon-precomposed.png +0 -0
- data/docs/source/demos/grid-types.html.md +0 -263
- data/docs/source/demos/index.html.md +0 -23
- data/docs/source/demos/magic.html.md +0 -320
- data/docs/source/favicon.ico +0 -0
- data/docs/source/fonts/@Font-Face License.txt +0 -18
- data/docs/source/fonts/Baskerville-amp-webfont.eot +0 -0
- data/docs/source/fonts/Baskerville-amp-webfont.svg +0 -241
- data/docs/source/fonts/Baskerville-amp-webfont.ttf +0 -0
- data/docs/source/fonts/Baskerville-amp-webfont.woff +0 -0
- data/docs/source/fonts/CenturyOldStyle-Bold-webfont.eot +0 -0
- data/docs/source/fonts/CenturyOldStyle-Bold-webfont.svg +0 -240
- data/docs/source/fonts/CenturyOldStyle-Bold-webfont.ttf +0 -0
- data/docs/source/fonts/CenturyOldStyle-Bold-webfont.woff +0 -0
- data/docs/source/fonts/CenturyOldStyle-Italic-webfont.eot +0 -0
- data/docs/source/fonts/CenturyOldStyle-Italic-webfont.svg +0 -240
- data/docs/source/fonts/CenturyOldStyle-Italic-webfont.ttf +0 -0
- data/docs/source/fonts/CenturyOldStyle-Italic-webfont.woff +0 -0
- data/docs/source/fonts/CenturyOldStyle-Regular-webfont.eot +0 -0
- data/docs/source/fonts/CenturyOldStyle-Regular-webfont.svg +0 -240
- data/docs/source/fonts/CenturyOldStyle-Regular-webfont.ttf +0 -0
- data/docs/source/fonts/CenturyOldStyle-Regular-webfont.woff +0 -0
- data/docs/source/fonts/CenturyOldStyleCaps-Regular-webfont.eot +0 -0
- data/docs/source/fonts/CenturyOldStyleCaps-Regular-webfont.svg +0 -240
- data/docs/source/fonts/CenturyOldStyleCaps-Regular-webfont.ttf +0 -0
- data/docs/source/fonts/CenturyOldStyleCaps-Regular-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-Book-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-Book-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-Book-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-Book-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-BookIt-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-BookIt-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-BookIt-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-BookIt-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-Cd-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-Cd-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-Cd-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-Cd-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-CdIt-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-CdIt-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-CdIt-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-CdIt-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-Med-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-Med-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-Med-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-Med-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-MedCd-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-MedCd-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-MedCd-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-MedCd-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-MedCdIt-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-MedCdIt-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-MedCdIt-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-MedCdIt-webfont.woff +0 -0
- data/docs/source/fonts/FranklinGothic-MedIt-webfont.eot +0 -0
- data/docs/source/fonts/FranklinGothic-MedIt-webfont.svg +0 -240
- data/docs/source/fonts/FranklinGothic-MedIt-webfont.ttf +0 -0
- data/docs/source/fonts/FranklinGothic-MedIt-webfont.woff +0 -0
- data/docs/source/fonts/License.txt +0 -77
- data/docs/source/fonts/susy.eot +0 -0
- data/docs/source/fonts/susy.svg +0 -69
- data/docs/source/fonts/susy.ttf +0 -0
- data/docs/source/fonts/susy.woff +0 -0
- data/docs/source/guides/getting-started.html.md +0 -277
- data/docs/source/guides/reference.html.md +0 -658
- data/docs/source/guides/upgrade-1-0.html.md +0 -286
- data/docs/source/humans.txt +0 -45
- data/docs/source/images/splash-iphone.png +0 -0
- data/docs/source/images/splash-iphone4.png +0 -0
- data/docs/source/images/splash-landscape.png +0 -0
- data/docs/source/images/splash-portrait.png +0 -0
- data/docs/source/index.html.md +0 -87
- data/docs/source/javascripts/jquery-1.7.1.min.js +0 -4
- data/docs/source/javascripts/jqwidont.js +0 -5
- data/docs/source/javascripts/modernizr-2.5.3.min.js +0 -4
- data/docs/source/javascripts/modernizr.selectors.js +0 -55
- data/docs/source/javascripts/viewport.js +0 -9
- data/docs/source/layouts/grid-types.haml +0 -22
- data/docs/source/layouts/layout.haml +0 -34
- data/docs/source/layouts/magic.haml +0 -28
- data/docs/source/partials/_contentinfo.haml +0 -47
- data/docs/source/partials/_demonav.haml +0 -2
- data/docs/source/partials/_google_analytics.haml +0 -5
- data/docs/source/partials/_head.haml +0 -22
- data/docs/source/partials/_javascripts.haml +0 -4
- data/docs/source/partials/_navigation.haml +0 -15
- data/docs/source/sites-using-susy.html.md +0 -29
- data/docs/source/stylesheets/_base/_base.scss +0 -23
- data/docs/source/stylesheets/_base/_colors.scss +0 -47
- data/docs/source/stylesheets/_base/_size.scss +0 -49
- data/docs/source/stylesheets/_base/_type.scss +0 -19
- data/docs/source/stylesheets/_demos/_demo.scss +0 -28
- data/docs/source/stylesheets/_demos/magic/_layout.scss +0 -39
- data/docs/source/stylesheets/_demos/magic/_style.scss +0 -104
- data/docs/source/stylesheets/_demos/types/_layouts.scss +0 -88
- data/docs/source/stylesheets/_demos/types/_template.scss +0 -57
- data/docs/source/stylesheets/_general/_century-oldstyle.scss +0 -70
- data/docs/source/stylesheets/_general/_font-license.scss +0 -23
- data/docs/source/stylesheets/_general/_fonts.scss +0 -26
- data/docs/source/stylesheets/_general/_franklin-gothic.scss +0 -112
- data/docs/source/stylesheets/_general/_icons.scss +0 -86
- data/docs/source/stylesheets/_general/_root.scss +0 -79
- data/docs/source/stylesheets/_general/_type.scss +0 -114
- data/docs/source/stylesheets/_layout.scss +0 -48
- data/docs/source/stylesheets/_modules/_ag-test.scss +0 -59
- data/docs/source/stylesheets/_modules/_banner.scss +0 -61
- data/docs/source/stylesheets/_modules/_contentinfo.scss +0 -41
- data/docs/source/stylesheets/_modules/_intro.scss +0 -53
- data/docs/source/stylesheets/_modules/_nav.scss +0 -44
- data/docs/source/stylesheets/_modules/_pages.scss +0 -5
- data/docs/source/stylesheets/_modules/_secondary.scss +0 -22
- data/docs/source/stylesheets/_modules/_toggle.scss +0 -40
- data/docs/source/stylesheets/_vendor/pygments/solarized.scss +0 -65
- data/docs/source/stylesheets/grid-types.css.scss +0 -6
- data/docs/source/stylesheets/magic.css.scss +0 -6
- data/docs/source/stylesheets/site.css.scss +0 -27
- data/sass/susy/language/_susy1.scss +0 -9
- data/sass/susy/language/shared/_context.scss +0 -36
- data/sass/susy/language/susy1/_settings.scss +0 -50
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
|
-
---
|
2
|
-
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
5
|
-
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: e517f778e7f713696b11510f0a423df0e9a063f9
|
4
|
+
data.tar.gz: e914949051598b83a963cd9ffea85270b3afab05
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 144fcea1e2eb1b17bc1903c741f7b7824e412f6f99218a0da4614f7c5913d50da46abb821bf48624faf4baed70bddcc1e076ee8c77a84971739dcb9c13b3d506
|
7
|
+
data.tar.gz: e4e421fc81b114835a68e5003fc69c72529cac96140fdfa9fad74a71443e12340d802796449cdb68ec1ba30261108bf35049a44452ea5f38cdb0825c66e353ef
|
data/README.md
CHANGED
data/VERSION
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
2.0.0.alpha.4
|
data/lib/compass-susy.rb
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
require 'susy'
|
data/lib/susy.rb
CHANGED
@@ -1,4 +1,12 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
1
|
+
susy_stylesheets_path = File.expand_path(File.join(File.dirname(__FILE__), '..', 'sass'))
|
2
|
+
begin
|
3
|
+
require 'compass'
|
4
|
+
Compass::Frameworks.register('susy', :stylesheets_directory => susy_stylesheets_path)
|
5
|
+
rescue LoadError
|
6
|
+
# compass not found, register on the Sass path via the environment.
|
7
|
+
if ENV.has_key?("SASSPATH")
|
8
|
+
ENV["SASSPATH"] = ENV["SASSPATH"] + File::PATH_SEPARATOR + susy_stylesheets_path
|
9
|
+
else
|
10
|
+
ENV["SASSPATH"] = susy_stylesheets_path
|
11
|
+
end
|
12
|
+
end
|
data/sass/susy/_helpers.scss
CHANGED
data/sass/susy/_settings.scss
CHANGED
@@ -1,23 +1,10 @@
|
|
1
1
|
// Settings
|
2
2
|
// ========
|
3
3
|
|
4
|
-
//
|
5
|
-
//
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
// ----------------------
|
12
|
-
// - Set EITHER $column-width OR $container
|
13
|
-
// - Use $column-width for static layouts
|
14
|
-
// - We can determine one from the other, but we can't resolve conflicts
|
15
|
-
|
16
|
-
$column-width : false !default;
|
17
|
-
$container : auto !default;
|
18
|
-
|
19
|
-
// Last Flow
|
20
|
-
// ---------
|
21
|
-
// - Last/Omega float-direction, relative to the document flow
|
22
|
-
// from | to
|
23
|
-
$last-flow : to !default;
|
4
|
+
// Default Settings
|
5
|
+
// ----------------
|
6
|
+
$susy-defaults: (
|
7
|
+
columns: 4,
|
8
|
+
gutters: .25,
|
9
|
+
column-width: false,
|
10
|
+
);
|
data/sass/susy/api/_float.scss
CHANGED
@@ -1,18 +1,16 @@
|
|
1
1
|
// Float Container API
|
2
2
|
// ===================
|
3
3
|
|
4
|
-
@import "compass/utilities/general/clearfix";
|
5
|
-
|
6
4
|
// Float Container
|
7
5
|
// ---------------
|
8
6
|
// - [$width] : <length>
|
9
7
|
// - [$justify] : left | center | right
|
10
8
|
// - [$layout-math] : fluid | static
|
11
9
|
@mixin float-container(
|
12
|
-
$width :
|
13
|
-
$justify :
|
14
|
-
$layout-math :
|
10
|
+
$width : susy-get(container),
|
11
|
+
$justify : susy-get(container-position),
|
12
|
+
$layout-math : susy-get(layout-math)
|
15
13
|
) {
|
16
|
-
@include
|
14
|
+
@include susy-clearfix;
|
17
15
|
@include container-output($width, $justify, $layout-math);
|
18
16
|
}
|
@@ -5,25 +5,21 @@
|
|
5
5
|
// ----------
|
6
6
|
// - [$flow] : ltr | rtl
|
7
7
|
@mixin float-last(
|
8
|
-
$flow:
|
9
|
-
$last-flow:
|
8
|
+
$flow: susy-get(flow),
|
9
|
+
$last-flow: susy-get(last-flow),
|
10
|
+
$margin: 0
|
10
11
|
) {
|
11
12
|
$to: to($flow);
|
12
13
|
|
13
|
-
|
14
|
-
|
15
|
-
}
|
16
|
-
|
17
|
-
margin-#{$to}: 0;
|
14
|
+
float: if($last-flow == to, $to, null);
|
15
|
+
margin-#{$to}: $margin;
|
18
16
|
}
|
19
17
|
|
20
18
|
// Float First
|
21
19
|
// -----------
|
22
20
|
// - [$flow] : ltr | rtl
|
23
21
|
@mixin float-first(
|
24
|
-
$flow:
|
22
|
+
$flow: susy-get(flow)
|
25
23
|
) {
|
26
|
-
|
27
|
-
|
28
|
-
margin-#{$from}: 0;
|
24
|
+
margin-#{from($flow)}: 0;
|
29
25
|
}
|
@@ -17,19 +17,13 @@
|
|
17
17
|
$margin-after : null,
|
18
18
|
$padding-before : null,
|
19
19
|
$padding-after : null,
|
20
|
-
$flow :
|
20
|
+
$flow : susy-get(flow)
|
21
21
|
) {
|
22
22
|
$to : to($flow);
|
23
23
|
$from : from($flow);
|
24
24
|
|
25
|
-
@if $float {
|
26
|
-
$float: if($float == to, $to, $from);
|
27
|
-
} @else {
|
28
|
-
$float: null;
|
29
|
-
}
|
30
|
-
|
31
25
|
width: $width;
|
32
|
-
float: $float;
|
26
|
+
float: if($float == to, $to, null) or if($float == from, $from, null);
|
33
27
|
margin-#{$from}: $margin-before;
|
34
28
|
margin-#{$to}: $margin-after;
|
35
29
|
padding-#{$from}: $padding-before;
|
@@ -2,47 +2,35 @@
|
|
2
2
|
// ===================
|
3
3
|
// - Sub-pixel rounding can lead to several pixels variation between browsers.
|
4
4
|
|
5
|
-
@import "compass/layout/grid-background";
|
6
|
-
@import "compass/css3/images";
|
7
|
-
@import "compass/css3/background-size";
|
8
|
-
|
9
|
-
// Set the line height for your vertical rhythm.
|
10
|
-
$base-line-height : 24px !default;
|
11
|
-
|
12
5
|
// Grid Background Output
|
13
6
|
// ----------------------
|
14
|
-
// $
|
15
|
-
//
|
16
|
-
//
|
7
|
+
// - $image: background-image
|
8
|
+
// - $size: background-size
|
9
|
+
// - $clip: background-clip
|
10
|
+
// - [$flow]: ltr | rtl
|
17
11
|
@mixin background-grid-output (
|
18
|
-
$
|
19
|
-
$
|
20
|
-
$
|
21
|
-
$flow
|
12
|
+
$image,
|
13
|
+
$size: false,
|
14
|
+
$clip: false,
|
15
|
+
$flow: susy-get(flow)
|
22
16
|
) {
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
@if $show and $show != hide {
|
30
|
-
|
31
|
-
@if $show != show-columns {
|
32
|
-
$background: append($background, get-baseline-gradient(), comma);
|
33
|
-
}
|
34
|
-
|
35
|
-
@if $show != show-baseline {
|
36
|
-
$background: append($background, linear-gradient($from, $stops...), comma);
|
37
|
-
}
|
38
|
-
|
39
|
-
// output styles
|
40
|
-
@include background($background);
|
17
|
+
@if mixin-exists(background-image) {
|
18
|
+
@include background-image($image);
|
19
|
+
} @else {
|
20
|
+
background-image: $image;
|
21
|
+
}
|
41
22
|
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
23
|
+
@if $size {
|
24
|
+
-webkit-background-size: $size;
|
25
|
+
background-size: $size;
|
26
|
+
}
|
46
27
|
|
28
|
+
@if $clip {
|
29
|
+
-webkit-background-origin: $clip;
|
30
|
+
-webkit-background-clip: $clip;
|
31
|
+
background-origin: $clip;
|
32
|
+
background-clip: $clip;
|
47
33
|
}
|
34
|
+
|
35
|
+
background-position: from($flow) top;
|
48
36
|
}
|
@@ -7,20 +7,14 @@
|
|
7
7
|
// - [$justify] : left | center | right
|
8
8
|
// - [$layout-math] : fluid | static
|
9
9
|
@mixin container-output(
|
10
|
-
$width :
|
11
|
-
$justify :
|
12
|
-
$layout-math :
|
10
|
+
$width : susy-get(container),
|
11
|
+
$justify : susy-get(container-position),
|
12
|
+
$layout-math : susy-get(layout-math)
|
13
13
|
) {
|
14
|
-
$position : parse-container-position($justify);
|
15
14
|
$property : if($layout-math == static, width, max-width);
|
16
|
-
$
|
17
|
-
$right : nth($position,2);
|
15
|
+
$justify : parse-container-position($justify);
|
18
16
|
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
#{$property}: $width;
|
24
|
-
margin-left: $left;
|
25
|
-
margin-right: $right;
|
17
|
+
#{$property}: $width or 100%;
|
18
|
+
margin-left: nth($justify, 1);
|
19
|
+
margin-right: nth($justify, 2);
|
26
20
|
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
// Box Sizing
|
2
|
+
// ==========
|
3
|
+
// Susy is not in the business of handling css3 prefixed feature support.
|
4
|
+
// If you provide a mixin, we'll use yours, otherwise we provide basics.
|
5
|
+
// If you want more powerful support handling, we recommend compass-style.org
|
6
|
+
|
7
|
+
// Susy Box Sizing
|
8
|
+
// ---------------
|
9
|
+
// [$model]: content-box | border-box
|
10
|
+
@mixin susy-box-sizing(
|
11
|
+
$model: content-box
|
12
|
+
) {
|
13
|
+
-moz-box-sizing: $model;
|
14
|
+
-webkit-box-sizing: $model;
|
15
|
+
box-sizing: $model;
|
16
|
+
}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
// Susy Fallback Clearfix
|
2
|
+
// ======================
|
3
|
+
// If you provide a clearfix mixin, we'll use yours.
|
4
|
+
// If not, we'll provide the basics.
|
5
|
+
|
6
|
+
// Susy Clearfix
|
7
|
+
// -------------
|
8
|
+
@mixin susy-clearfix {
|
9
|
+
*zoom: 1;
|
10
|
+
&:after {
|
11
|
+
content : " ";
|
12
|
+
display : block;
|
13
|
+
clear : both;
|
14
|
+
}
|
15
|
+
}
|
@@ -7,14 +7,11 @@
|
|
7
7
|
// - [$flow] : ltr | rtl
|
8
8
|
// - [$key] : from | to
|
9
9
|
@function get-direction(
|
10
|
-
$flow:
|
10
|
+
$flow: susy-get(flow),
|
11
11
|
$key: from
|
12
12
|
) {
|
13
|
-
$
|
14
|
-
|
15
|
-
|
16
|
-
@if $key == from { @return $from; }
|
17
|
-
@else if $key == to { @return $to; }
|
13
|
+
$return: if($flow == rtl, (from: right, to: left), (from: left, to: right));
|
14
|
+
@return map-get($return, $key);
|
18
15
|
}
|
19
16
|
|
20
17
|
// To
|
@@ -22,9 +19,9 @@
|
|
22
19
|
// Return the 'to' direction of a flow
|
23
20
|
// - [$flow] : ltr | rtl
|
24
21
|
@function to(
|
25
|
-
$flow:
|
22
|
+
$flow: susy-get(flow)
|
26
23
|
) {
|
27
|
-
@return get-direction($flow,to);
|
24
|
+
@return get-direction($flow, to);
|
28
25
|
}
|
29
26
|
|
30
27
|
// From
|
@@ -32,7 +29,7 @@
|
|
32
29
|
// Return the 'from' direction of a flow
|
33
30
|
// - [$flow] : ltr | rtl
|
34
31
|
@function from(
|
35
|
-
$flow:
|
32
|
+
$flow: susy-get(flow)
|
36
33
|
) {
|
37
|
-
@return get-direction($flow,from);
|
34
|
+
@return get-direction($flow, from);
|
38
35
|
}
|
data/sass/susy/helpers/_nth.scss
CHANGED
@@ -10,10 +10,6 @@
|
|
10
10
|
$n : last,
|
11
11
|
$selector : child
|
12
12
|
) {
|
13
|
-
|
14
|
-
|
15
|
-
} @else {
|
16
|
-
$selector: 'nth-#{$selector}(#{$n})';
|
17
|
-
}
|
18
|
-
@return $selector;
|
13
|
+
$key: last first only;
|
14
|
+
@return if(index($key, $n), '#{$n}-#{$selector}', 'nth-#{$selector}(#{$n})');
|
19
15
|
}
|
@@ -2,10 +2,12 @@
|
|
2
2
|
// ================
|
3
3
|
|
4
4
|
@import "../core";
|
5
|
-
@import "../api/shared";
|
6
5
|
@import "../api/float";
|
7
6
|
|
8
7
|
@import "shared";
|
8
|
+
|
9
|
+
@import "susy/settings";
|
10
|
+
@import "susy/context";
|
9
11
|
@import "susy/background";
|
10
12
|
@import "susy/container";
|
11
13
|
@import "susy/span";
|
@@ -15,3 +17,4 @@
|
|
15
17
|
@import "susy/rows";
|
16
18
|
@import "susy/margins";
|
17
19
|
@import "susy/padding";
|
20
|
+
@import "susy/bleed";
|
@@ -1,107 +1,36 @@
|
|
1
1
|
// Grid Syntax
|
2
2
|
// ===========
|
3
3
|
|
4
|
-
// layout math
|
5
|
-
// - static | fluid
|
6
|
-
$layout-math : fluid !default;
|
7
|
-
|
8
|
-
// layout method
|
9
|
-
// - isolate | float
|
10
|
-
$layout-method : float !default;
|
11
|
-
|
12
|
-
// layout direction
|
13
|
-
// - ltr | rtl
|
14
|
-
$flow : ltr !default;
|
15
|
-
|
16
|
-
// box-sizing
|
17
|
-
// false | border-box | content-box
|
18
|
-
$box-sizing : false !default;
|
19
|
-
|
20
|
-
// container justification
|
21
|
-
// - left | center | right
|
22
|
-
$container-position : center !default;
|
23
|
-
|
24
|
-
// gutter handling
|
25
|
-
// - before | after | split | inside | inside-static | no-gutters
|
26
|
-
$gutter-position : after !default;
|
27
|
-
|
28
|
-
// show/hide grids
|
29
|
-
// show | show-columns | show-baseline | hide
|
30
|
-
$show-grids : show-columns !default;
|
31
|
-
|
32
4
|
// Set Grid
|
33
5
|
// --------
|
34
6
|
// Set a new grid using a shorthand
|
35
7
|
// - $grid : <settings>
|
36
|
-
// - [$clean] : true | false (resets container, column-width, & box-sizing)
|
37
8
|
@mixin set-grid(
|
38
|
-
$grid
|
39
|
-
$clean: false
|
9
|
+
$grid
|
40
10
|
) {
|
11
|
+
$susy: map-merge($susy, parse-grid($grid)) !global;
|
12
|
+
}
|
41
13
|
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
$container : get-setting(container, $grid);
|
48
|
-
$column-width : get-setting(column-width, $grid);
|
49
|
-
$layout-math : get-setting(layout-math, $grid);
|
50
|
-
$layout-method : get-setting(layout-method, $grid);
|
51
|
-
|
52
|
-
$flow : get-setting(flow, $grid);
|
53
|
-
$gutter-position : get-setting(gutter-position, $grid);
|
54
|
-
$container-position : get-setting(container-position, $grid);
|
55
|
-
$show-grids : get-setting(show-grids, $grid);
|
56
|
-
$box : get-setting(box-sizing, $grid);
|
57
|
-
|
58
|
-
$container : get-setting(container, $grid);
|
59
|
-
$column-width : get-setting(column-width, $grid);
|
60
|
-
$box-sizing : get-setting(box-sizing, $grid);
|
14
|
+
// Alternative syntax
|
15
|
+
@mixin susy-set(
|
16
|
+
$grid
|
17
|
+
) {
|
18
|
+
@include set-grid($grid);
|
61
19
|
}
|
62
20
|
|
63
21
|
// Use Grid
|
64
22
|
// --------
|
65
23
|
// Use an arbitrary grid for a section of code
|
66
24
|
// - $grid : <settings>
|
67
|
-
// - [$clean] : true | false (resets container, column-width, & box-sizing)
|
68
25
|
@mixin use-grid(
|
69
|
-
$grid
|
70
|
-
$clean: false
|
26
|
+
$grid
|
71
27
|
) {
|
72
|
-
$old
|
28
|
+
$old: $susy;
|
73
29
|
|
74
|
-
@include set-grid($grid
|
30
|
+
@include set-grid($grid);
|
75
31
|
@content;
|
76
|
-
@include set-grid($old-grid, $clean);
|
77
|
-
}
|
78
32
|
|
79
|
-
|
80
|
-
// --------
|
81
|
-
// Get the current grid settings as a shorthand list
|
82
|
-
@function get-grid(
|
83
|
-
) {
|
84
|
-
$new-gutters : $gutters;
|
85
|
-
$new-show-grids : false;
|
86
|
-
|
87
|
-
// Use units for column/gutter ratio if available
|
88
|
-
@if $column-width {
|
89
|
-
$new-gutters: $column-width $column-width * $gutters;
|
90
|
-
}
|
91
|
-
|
92
|
-
// Create keyword for show-grids setting
|
93
|
-
@if type-of($show-grids) == bool {
|
94
|
-
@if $show-grids {
|
95
|
-
$new-show-grids: show;
|
96
|
-
} @else {
|
97
|
-
$new-show-grids: hide;
|
98
|
-
}
|
99
|
-
} @else {
|
100
|
-
$new-show-grids: $show-grids;
|
101
|
-
}
|
102
|
-
|
103
|
-
// Return grid shorthand
|
104
|
-
@return compact($container $columns $new-gutters $layout-math $layout-method $container-position $new-show-grids $flow $gutter-position $box-sizing);
|
33
|
+
$susy: $old !global;
|
105
34
|
}
|
106
35
|
|
107
36
|
// Parse Grid
|
@@ -109,190 +38,67 @@ $show-grids : show-columns !default;
|
|
109
38
|
// Parse a shorthand grid, and return an ordered list of settings
|
110
39
|
// - [$grid] : <settings>
|
111
40
|
@function parse-grid(
|
112
|
-
$grid
|
41
|
+
$grid
|
113
42
|
) {
|
114
|
-
$
|
115
|
-
$new-gutters : false;
|
116
|
-
$new-container : false;
|
117
|
-
$new-column-width : false;
|
118
|
-
$new-layout-math : false;
|
119
|
-
$new-layout-method : false;
|
120
|
-
$new-container-position : false;
|
121
|
-
$new-flow : false;
|
122
|
-
$new-gutter-position : false;
|
123
|
-
$new-show-grids : false;
|
124
|
-
$new-box-sizing : false;
|
125
|
-
|
126
|
-
$columns-check : false;
|
43
|
+
$return: $grid;
|
127
44
|
|
128
|
-
@
|
129
|
-
|
130
|
-
|
131
|
-
@if $value == static {
|
132
|
-
$new-layout-math: static;
|
133
|
-
} @else if $value == fluid {
|
134
|
-
$new-layout-math: fluid;
|
135
|
-
}
|
45
|
+
@if type-of($grid) != map {
|
46
|
+
$return : ();
|
47
|
+
$columns-check : false;
|
136
48
|
|
137
|
-
|
138
|
-
@if $value == isolate {
|
139
|
-
$new-layout-method: isolate;
|
140
|
-
} @else if $value == float {
|
141
|
-
$new-layout-method: float;
|
142
|
-
}
|
49
|
+
@each $item in $grid {
|
143
50
|
|
144
|
-
//
|
145
|
-
@if $
|
146
|
-
$
|
147
|
-
} @else if $value == right {
|
148
|
-
$new-container-position: right;
|
149
|
-
} @else if $value == center {
|
150
|
-
$new-container-position: center;
|
151
|
-
}
|
51
|
+
// maps
|
52
|
+
@if type-of($item) == map {
|
53
|
+
$return: map-merge($return, $item);
|
152
54
|
|
153
|
-
//
|
154
|
-
@if $
|
155
|
-
$
|
156
|
-
|
157
|
-
|
55
|
+
// Keywords
|
56
|
+
} @else if type-of($item) == string {
|
57
|
+
@each $key, $value in $susy-keywords {
|
58
|
+
@if index($value, $item) {
|
59
|
+
$return: map-merge($return, ($key: $item));
|
60
|
+
}
|
61
|
+
}
|
158
62
|
}
|
159
63
|
|
160
|
-
//
|
161
|
-
@if $
|
162
|
-
$
|
163
|
-
|
164
|
-
$
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
64
|
+
// Container, Columns, or Gutters
|
65
|
+
@else if type-of($item) == number {
|
66
|
+
@if not unitless($item) {
|
67
|
+
$return: map-merge($return, (container: $item));
|
68
|
+
} @else if not $columns-check {
|
69
|
+
$return: map-merge($return, (columns: $item));
|
70
|
+
$columns-check: true;
|
71
|
+
} @else {
|
72
|
+
$return: map-merge($return, (gutters: $item));
|
73
|
+
}
|
169
74
|
}
|
170
75
|
|
171
|
-
//
|
172
|
-
@if $
|
173
|
-
$
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
} @else if $value == inside-static {
|
181
|
-
$new-gutter-position: inside-static;
|
182
|
-
} @else if $value == no-gutters {
|
183
|
-
$new-gutter-position: no-gutters;
|
184
|
-
}
|
185
|
-
|
186
|
-
// box-sizing: border-box | content-box
|
187
|
-
@if $value == border-box {
|
188
|
-
$new-box-sizing: border-box;
|
189
|
-
} @else if $value == content-box {
|
190
|
-
$new-box-sizing: content-box;
|
191
|
-
}
|
192
|
-
|
193
|
-
// auto container
|
194
|
-
@if $value == auto {
|
195
|
-
$new-container: auto;
|
196
|
-
}
|
197
|
-
}
|
198
|
-
|
199
|
-
// container, columns, or gutters
|
200
|
-
@else if type-of($value) == number {
|
201
|
-
@if not unitless($value) {
|
202
|
-
$new-container: $value;
|
203
|
-
} @else if not $columns-check {
|
204
|
-
$new-columns: $value;
|
205
|
-
$columns-check: true;
|
206
|
-
} @else {
|
207
|
-
$new-gutters: $value;
|
208
|
-
}
|
209
|
-
}
|
210
|
-
|
211
|
-
// columns or gutters
|
212
|
-
@else if type-of($value) == list {
|
213
|
-
@if unitless(nth($value,1)) {
|
214
|
-
$new-columns: $value;
|
215
|
-
$columns-check: true;
|
216
|
-
} @else {
|
217
|
-
$new-column-width: nth($value,1);
|
218
|
-
$new-gutters: nth($value,2) / nth($value,1);
|
76
|
+
// Columns or Gutters
|
77
|
+
@else if type-of($item) == list {
|
78
|
+
@if unitless(nth($item,1)) {
|
79
|
+
$return: map-merge($return, (columns: $item));
|
80
|
+
$columns-check: true;
|
81
|
+
} @else {
|
82
|
+
$return: map-merge($return, (column-width: nth($item,1)));
|
83
|
+
$return: map-merge($return, (gutters: nth($item,2) / nth($item,1)));
|
84
|
+
}
|
219
85
|
}
|
220
86
|
}
|
221
87
|
}
|
222
88
|
|
223
|
-
@return $
|
224
|
-
}
|
225
|
-
|
226
|
-
// Get Adjusted Grid
|
227
|
-
// -----------------
|
228
|
-
// Fill missing grid values based on global settings
|
229
|
-
// - $grid : <settings>
|
230
|
-
// - [$clean] : true | false (resets container, column-width, & box-sizing)
|
231
|
-
@function get-adjusted-grid(
|
232
|
-
$grid,
|
233
|
-
$clean: false
|
234
|
-
) {
|
235
|
-
$grid : parse-grid($grid);
|
236
|
-
|
237
|
-
$new-columns : get-setting(columns, $grid);
|
238
|
-
$new-gutters : get-setting(gutters, $grid);
|
239
|
-
$new-layout-math : get-setting(layout-math, $grid);
|
240
|
-
$new-layout-method : get-setting(layout-method, $grid);
|
241
|
-
$new-flow : get-setting(flow, $grid);
|
242
|
-
$new-gutter-place : get-setting(gutter-position, $grid);
|
243
|
-
$new-container-position : get-setting(container-position, $grid);
|
244
|
-
$new-show-grids : get-setting(show-grids, $grid);
|
245
|
-
|
246
|
-
$new-container : get-setting(container, $grid);
|
247
|
-
$new-column-width : get-setting(column-width, $grid);
|
248
|
-
$new-box-sizing : get-setting(box-sizing, $grid);
|
249
|
-
|
250
|
-
// Set required values
|
251
|
-
$new-columns : if($new-columns, $new-columns, $columns);
|
252
|
-
$new-gutters : if($new-gutters, $new-gutters, $gutters);
|
253
|
-
$new-layout-math : if($new-layout-math, $new-layout-math, $layout-math);
|
254
|
-
$new-layout-method : if($new-layout-method, $new-layout-method, $layout-method);
|
255
|
-
$new-flow : if($new-flow, $new-flow, $flow);
|
256
|
-
$new-gutter-place : if($new-gutter-place, $new-gutter-place, $gutter-position);
|
257
|
-
$new-container-position : if($new-container-position, $new-container-position, $container-position);
|
258
|
-
$new-show-grids : if($new-show-grids, $new-show-grids, $show-grids);
|
259
|
-
|
260
|
-
// optionally fill values based on current grid
|
261
|
-
@if $clean {
|
262
|
-
$new-container : if($new-container, $new-container, auto);
|
263
|
-
} @else {
|
264
|
-
$new-container : if($new-container, $new-container, $container);
|
265
|
-
$new-column-width : if($new-column-width, $new-column-width, $column-width);
|
266
|
-
$new-box-sizing : if($new-box-sizing, $new-box-sizing, $box-sizing);
|
267
|
-
}
|
268
|
-
|
269
|
-
@return $new-columns, $new-gutters, $new-container, $new-column-width, $new-layout-math, $new-layout-method, $new-container-position, $new-flow, $new-gutter-place, $new-show-grids, $new-box-sizing;
|
89
|
+
@return $return;
|
270
90
|
}
|
271
91
|
|
272
92
|
// Get Setting
|
273
93
|
// -----------
|
274
|
-
// Return one setting from a
|
275
|
-
// - setting : <keyword>
|
94
|
+
// Return one setting from a grid
|
95
|
+
// - setting : <keyword>
|
276
96
|
// - $grid : <settings>
|
277
|
-
|
278
|
-
|
279
|
-
$
|
280
|
-
$grid : parse-grid(),
|
281
|
-
$parse : false
|
97
|
+
@function susy-get(
|
98
|
+
$key,
|
99
|
+
$grid: map-merge($susy-defaults, $susy)
|
282
100
|
) {
|
283
|
-
$
|
284
|
-
$key : index($options, $setting);
|
285
|
-
$value : false;
|
286
|
-
|
287
|
-
@if $parse {
|
288
|
-
$grid: parse-grid($grid);
|
289
|
-
}
|
290
|
-
|
291
|
-
@if $key {
|
292
|
-
$value: nth($grid, $key);
|
293
|
-
} @else {
|
294
|
-
@warn '"#{$setting}" is not a valid grid setting.';
|
295
|
-
}
|
101
|
+
$grid: parse-grid($grid);
|
296
102
|
|
297
|
-
@return $
|
103
|
+
@return map-get($grid, $key) or map-get($susy, $key) or map-get($susy-defaults, $key);
|
298
104
|
}
|