toolkit 0.2.2 → 0.2.3

Sign up to get free protection for your applications and to get access to all the features.
data/lib/toolkit.rb CHANGED
@@ -2,16 +2,12 @@ require 'compass'
2
2
  require 'susy'
3
3
  require 'respond-to'
4
4
  require 'singularitygs'
5
+ require 'sassy-strings'
5
6
 
6
7
  extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
7
8
  Compass::Frameworks.register('toolkit', :path => extension_path)
8
9
 
9
10
  module Sass::Script::Functions
10
- def str_replace(needle, replace, haystack)
11
- result = haystack.value.gsub(needle.value, replace.value)
12
- Sass::Script::String.new(result)
13
- end
14
-
15
11
  def children_of_ie_nth(input)
16
12
  n = "n"
17
13
  b = ""
@@ -13,6 +13,11 @@
13
13
  ////////////////////////
14
14
  @import 'toolkit/fluid-media';
15
15
 
16
+ ////////////////////////
17
+ // Import Intrinsic Ratio
18
+ ////////////////////////
19
+ @import 'toolkit/intrinsic-ratio';
20
+
16
21
  ////////////////////////
17
22
  // Import Progressive Enhancement
18
23
  ////////////////////////
@@ -4,56 +4,4 @@
4
4
  img, video {
5
5
  max-width: 100%;
6
6
  height: auto;
7
- }
8
-
9
- ////////////////////////
10
- // Fluid Embeds and whatever WITH NO JAVASCIPT!
11
- ////////////////////////
12
- $intrinsic-ratio: 16/9 !default;
13
- $intrinsic-ratio-width: 100% !default;
14
- $intrinsic-ratio-elements: '*' !default;
15
- $intrinsic-ratio-extend: true !default;
16
-
17
- @mixin intrinsic-ratio-parent {
18
- position: relative;
19
- height: 0;
20
- }
21
-
22
- @mixin intrinsic-ratio-child {
23
- display: block;
24
- position: absolute;
25
- width: 100% !important; // Nuke the external styles
26
- height: 100% !important; // Nuke the external styles
27
- top: 0;
28
- margin: 0;
29
- padding: 0;
30
- }
31
-
32
- @mixin intrinsic-ratio($ratio: $intrinsic-ratio, $width: $intrinsic-ratio-width, $elements: $intrinsic-ratio-elements, $extend: $intrinsic-ratio-extend) {
33
- @if not $extend {
34
- @include intrinsic-ratio-parent;
35
- }
36
- @else {
37
- @extend %intrinsic-ratio-parent;
38
- }
39
- padding-top: (1 / $ratio) * $width;
40
- width: $width;
41
- @each $element in $elements {
42
- > #{$element} {
43
- @if not $extend {
44
- @include intrinsic-ratio-child;
45
- }
46
- @else {
47
- @extend %intrinsic-ratio-child;
48
- }
49
- }
50
- }
51
- }
52
-
53
- %intrinsic-ratio-parent {
54
- @include intrinsic-ratio-parent;
55
- }
56
-
57
- %intrinsic-ratio-child {
58
- @include intrinsic-ratio-child;
59
7
  }
@@ -0,0 +1,51 @@
1
+ ////////////////////////
2
+ // Fluid Embeds and whatever WITH NO JAVASCIPT!
3
+ ////////////////////////
4
+ $intrinsic-ratio: 16/9 !default;
5
+ $intrinsic-ratio-width: 100% !default;
6
+ $intrinsic-ratio-elements: '> *' !default;
7
+ $intrinsic-ratio-extend: true !default;
8
+
9
+ @mixin intrinsic-ratio-parent {
10
+ position: relative;
11
+ height: 0;
12
+ }
13
+
14
+ @mixin intrinsic-ratio-child {
15
+ display: block;
16
+ position: absolute;
17
+ width: 100% !important; // Nuke the external styles
18
+ height: 100% !important; // Nuke the external styles
19
+ top: 0;
20
+ margin: 0;
21
+ padding: 0;
22
+ }
23
+
24
+ @mixin intrinsic-ratio($ratio: $intrinsic-ratio, $width: $intrinsic-ratio-width, $elements: $intrinsic-ratio-elements, $extend: $intrinsic-ratio-extend) {
25
+ @if not $extend {
26
+ @include intrinsic-ratio-parent;
27
+ }
28
+ @else {
29
+ @extend %intrinsic-ratio-parent;
30
+ }
31
+ padding-top: (1 / $ratio) * $width;
32
+ width: $width;
33
+ @each $element in $elements {
34
+ #{$element} {
35
+ @if not $extend {
36
+ @include intrinsic-ratio-child;
37
+ }
38
+ @else {
39
+ @extend %intrinsic-ratio-child;
40
+ }
41
+ }
42
+ }
43
+ }
44
+
45
+ %intrinsic-ratio-parent {
46
+ @include intrinsic-ratio-parent;
47
+ }
48
+
49
+ %intrinsic-ratio-child {
50
+ @include intrinsic-ratio-child;
51
+ }
@@ -39,6 +39,8 @@
39
39
  // - $with-dimensions: Switches between including dimensions (height/width for all and background-size for SVG) or not. Defaults to true.
40
40
  // - $inline: Whether or not the containing selector is an inline element. Defaults to false.
41
41
  ////////////////////////
42
+ @import "compass/utilities/sprites";
43
+
42
44
  $replace-text-pe-method: 'svg' !default;
43
45
  $replace-text-pe-inline-svg: true !default;
44
46
  $replace-text-pe-with-dimensions: true !default;
metadata CHANGED
@@ -5,8 +5,8 @@ version: !ruby/object:Gem::Version
5
5
  segments:
6
6
  - 0
7
7
  - 2
8
- - 2
9
- version: 0.2.2
8
+ - 3
9
+ version: 0.2.3
10
10
  platform: ruby
11
11
  authors:
12
12
  - Sam Richard
@@ -74,6 +74,19 @@ dependencies:
74
74
  version: 0.0.17
75
75
  type: :runtime
76
76
  version_requirements: *id004
77
+ - !ruby/object:Gem::Dependency
78
+ name: sassy-strings
79
+ prerelease: false
80
+ requirement: &id005 !ruby/object:Gem::Requirement
81
+ requirements:
82
+ - - ">="
83
+ - !ruby/object:Gem::Version
84
+ segments:
85
+ - 0
86
+ - 1
87
+ version: "0.1"
88
+ type: :runtime
89
+ version_requirements: *id005
77
90
  description: Toolkit for Progressive Enhancement and Responsive Web Design
78
91
  email:
79
92
  - sam@snug.ug
@@ -93,6 +106,7 @@ files:
93
106
  - stylesheets/toolkit/_clearfix.scss
94
107
  - stylesheets/toolkit/_colours.scss
95
108
  - stylesheets/toolkit/_fluid-media.scss
109
+ - stylesheets/toolkit/_intrinsic-ratio.scss
96
110
  - stylesheets/toolkit/_pe.scss
97
111
  - stylesheets/toolkit/_selectors.scss
98
112
  - stylesheets/toolkit/_triangle.scss