compass-pug 0.0.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +15 -0
- data/README.md +1 -0
- data/lib/compass-pug.rb +1 -0
- data/stylesheets/_pug.scss +18 -0
- data/stylesheets/pug/_functions.scss +129 -0
- data/stylesheets/pug/_mixins.scss +97 -0
- metadata +75 -0
checksums.yaml
ADDED
@@ -0,0 +1,15 @@
|
|
1
|
+
---
|
2
|
+
!binary "U0hBMQ==":
|
3
|
+
metadata.gz: !binary |-
|
4
|
+
NGU1ZTQzMDNjMTAxYzc5ZGI1NGJmODE2N2E5Y2QyMWZhMjRhN2Y3MQ==
|
5
|
+
data.tar.gz: !binary |-
|
6
|
+
NmU2NDNhNjY1YjI0Y2ExN2ZhYjFlN2IyNjBhOGY1ODk5NWQwOGNhMA==
|
7
|
+
SHA512:
|
8
|
+
metadata.gz: !binary |-
|
9
|
+
ZDJjYjE1ZDUyNmQxZDhjNDBlZTM3YjRjOTdhYjc2MzI1MjFmYzU2ZTM2NDBk
|
10
|
+
ZjMzMjRhMGEwODU1YWJiZjNlZDBhM2Q4YTg3MjRlMzk4ZDQyMmM0MjE4ZTZj
|
11
|
+
ZmU1NTYzODYxNjE3OGVlNzM0NjA0OGY5ZWNhNzdmYWVmN2ZiNjQ=
|
12
|
+
data.tar.gz: !binary |-
|
13
|
+
NmVkMjhhMTZhYjcxMmYzYzI3MWEzZDU2Y2I4YzY4MGQxMDY3MmExMzQwNzM0
|
14
|
+
MjRlNzQxYWVkZjUxZjYzMDYyZjliMmVlNjIyMTNmOGRlYTRjMjM4ZWJhOTll
|
15
|
+
MzQ5MGU2NzFjNmUzNGM0NGYwMjQ3MGY5MWQ2MjViY2IzNmQ1Mjk=
|
data/README.md
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
# Pug for Compass
|
data/lib/compass-pug.rb
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
Compass::Frameworks.register("compass-pug", :path => "#{File.dirname(__FILE__)}/..")
|
@@ -0,0 +1,18 @@
|
|
1
|
+
/**
|
2
|
+
* Pug: Default configuration vars and imports.
|
3
|
+
*/
|
4
|
+
|
5
|
+
// Default values
|
6
|
+
// ---------------------------------------------------------------------------
|
7
|
+
$pug-tab-size: 2 !default;
|
8
|
+
|
9
|
+
// Vars related to vertical-rhythm.
|
10
|
+
$pug-vr-base-font-size: 16px !default;
|
11
|
+
$pug-vr-vertical-unit: 24px !default;
|
12
|
+
$pug-vr-preferred-division: 0.5 !default;
|
13
|
+
$pug-vr-line-height-minimum-difference-proportion: 0.25 !default;
|
14
|
+
|
15
|
+
// Import
|
16
|
+
// ---------------------------------------------------------------------------
|
17
|
+
@import "pug/functions"
|
18
|
+
@import "pug/mixins"
|
@@ -0,0 +1,129 @@
|
|
1
|
+
/* Pug - Core Functions */
|
2
|
+
|
3
|
+
/**
|
4
|
+
* Calculate an appropriate line-height value that maintains vertical rhythm.
|
5
|
+
*
|
6
|
+
* Note that $font-size and $vertical-unit must use the same unit of measurement (px, rem, em, etc).
|
7
|
+
*
|
8
|
+
* @param string $font-size
|
9
|
+
* Font-size to use for generating the line-height result. Must have same unit of measurement as $vertical-unit.
|
10
|
+
* @param string $vertical-unit
|
11
|
+
*
|
12
|
+
* @param number $division
|
13
|
+
* Represents how $vertical-unit will be divided. Usually this should be 1, 0.5 or 0.25.
|
14
|
+
* @param number $minimum-difference-proportion
|
15
|
+
* Minimum acceptable proportional diff.
|
16
|
+
*/
|
17
|
+
@function pug-calculate-line-height(
|
18
|
+
$font-size $pug-vr-base-font-size,
|
19
|
+
$vertical-unit: $pug-vr-vertical-unit,
|
20
|
+
$division: $pug-vr-division,
|
21
|
+
$minimum-difference-proportion: $pug-vr-line-height-minimum-difference-proportion
|
22
|
+
) {
|
23
|
+
|
24
|
+
// Make sure the font size and line height use the same unit of measurement.
|
25
|
+
@if pug-units-match($font-size, $vertical-unit) == false {
|
26
|
+
@warn "Incompatible font-size and vertical-unit arguments [#{$_font-size-unit} and #{$_vertical-unit-unit}]";
|
27
|
+
@return false;
|
28
|
+
}
|
29
|
+
|
30
|
+
// If the font size is less than the VU and the diff is greater than the $minimum-difference-proportion,
|
31
|
+
// just return the submitted VU.
|
32
|
+
@if $font-size < ($vertical-unit * $minimum-difference-proportion) {
|
33
|
+
@return $vertical-unit;
|
34
|
+
}
|
35
|
+
// Otherwise we'll need to calculate a proper value.
|
36
|
+
@else {
|
37
|
+
// Our minimum unit of height.
|
38
|
+
$m: $vertical-unit*$division;
|
39
|
+
// The line-height var we'll be calculating, starting with $vertical-unit as the min.
|
40
|
+
$lh: $vertical-unit;
|
41
|
+
// Add $m to it until we get a suitable value.
|
42
|
+
@while $font-size > $lh - ($lh*$minimum-difference-proportion) {
|
43
|
+
$lh: $lh+$m;
|
44
|
+
}
|
45
|
+
@return $lh;
|
46
|
+
}
|
47
|
+
}
|
48
|
+
|
49
|
+
/**
|
50
|
+
* Round a size up to the nearest factor of a vertical unit (or of a sub-unit of that vertical unit).
|
51
|
+
* Parameters must use the same unit of measurement (rem, px, etc).
|
52
|
+
*
|
53
|
+
* @param string $original-size
|
54
|
+
* @param string $vertical-unit
|
55
|
+
* @param number $division
|
56
|
+
* If you want to allow factors of a division of $vertical-unit, use a decimal value here (like 0.5).
|
57
|
+
*/
|
58
|
+
@function pug-round-up-to-nearest-vertical-unit(
|
59
|
+
$original-size,
|
60
|
+
$vertical-unit: $pug-vr-vertical-unit,
|
61
|
+
$division: $pug-vr-preferred-division
|
62
|
+
) {
|
63
|
+
@if pug-units-match($original-size, $vertical-unit) == false {
|
64
|
+
@warn "Incompatible arguments passed to PROJECT-round-up-to-nearest-vertical-unit()";
|
65
|
+
@return false;
|
66
|
+
}
|
67
|
+
@else {
|
68
|
+
// If size is less than or equal to VU, return VU.
|
69
|
+
@if $original-size <= $vertical-unit {
|
70
|
+
@return $vertical-unit;
|
71
|
+
}
|
72
|
+
// Otherwise generate an appropriate value.
|
73
|
+
@else {
|
74
|
+
// Our minimum unit of height.
|
75
|
+
$m: $vertical-unit*$division;
|
76
|
+
// The line-height var we'll be calculating, starting with $vertical-unit as the min.
|
77
|
+
$new-height: $vertical-unit;
|
78
|
+
// Add $m to it until we get a suitable value.
|
79
|
+
@while $original-size > $new-height {
|
80
|
+
$new-height: $new-height+$m;
|
81
|
+
}
|
82
|
+
@return $new-height;
|
83
|
+
}
|
84
|
+
}
|
85
|
+
}
|
86
|
+
|
87
|
+
/**
|
88
|
+
* Strip unit of measurement from a numeric value.
|
89
|
+
* For example, "10px" becomes "10".
|
90
|
+
*
|
91
|
+
* From http://stackoverflow.com/a/12335841
|
92
|
+
*
|
93
|
+
* @param string $number
|
94
|
+
* @return number
|
95
|
+
*/
|
96
|
+
@function pug-strip-units($number) {
|
97
|
+
$new: $number / ($number * 0 + 1);
|
98
|
+
@return $new;
|
99
|
+
}
|
100
|
+
|
101
|
+
/**
|
102
|
+
* Determine whether two or more values use the same unit of measurement.
|
103
|
+
*
|
104
|
+
* Similar to the Sass comparable() function but requires exact match
|
105
|
+
* (such as mm and mm, but not cm and mm).
|
106
|
+
*
|
107
|
+
* @param string $v1 The first value to compare.
|
108
|
+
* @param [...] $others One or more additional values to compare.
|
109
|
+
* @return boolean
|
110
|
+
*/
|
111
|
+
@function pug-units-match($v1, $others...) {
|
112
|
+
/* Example usages:
|
113
|
+
@debug pug-units-match(1px, 4px); // true
|
114
|
+
@debug pug-units-match(1px, 4rem); // false
|
115
|
+
@debug pug-units-match(1px, 4px, 12px); // true
|
116
|
+
@debug pug-units-match(1rem, 4rem, 1.2rem); // true
|
117
|
+
@debug pug-units-match(1rem, 4px, 1.2rem); // false
|
118
|
+
*/
|
119
|
+
$v1-unit: unit($v1);
|
120
|
+
$return: true;
|
121
|
+
@for $i from 1 through length($others) {
|
122
|
+
$cur-unit: unit(nth($others, $i));
|
123
|
+
@if $cur-unit != $v1-unit {
|
124
|
+
$return: false;
|
125
|
+
}
|
126
|
+
}
|
127
|
+
@return $return;
|
128
|
+
}
|
129
|
+
|
@@ -0,0 +1,97 @@
|
|
1
|
+
/* Pug - Core Mixins */
|
2
|
+
|
3
|
+
/**
|
4
|
+
* Micro-clearfix.
|
5
|
+
*
|
6
|
+
* @see http://nicolasgallagher.com/micro-clearfix-hack/
|
7
|
+
*/
|
8
|
+
@mixin pug-micro-clearfix() {
|
9
|
+
&:before,
|
10
|
+
&:after {
|
11
|
+
content: " ";
|
12
|
+
display: table;
|
13
|
+
}
|
14
|
+
&:after {
|
15
|
+
clear: both;
|
16
|
+
}
|
17
|
+
*zoom: 1; // IE6/7: Include this rule to trigger hasLayout and contain floats.
|
18
|
+
}
|
19
|
+
|
20
|
+
/**
|
21
|
+
* Cross-browser default placeholder text color.
|
22
|
+
*
|
23
|
+
* Don't use this within a selector. Just drop it in at the top level of your sass code.
|
24
|
+
*
|
25
|
+
* @param string $color
|
26
|
+
* @see http://css-tricks.com/snippets/css/style-placeholder-text/
|
27
|
+
*/
|
28
|
+
@mixin pug-placeholder-color($color) {
|
29
|
+
::-webkit-input-placeholder {
|
30
|
+
color: $color;
|
31
|
+
}
|
32
|
+
:-moz-placeholder { /* Firefox 18- */
|
33
|
+
color: $color;
|
34
|
+
}
|
35
|
+
::-moz-placeholder { /* Firefox 19+ */
|
36
|
+
color: $color;
|
37
|
+
}
|
38
|
+
:-ms-input-placeholder {
|
39
|
+
color: $color;
|
40
|
+
}
|
41
|
+
}
|
42
|
+
|
43
|
+
|
44
|
+
/**
|
45
|
+
* Vendor-prefixed tab sizing. Use in elements such as pre.
|
46
|
+
*
|
47
|
+
* @param number $size
|
48
|
+
*/
|
49
|
+
@mixin pug-tab-size($size: $pug-tab-size) {
|
50
|
+
tab-size: $size;
|
51
|
+
-moz-tab-size: $size;
|
52
|
+
-o-tab-size: $size;
|
53
|
+
white-space: pre-wrap;
|
54
|
+
}
|
55
|
+
|
56
|
+
/**
|
57
|
+
* Apply to an element to make it accessible only to screen readers. (adapted from Bootstrap 3)
|
58
|
+
*
|
59
|
+
* @see sr-only-focusable()
|
60
|
+
* @see http://getbootstrap.com/css/#helper-classes-screen-readers
|
61
|
+
*/
|
62
|
+
@mixin sr-only {
|
63
|
+
position: absolute;
|
64
|
+
width: 1px;
|
65
|
+
height: 1px;
|
66
|
+
padding: 0;
|
67
|
+
margin: -1px;
|
68
|
+
overflow: hidden;
|
69
|
+
clip: rect(0,0,0,0);
|
70
|
+
border: 0;
|
71
|
+
}
|
72
|
+
|
73
|
+
/**
|
74
|
+
* Applies sr-only and shows the element again when it's focused. (adapted from Bootstrap 3)
|
75
|
+
*
|
76
|
+
* @param boolean $include-sr-only
|
77
|
+
* Whether to automatically the sr-only() mixin, which is required for this to work (you would
|
78
|
+
* only set this to false if you had already applied sr-only() to an element receiving
|
79
|
+
* sr-only-focusable).
|
80
|
+
*
|
81
|
+
* @see sr-only()
|
82
|
+
* @see http://getbootstrap.com/css/#helper-classes-screen-readers
|
83
|
+
*/
|
84
|
+
@mixin sr-only-focusable($include-sr-only: true) {
|
85
|
+
@if $include-sr-only == true {
|
86
|
+
@include sr-only;
|
87
|
+
}
|
88
|
+
&:active,
|
89
|
+
&:focus {
|
90
|
+
position: static;
|
91
|
+
width: auto;
|
92
|
+
height: auto;
|
93
|
+
margin: 0;
|
94
|
+
overflow: visible;
|
95
|
+
clip: auto;
|
96
|
+
}
|
97
|
+
}
|
metadata
ADDED
@@ -0,0 +1,75 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: compass-pug
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.0.1
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Andrew Kamm
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2014-07-27 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: sass
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - ~>
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: '3.3'
|
20
|
+
type: :runtime
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - ~>
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: '3.3'
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: compass
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - ! '>='
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: 1.0.0.alpha.21
|
34
|
+
type: :runtime
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - ! '>='
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: 1.0.0.alpha.21
|
41
|
+
description: a collection of mixins for compass
|
42
|
+
email: ak@kamm.co
|
43
|
+
executables: []
|
44
|
+
extensions: []
|
45
|
+
extra_rdoc_files: []
|
46
|
+
files:
|
47
|
+
- README.md
|
48
|
+
- lib/compass-pug.rb
|
49
|
+
- stylesheets/_pug.scss
|
50
|
+
- stylesheets/pug/_functions.scss
|
51
|
+
- stylesheets/pug/_mixins.scss
|
52
|
+
homepage: http://kamm.co/
|
53
|
+
licenses: []
|
54
|
+
metadata: {}
|
55
|
+
post_install_message:
|
56
|
+
rdoc_options: []
|
57
|
+
require_paths:
|
58
|
+
- lib
|
59
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
60
|
+
requirements:
|
61
|
+
- - ! '>='
|
62
|
+
- !ruby/object:Gem::Version
|
63
|
+
version: '0'
|
64
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
65
|
+
requirements:
|
66
|
+
- - ! '>='
|
67
|
+
- !ruby/object:Gem::Version
|
68
|
+
version: '0'
|
69
|
+
requirements: []
|
70
|
+
rubyforge_project:
|
71
|
+
rubygems_version: 2.2.2
|
72
|
+
signing_key:
|
73
|
+
specification_version: 4
|
74
|
+
summary: a collection of mixins for compass
|
75
|
+
test_files: []
|