compass_sumo 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
data/README.md ADDED
@@ -0,0 +1,22 @@
1
+ compass_sumo
2
+ ============
3
+
4
+ This is the gem for the SumoCoders default SCSS framework. Including a lot of usefull plugins
5
+
6
+ ## Install
7
+
8
+ Installation is pretty straightforward throught RubyGems:
9
+
10
+ gem install compass_sumo
11
+
12
+ ## Usage
13
+
14
+ In setup.rb you require 'compass_sumo', and then you can import the compass files like this
15
+
16
+ @import "compass";
17
+ @import "compass_sumo";
18
+
19
+ Or you can import certain parts manually (to improve load time)
20
+
21
+ @import "compass_sumo/mixins/animations"
22
+
@@ -0,0 +1,22 @@
1
+ # -*- encoding: utf-8 -*-
2
+ lib = File.expand_path('../lib/', __FILE__)
3
+ $:.unshift lib unless $:.include?(lib)
4
+
5
+ require 'compass_sumo/version'
6
+
7
+ Gem::Specification.new do |s|
8
+ s.name = 'compass_sumo'
9
+ s.summary = "SumoCoders CSS Framework"
10
+ s.description = "The SumoCoders CSS Framework"
11
+ s.authors = ["Jan De Poorter", "Niels De Paepe", "Mathias Helin"]
12
+ s.email = "compass@sumocoders.be"
13
+
14
+ s.files = `git ls-files`.split("\n")
15
+ s.executables = `git ls-files -- bin/*`.split("\n").map{|f| File.basename(f) }
16
+ s.require_paths = ["lib"]
17
+
18
+ s.version = CompassSumo::VERSION
19
+
20
+ s.add_dependency "compass"
21
+ end
22
+
@@ -0,0 +1,4 @@
1
+ module CompassSumo
2
+ class Engine < Rails::Engin
3
+ end
4
+ end
@@ -0,0 +1,23 @@
1
+ require 'uri'
2
+
3
+ module CompassSumo::SassExtensions::Functions::InlineSvg
4
+ def inline_svg(path)
5
+ data = svg_content(path.value)
6
+ data = URI.escape(data, '()#') # URL escape breaking characters
7
+ .split(/[\r\n]+/) # Get rid of newlines in the URL
8
+ .join.gsub(/\t/, '') # Get rid of tabs.
9
+
10
+ url = "url('data:image/svg+xml;utf-8,#{data}')"
11
+ Sass::Script::String.new(url)
12
+ end
13
+
14
+ private
15
+ def svg_content(path)
16
+ full_path = File.join(Compass.configuration.images_path, path)
17
+ if File.readable?(full_path)
18
+ File.read(full_path)
19
+ else
20
+ raise Compass::Error, "File not found or cannot be read: #{full_path}"
21
+ end
22
+ end
23
+ end
@@ -0,0 +1,14 @@
1
+ module CompassSumo::SassExtensions
2
+ module Functions
3
+ end
4
+ end
5
+
6
+ require 'compass_sumo/sass_extensions/functions/inline_svg'
7
+
8
+ module Sass::Script::Functions
9
+ include CompassSumo::SassExtensions::Functions::InlineSvg
10
+ end
11
+
12
+ class Sass::Script::Functions::EvaluationContext
13
+ include Sass::Script::Functions
14
+ end
@@ -0,0 +1,3 @@
1
+ module CompassSumo
2
+ VERSION = "0.2.0"
3
+ end
@@ -0,0 +1,12 @@
1
+ require 'compass'
2
+
3
+ module CompassSumo
4
+ end
5
+
6
+ if defined?(::Rails) && ::Rails.version >= "3.1"
7
+ require 'compass_sumo/engine'
8
+ end
9
+
10
+ require 'compass_sumo/sass_extensions/functions'
11
+
12
+ Compass::Frameworks.register("sumo", :path => "#{File.dirname(__FILE__)}/..")
@@ -0,0 +1 @@
1
+ @import 'compass_sumo/mixins'
@@ -0,0 +1,3 @@
1
+ @import 'compass_sumo/mixins/animations';
2
+ @import 'compass_sumo/mixins/load_font';
3
+ @import 'compass_sumo/mixins/retina_sprites';
@@ -0,0 +1,27 @@
1
+ @mixin keyframes($animationName) {
2
+ @-webkit-keyframes $animationName {
3
+ @content
4
+ }
5
+
6
+ @-moz-keyframes $animationName {
7
+ @content
8
+ }
9
+
10
+ @-o-keyframes $animationName {
11
+ @content
12
+ }
13
+
14
+ @keyframes $animationName {
15
+ @content
16
+ }
17
+ }
18
+
19
+ // This mixin generates the prefixed versions for the CSS3 animation method,
20
+ // and sets the fill-mode (defaulting to forwards).
21
+ //
22
+ // MS prefixing is disabled because it breaks some versions of Firefox, and
23
+ // is not required for any IE browser supporting CSS3 animations
24
+ @mixin animate($animationProperties, $fillMode: 'forwards') {
25
+ @include experimental(animation, $animationProperties, $ms: false);
26
+ @include experimental(animation-fill-mode, $fillMode, $ms: false);
27
+ }
@@ -0,0 +1,10 @@
1
+ @mixin load-font($fontName, $fontFile, $weight: "normal", $style: "normal") {
2
+ @include font-face($fontName,
3
+ font-files("#{$fontFile}.woff",
4
+ "#{$fontFile}.ttf",
5
+ "#{$fontFile}.svg##{$fontName}"),
6
+ "#{$fontFile}.eot",
7
+ $weight,
8
+ $style
9
+ );
10
+ }
@@ -0,0 +1,69 @@
1
+ @import "compass/utilities/sprites"; // Include compass sprite helpers
2
+ @import "compass/css3/background-size"; // Include helper to calc background size
3
+
4
+ @mixin sprite($name, $hover: false, $active: false) {
5
+ @include retina-sprite($name, $sprites, $sprites2x, $hover, $active);
6
+ }
7
+
8
+ // The general purpose retina sprite mixin.
9
+ //
10
+ // @include retina-sprite(name, $spritemap1, $spritemap2)
11
+ // @include retina-sprite(name, $spritemap1, $spritemap2[, $dimensions: true, $pad: 0])
12
+ //
13
+ // If `dimensions` is true, then width/height will also be set.
14
+ //
15
+ // if `pad` is non-zero, then that's how much padding the element will have (requires
16
+ // $spacing on the sprite maps). Great for iPhone interfaces to make hit areas bigger.
17
+ //
18
+ @mixin retina-sprite($name, $sprites, $sprites2x, $hover, $active, $dimensions: true, $pad: 0) {
19
+ @if $dimensions == true {
20
+ @include sprite-dimensions($sprites, $name);
21
+ }
22
+ background-image: sprite-url($sprites);
23
+ background-position: sprite-position($sprites, $name, -$pad, -$pad);
24
+ background-repeat: no-repeat;
25
+
26
+ @if $hover == true {
27
+ $name_hover: $name + _hover;
28
+ &:hover {
29
+ background-position: sprite-position($sprites, $name_hover, -$pad, -$pad);
30
+ }
31
+ }
32
+ @if $active == true {
33
+ $name_active: $name + _active;
34
+ &:active {
35
+ background-position: sprite-position($sprites, $name_active, -$pad, -$pad);
36
+ }
37
+ }
38
+
39
+ @if $pad > 0 {
40
+ padding: $pad;
41
+ }
42
+
43
+ @media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-device-pixel-ratio: 1.5) {
44
+ & {
45
+ $pos: sprite-position($sprites2x, $name, -$pad * 2, -$pad * 2);
46
+ background-image: sprite-url($sprites2x);
47
+ background-position: nth($pos, 1) nth($pos, 2) / 2;
48
+ @include background-size(ceil(image-width(sprite-path($sprites2x)) / 2) auto);
49
+ // sprite-path() returns the path of the generated sprite sheet, which
50
+ // image-width() calculates the width of. the ceil() is in place in case
51
+ // you have sprites that have an odd-number of pixels in width
52
+
53
+ @if $hover == true {
54
+ $name_hover: $name + _hover; // create myButton_hover and assign it
55
+ &:hover{
56
+ $pos: sprite-position($sprites2x, $name_hover, -$pad * 2, -$pad * 2);
57
+ background-position: nth($pos, 1) nth($pos, 2) / 2;
58
+ }
59
+ }
60
+ @if $active == true {
61
+ $name_active: $name + _active; // create myButton_active and assign it
62
+ &:active{
63
+ $pos: sprite-position($sprites2x, $name_active, -$pad * 2, -$pad * 2);
64
+ background-position: nth($pos, 1) nth($pos, 2) / 2;
65
+ }
66
+ }
67
+ }
68
+ }
69
+ }
metadata ADDED
@@ -0,0 +1,75 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: compass_sumo
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.2.0
5
+ prerelease:
6
+ platform: ruby
7
+ authors:
8
+ - Jan De Poorter
9
+ - Niels De Paepe
10
+ - Mathias Helin
11
+ autorequire:
12
+ bindir: bin
13
+ cert_chain: []
14
+ date: 2013-02-21 00:00:00.000000000 Z
15
+ dependencies:
16
+ - !ruby/object:Gem::Dependency
17
+ name: compass
18
+ requirement: !ruby/object:Gem::Requirement
19
+ none: false
20
+ requirements:
21
+ - - ! '>='
22
+ - !ruby/object:Gem::Version
23
+ version: '0'
24
+ type: :runtime
25
+ prerelease: false
26
+ version_requirements: !ruby/object:Gem::Requirement
27
+ none: false
28
+ requirements:
29
+ - - ! '>='
30
+ - !ruby/object:Gem::Version
31
+ version: '0'
32
+ description: The SumoCoders CSS Framework
33
+ email: compass@sumocoders.be
34
+ executables: []
35
+ extensions: []
36
+ extra_rdoc_files: []
37
+ files:
38
+ - README.md
39
+ - compass_sumo.gemspec
40
+ - lib/compass_sumo.rb
41
+ - lib/compass_sumo/engine.rb
42
+ - lib/compass_sumo/sass_extensions/functions.rb
43
+ - lib/compass_sumo/sass_extensions/functions/inline_svg.rb
44
+ - lib/compass_sumo/version.rb
45
+ - stylesheets/_compass_sumo.scss
46
+ - stylesheets/compass_sumo/_mixins.scss
47
+ - stylesheets/compass_sumo/mixins/_animations.scss
48
+ - stylesheets/compass_sumo/mixins/_load_font.scss
49
+ - stylesheets/compass_sumo/mixins/_retina_sprites.scss
50
+ homepage:
51
+ licenses: []
52
+ post_install_message:
53
+ rdoc_options: []
54
+ require_paths:
55
+ - lib
56
+ required_ruby_version: !ruby/object:Gem::Requirement
57
+ none: false
58
+ requirements:
59
+ - - ! '>='
60
+ - !ruby/object:Gem::Version
61
+ version: '0'
62
+ required_rubygems_version: !ruby/object:Gem::Requirement
63
+ none: false
64
+ requirements:
65
+ - - ! '>='
66
+ - !ruby/object:Gem::Version
67
+ version: '0'
68
+ requirements: []
69
+ rubyforge_project:
70
+ rubygems_version: 1.8.24
71
+ signing_key:
72
+ specification_version: 3
73
+ summary: SumoCoders CSS Framework
74
+ test_files: []
75
+ has_rdoc: