sassquatch 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (33) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +17 -0
  3. data/Gemfile +4 -0
  4. data/README.md +25 -0
  5. data/Rakefile +2 -0
  6. data/app/assets/stylesheets/sassquatch.scss +23 -0
  7. data/app/assets/stylesheets/sassquatch/_background_image.scss +4 -0
  8. data/app/assets/stylesheets/sassquatch/_centered.scss +6 -0
  9. data/app/assets/stylesheets/sassquatch/_clearfix.scss +16 -0
  10. data/app/assets/stylesheets/sassquatch/_display.scss +11 -0
  11. data/app/assets/stylesheets/sassquatch/_effects.scss +8 -0
  12. data/app/assets/stylesheets/sassquatch/_em.scss +18 -0
  13. data/app/assets/stylesheets/sassquatch/_flat_list.scss +4 -0
  14. data/app/assets/stylesheets/sassquatch/_floated_items.scss +4 -0
  15. data/app/assets/stylesheets/sassquatch/_font_face.scss +13 -0
  16. data/app/assets/stylesheets/sassquatch/_fonts.scss +46 -0
  17. data/app/assets/stylesheets/sassquatch/_grid.scss +21 -0
  18. data/app/assets/stylesheets/sassquatch/_hardware_accel.scss +9 -0
  19. data/app/assets/stylesheets/sassquatch/_image_replace.scss +28 -0
  20. data/app/assets/stylesheets/sassquatch/_links.scss +6 -0
  21. data/app/assets/stylesheets/sassquatch/_mute.scss +5 -0
  22. data/app/assets/stylesheets/sassquatch/_no_border.scss +3 -0
  23. data/app/assets/stylesheets/sassquatch/_no_list_style.scss +3 -0
  24. data/app/assets/stylesheets/sassquatch/_no_margin.scss +3 -0
  25. data/app/assets/stylesheets/sassquatch/_no_padding.scss +3 -0
  26. data/app/assets/stylesheets/sassquatch/_position.scss +11 -0
  27. data/app/assets/stylesheets/sassquatch/_rails.scss +7 -0
  28. data/app/assets/stylesheets/sassquatch/_reset_box.scss +4 -0
  29. data/app/assets/stylesheets/sassquatch/_reset_last_child.scss +3 -0
  30. data/lib/sassquatch.rb +4 -0
  31. data/lib/sassquatch/version.rb +3 -0
  32. data/sassquatch.gemspec +16 -0
  33. metadata +74 -0
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: 551e69812972f19b7b17f7bb17c44eddbd5765e0
4
+ data.tar.gz: 3ea0682c96cac7da53fdc7bea1b28466e1d2c67b
5
+ SHA512:
6
+ metadata.gz: d8997f87dc7bca584f43078d9be3dcac7b4bb35fe6c98d25cc420c1624998e2f61030ac52f68bfd744820bcac0182f2526c8f2cbb8353a75d6c6a0e533f4381d
7
+ data.tar.gz: ea6c1d36503fa26422af32357bd1c4eee54194bde3dc059f77cd5266daf90179553a8c0ccc4192d1ba90cf571c363bca4e03e6536017956d8dc1d4b00149b291
@@ -0,0 +1,17 @@
1
+ *.gem
2
+ *.rbc
3
+ .bundle
4
+ .config
5
+ .yardoc
6
+ Gemfile.lock
7
+ InstalledFiles
8
+ _yardoc
9
+ coverage
10
+ doc/
11
+ lib/bundler/man
12
+ pkg
13
+ rdoc
14
+ spec/reports
15
+ test/tmp
16
+ test/version_tmp
17
+ tmp
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in sassquatch.gemspec
4
+ gemspec
@@ -0,0 +1,25 @@
1
+ # Sassquatch
2
+
3
+ Some SCSS mixins I've written/collected since I started using it.
4
+
5
+ ## Installation
6
+
7
+ Add this line to your application's Gemfile:
8
+
9
+ gem "sassquatch"
10
+
11
+ And then execute:
12
+
13
+ $ bundle
14
+
15
+ Or install it yourself as:
16
+
17
+ $ gem install sassquatch
18
+
19
+ ## Contributing
20
+
21
+ 1. Fork it
22
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
23
+ 3. Commit your changes (`git commit -am 'Added some feature'`)
24
+ 4. Push to the branch (`git push origin my-new-feature`)
25
+ 5. Create new Pull Request
@@ -0,0 +1,2 @@
1
+ #!/usr/bin/env rake
2
+ require "bundler/gem_tasks"
@@ -0,0 +1,23 @@
1
+ $rails: true !default;
2
+
3
+ @import "sassquatch/background_image";
4
+ @import "sassquatch/centered";
5
+ @import "sassquatch/clearfix";
6
+ @import "sassquatch/display";
7
+ @import "sassquatch/effects";
8
+ @import "sassquatch/em";
9
+ @import "sassquatch/flat_list";
10
+ @import "sassquatch/floated_items";
11
+ @import "sassquatch/fonts";
12
+ @import "sassquatch/grid";
13
+ @import "sassquatch/image_replace";
14
+ @import "sassquatch/mute";
15
+ @import "sassquatch/no_border";
16
+ @import "sassquatch/no_list_style";
17
+ @import "sassquatch/no_margin";
18
+ @import "sassquatch/no_padding";
19
+ @import "sassquatch/position";
20
+ @import "sassquatch/rails";
21
+ @import "sassquatch/reset_box";
22
+ @import "sassquatch/reset_last_child";
23
+ @import "sassquatch/text_decoration";
@@ -0,0 +1,4 @@
1
+ @mixin background-image($path) {
2
+ @include rails { background-image: image-url($path); }
3
+ @include no-rails { background-image: url($path); }
4
+ }
@@ -0,0 +1,6 @@
1
+ %centered {
2
+ margin: {
3
+ left: auto;
4
+ right: auto;
5
+ };
6
+ }
@@ -0,0 +1,16 @@
1
+ // Let the clearfix hack begin.
2
+ @mixin clearfix {
3
+ zoom: 1;
4
+
5
+ &:before,
6
+ &:after {
7
+ content: "";
8
+ display: table;
9
+ }
10
+
11
+ &:after { clear: both; }
12
+ }
13
+
14
+ %clearfix {
15
+ @include clearfix;
16
+ }
@@ -0,0 +1,11 @@
1
+ %inline-block {
2
+ display: inline-block;
3
+ }
4
+
5
+ %block {
6
+ display: block;
7
+ }
8
+
9
+ %inline {
10
+ display: inline;
11
+ }
@@ -0,0 +1,8 @@
1
+ @mixin emboss($opacity, $opacity2){
2
+ box-shadow: rgba(#fff, $opacity) 0 1px 0,
3
+ inset rgba(#000, $opacity2) 0 1px 0;
4
+ }
5
+
6
+ @mixin letterpress($opacity){
7
+ text-shadow: rgba(#fff, $opacity) 0 1px 0;
8
+ }
@@ -0,0 +1,18 @@
1
+ $base-font: 16px !default;
2
+
3
+ @function remove-unit($number) {
4
+ $unit: unit($number);
5
+ $one: 1;
6
+
7
+ @if $unit == "px" { $one: 1px; }
8
+ @if $unit == "em" { $one: 1em; }
9
+ @if $unit == "%" { $one: 1%; }
10
+
11
+ @return $number / $one;
12
+ }
13
+
14
+ @function em($target, $context: $base-font) {
15
+ $size: remove-unit($target) / remove-unit($context);
16
+
17
+ @return #{$size}em;
18
+ }
@@ -0,0 +1,4 @@
1
+ %flat-list {
2
+ @extend %no-list-style;
3
+ @extend %floated-items;
4
+ }
@@ -0,0 +1,4 @@
1
+ %floated-items {
2
+ @extend %clearfix;
3
+ > * { float: left; }
4
+ }
@@ -0,0 +1,13 @@
1
+ // @include font-face('Open Sans', OpenSansLightRegular, opensans-light, 300, normal);
2
+ @mixin font-face($alias, $family, $filename, $weight: normal, $style: normal) {
3
+ @font-face {
4
+ font-family: "#{$alias}";
5
+ src: local("#{$family}"), url("fonts/#{$filename}-webfont.eot");
6
+ src: local("#{$family}"), url("fonts/#{$filename}-webfont.eot?#iefix") format("embedded-opentype"),
7
+ local("#{$family}"), url("fonts/#{$filename}-webfont.woff") format("woff"),
8
+ local("#{$family}"), url("fonts/#{$filename}-webfont.ttf") format("truetype");
9
+
10
+ font-weight: $weight;
11
+ font-style: $style;
12
+ }
13
+ }
@@ -0,0 +1,46 @@
1
+ @mixin lucida-grande {
2
+ font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
3
+ }
4
+
5
+ @mixin myriad-pro {
6
+ font-family: "Myriad Pro", "Gill Sans", "Gill Sans MT", Calibri, sans-serif;
7
+ }
8
+
9
+ @mixin georgia {
10
+ font-family: Georgia, Times, "Times New Roman", serif;
11
+ }
12
+
13
+ @mixin helvetica-neue {
14
+ font-family: "Helvetica Neue", "HelveticaNeue", sans-serif;
15
+ }
16
+
17
+ @mixin alegreya {
18
+ font-family: Alegreya, Cambria, Georgia, serif;
19
+ }
20
+
21
+ @mixin monospace {
22
+ font-family: Menlo, Monaco, "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
23
+ }
24
+
25
+ @mixin verdana {
26
+ font-family: Verdana, Geneva, sans-serif;
27
+ }
28
+
29
+ @mixin minion-pro {
30
+ font-family: minion-pro, Georgia, serif;
31
+ }
32
+
33
+ @mixin bariol {
34
+ font-family: bariol, "arial rounded", sans-serif;
35
+ font-weight: normal;
36
+ }
37
+
38
+ @mixin bariol-bold {
39
+ font-family: "Bariol Bold", "Arial Rounded MT Bold", sans-serif;
40
+ font-weight: normal;
41
+ }
42
+
43
+ @mixin bariol-light {
44
+ font-family: "Bariol Light", "Arial Rounded MT Light", sans-serif;
45
+ font-weight: normal;
46
+ }
@@ -0,0 +1,21 @@
1
+ $column: 54px !default;
2
+ $gutter: 30px !default;
3
+ $grid-columns: 12 !default;
4
+ $max-width: em($column * $grid-columns + ($grid-columns - 1) * $gutter) !default;
5
+
6
+ @mixin shift-columns($columns, $font-size: $base-font) {
7
+ margin-left: em($columns * $column + $columns * $gutter, $font-size);
8
+ }
9
+
10
+ @mixin span-columns($columns, $font-size: $base-font) {
11
+ @include columns($columns, $font-size);
12
+ margin-right: em($gutter, $font-size);
13
+ }
14
+
15
+ @mixin columns($columns, $font-size: $base-font) {
16
+ width: em(($columns * $column) + (($columns - 1) * $gutter), $font-size);
17
+ }
18
+
19
+ @mixin all-columns($font-size: $base-font) {
20
+ @include span-columns($grid-columns, true, $font-size);
21
+ }
@@ -0,0 +1,9 @@
1
+ // CSS animations are much more efficient than JavaScript-based animation.
2
+ // One nifty trick to take CSS animation performance to the next level is
3
+ // forcing them into hardware acceleration.
4
+ %hardware-accel {
5
+ -webkit-transform: translate3d(0, 0, 0);
6
+ -moz-transform: translate3d(0, 0, 0);
7
+ -ms-transform: translate3d(0, 0, 0);
8
+ transform: translate3d(0, 0, 0);
9
+ }
@@ -0,0 +1,28 @@
1
+ %image-replace {
2
+ overflow: hidden;
3
+ text-indent: 100%;
4
+ white-space: nowrap;
5
+ }
6
+
7
+ // Apply SVG as background-image when possible.
8
+ // If Rails support is enabled, use the image-url mixin.
9
+ @mixin svg($path) {
10
+ @include background-image("#{$path}.svg");
11
+ .no-svg & { @include background-image("#{$path}.png"); }
12
+ }
13
+
14
+ @mixin image-replace($path, $width, $height) {
15
+ @extend %image-replace;
16
+ @include background-image($path);
17
+
18
+ height: $height;
19
+ width: $width;
20
+ }
21
+
22
+ @mixin svg-image-replace($path, $width, $height) {
23
+ @extend %image-replace;
24
+ @include svg($path);
25
+
26
+ height: $height;
27
+ width: $width;
28
+ }
@@ -0,0 +1,6 @@
1
+ %text-decoration {
2
+ text-decoration: none;
3
+
4
+ &:hover,
5
+ &:focus { text-decoration: underline; }
6
+ }
@@ -0,0 +1,5 @@
1
+ $mute-color: #777 !default;
2
+
3
+ %mute {
4
+ color: $mute-color;
5
+ }
@@ -0,0 +1,3 @@
1
+ %no-border {
2
+ border: none;
3
+ }
@@ -0,0 +1,3 @@
1
+ %no-list-style {
2
+ list-style: none;
3
+ }
@@ -0,0 +1,3 @@
1
+ %no-margin {
2
+ margin: 0;
3
+ }
@@ -0,0 +1,3 @@
1
+ %no-padding {
2
+ padding: 0;
3
+ }
@@ -0,0 +1,11 @@
1
+ %absolute {
2
+ position: absolute;
3
+ }
4
+
5
+ %relative {
6
+ position: relative;
7
+ }
8
+
9
+ %fixed {
10
+ position: fixed;
11
+ }
@@ -0,0 +1,7 @@
1
+ @mixin rails {
2
+ @if $rails { @content; }
3
+ }
4
+
5
+ @mixin no-rails {
6
+ @if $rails != true { @content; }
7
+ }
@@ -0,0 +1,4 @@
1
+ %reset-box {
2
+ @extend %no-margin;
3
+ @extend %no-padding;
4
+ }
@@ -0,0 +1,3 @@
1
+ %reset-last-child > *:last-child {
2
+ margin-bottom: 0;
3
+ }
@@ -0,0 +1,4 @@
1
+ module Sassquatch
2
+ class Engine < Rails::Engine
3
+ end
4
+ end
@@ -0,0 +1,3 @@
1
+ module Sassquatch
2
+ VERSION = "0.0.1"
3
+ end
@@ -0,0 +1,16 @@
1
+ # -*- encoding: utf-8 -*-
2
+ require File.expand_path("../lib/sassquatch/version", __FILE__)
3
+
4
+ Gem::Specification.new do |gem|
5
+ gem.authors = ["Nando Vieira"]
6
+ gem.email = ["fnando.vieira@gmail.com"]
7
+ gem.description = "Some SCSS helpers"
8
+ gem.summary = gem.description
9
+
10
+ gem.files = `git ls-files`.split($\)
11
+ gem.executables = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
12
+ gem.test_files = gem.files.grep(%r{^(test|spec|features)/})
13
+ gem.name = "sassquatch"
14
+ gem.require_paths = ["lib"]
15
+ gem.version = Sassquatch::VERSION
16
+ end
metadata ADDED
@@ -0,0 +1,74 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: sassquatch
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.0.1
5
+ platform: ruby
6
+ authors:
7
+ - Nando Vieira
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2013-09-16 00:00:00.000000000 Z
12
+ dependencies: []
13
+ description: Some SCSS helpers
14
+ email:
15
+ - fnando.vieira@gmail.com
16
+ executables: []
17
+ extensions: []
18
+ extra_rdoc_files: []
19
+ files:
20
+ - .gitignore
21
+ - Gemfile
22
+ - README.md
23
+ - Rakefile
24
+ - app/assets/stylesheets/sassquatch.scss
25
+ - app/assets/stylesheets/sassquatch/_background_image.scss
26
+ - app/assets/stylesheets/sassquatch/_centered.scss
27
+ - app/assets/stylesheets/sassquatch/_clearfix.scss
28
+ - app/assets/stylesheets/sassquatch/_display.scss
29
+ - app/assets/stylesheets/sassquatch/_effects.scss
30
+ - app/assets/stylesheets/sassquatch/_em.scss
31
+ - app/assets/stylesheets/sassquatch/_flat_list.scss
32
+ - app/assets/stylesheets/sassquatch/_floated_items.scss
33
+ - app/assets/stylesheets/sassquatch/_font_face.scss
34
+ - app/assets/stylesheets/sassquatch/_fonts.scss
35
+ - app/assets/stylesheets/sassquatch/_grid.scss
36
+ - app/assets/stylesheets/sassquatch/_hardware_accel.scss
37
+ - app/assets/stylesheets/sassquatch/_image_replace.scss
38
+ - app/assets/stylesheets/sassquatch/_links.scss
39
+ - app/assets/stylesheets/sassquatch/_mute.scss
40
+ - app/assets/stylesheets/sassquatch/_no_border.scss
41
+ - app/assets/stylesheets/sassquatch/_no_list_style.scss
42
+ - app/assets/stylesheets/sassquatch/_no_margin.scss
43
+ - app/assets/stylesheets/sassquatch/_no_padding.scss
44
+ - app/assets/stylesheets/sassquatch/_position.scss
45
+ - app/assets/stylesheets/sassquatch/_rails.scss
46
+ - app/assets/stylesheets/sassquatch/_reset_box.scss
47
+ - app/assets/stylesheets/sassquatch/_reset_last_child.scss
48
+ - lib/sassquatch.rb
49
+ - lib/sassquatch/version.rb
50
+ - sassquatch.gemspec
51
+ homepage:
52
+ licenses: []
53
+ metadata: {}
54
+ post_install_message:
55
+ rdoc_options: []
56
+ require_paths:
57
+ - lib
58
+ required_ruby_version: !ruby/object:Gem::Requirement
59
+ requirements:
60
+ - - '>='
61
+ - !ruby/object:Gem::Version
62
+ version: '0'
63
+ required_rubygems_version: !ruby/object:Gem::Requirement
64
+ requirements:
65
+ - - '>='
66
+ - !ruby/object:Gem::Version
67
+ version: '0'
68
+ requirements: []
69
+ rubyforge_project:
70
+ rubygems_version: 2.1.0
71
+ signing_key:
72
+ specification_version: 4
73
+ summary: Some SCSS helpers
74
+ test_files: []