compass-pug 0.0.4 → 0.0.5
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +8 -8
- data/README.md +50 -4
- data/stylesheets/_pug.scss +3 -0
- data/stylesheets/pug/_mixins.scss +36 -0
- metadata +4 -18
checksums.yaml
CHANGED
@@ -1,15 +1,15 @@
|
|
1
1
|
---
|
2
2
|
!binary "U0hBMQ==":
|
3
3
|
metadata.gz: !binary |-
|
4
|
-
|
4
|
+
OThkM2ZhNjEzYjkzMTlmYjIyOTA2Y2ExZWRiYTg4NWMxZDAyNzM1MQ==
|
5
5
|
data.tar.gz: !binary |-
|
6
|
-
|
6
|
+
NWE2ZmJjMTcyMWRhOTI3YzMyNzFjOGE2ZGYxZGJlNDc4ZTQzMTdkNw==
|
7
7
|
SHA512:
|
8
8
|
metadata.gz: !binary |-
|
9
|
-
|
10
|
-
|
11
|
-
|
9
|
+
MDNlNDE5NDViNDk1MGZjNzI5ZTNmMWI2ZjMxNTk1MDEzNjkzMzI0NDVhNzZm
|
10
|
+
Nzk5ZmY0MGY2NDI3ZjA2YjBhMDJlMzJiYzEzYjU0ZjgxNWExNDM0MDU3N2Iw
|
11
|
+
ZDJjZWI3NDAyMDQzNmIzNzM4ZTUxNDZmMzY2NzVjY2YyOWFiZGU=
|
12
12
|
data.tar.gz: !binary |-
|
13
|
-
|
14
|
-
|
15
|
-
|
13
|
+
ZTAzYjllZGVlNTBjMzZjZjEwOWJjZTI4ODM4YTE3OGYwNWE2ODY1NGNkNDAx
|
14
|
+
MzRiNDU2Y2YyMDcxODZkOGRmYzFkOGY2OWQwYTgxOTkyMWVjMmJhNWJmZjFj
|
15
|
+
YzYyYzhjY2E1NDUzYjEwZTMzZGVhMjE0MDQzNTczNWI4M2ZmN2M=
|
data/README.md
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
# Pug for Compass
|
2
2
|
|
3
|
-
A collection of Sass functions and mixins for use in Compass projects. It currently requires
|
3
|
+
A collection of Sass functions and mixins for use in Compass projects. It currently requires Compass `>= 1.0.0.rc.1`.
|
4
4
|
|
5
5
|
## Installation
|
6
6
|
|
@@ -8,7 +8,7 @@ Pug is distributed as a Ruby gem called `compass-pug`. You can install it with t
|
|
8
8
|
|
9
9
|
gem install compass-pug
|
10
10
|
|
11
|
-
Once the gem is installed, `require` it in your Compass project's config file:
|
11
|
+
Once the gem is installed, `require` it in your Compass project's config file (probably called `config.rb`):
|
12
12
|
|
13
13
|
require 'compass-pug'
|
14
14
|
|
@@ -18,17 +18,21 @@ And import the library itself in your Sass/SCSS code:
|
|
18
18
|
|
19
19
|
## What's Included
|
20
20
|
|
21
|
-
For complete details, including function/mixin parameters, view the `stylesheets/pug/_functions.scss` and `stylesheets/pug/_mixins.scss` source files. And take a look at `stylesheets/_pug.scss` for various overridable configuration variables (define your own value for any of these prior to importing Pug).
|
21
|
+
For complete details, including function/mixin parameters, view the `stylesheets/pug/_functions.scss` and `stylesheets/pug/_mixins.scss` source files. And take a look the Variables below (or at `stylesheets/_pug.scss`) for various overridable configuration variables (define your own value for any of these prior to importing Pug).
|
22
22
|
|
23
23
|
### Sass Mixins
|
24
24
|
|
25
|
+
* `pug-aligncenter()`: Sets `display:block`, `clear:both` and auto l/r margin to horizontally center an element.
|
26
|
+
* `pug-alignleft()`: Sets `display:inline`, `float:left` and applies some right margin based on the configured horizontal unit.
|
27
|
+
* `pug-alignright()`: Sets `display:inline`, `float:right` and applies some left margin based on the configured horizontal unit.
|
28
|
+
* `pug-clearfix()`: Clearfix. Alias for `pug-micro-clearfix()`.
|
25
29
|
* `pug-dark-bg-with-light-text()`: Quickly apply bg, text and link colors to a selector appropriate for a dark background with light text.
|
26
30
|
* `pug-light-bg-with-dark-text()`: Quickly apply bg, text and link colors to a selector appropriate for a light background with dark text.
|
27
31
|
* `pug-micro-clearfix()`: [Provides Nicolas Gallagher's Micro Clearfix](http://nicolasgallagher.com/micro-clearfix-hack/).
|
28
32
|
* `pug-placeholder-color()`: Generates cross-browser CSS (with selectors) for setting the color of input field placeholder text. Via [CSS Tricks](http://css-tricks.com/snippets/css/style-placeholder-text/).
|
29
33
|
* `pug-tab-size()`: Vendor-prefixed tab sizing. Use with elements such as `pre`.
|
30
34
|
* `pug-sr-only()`: Apply to an element to make it accessible only to screen readers. [Adapted from Bootstrap 3](http://getbootstrap.com/css/#helper-classes-screen-readers).
|
31
|
-
* `pug-sr-only-focusable()`: Applies (optionally) `pug-sr-only` and shows the element again when it's focused. [Adapted from Bootstrap 3](http://getbootstrap.com/css/#helper-classes-screen-readers).
|
35
|
+
* `pug-sr-only-focusable()`: Applies (optionally, and by default) `pug-sr-only()` and shows the element again when it's focused. [Adapted from Bootstrap 3](http://getbootstrap.com/css/#helper-classes-screen-readers).
|
32
36
|
|
33
37
|
### Sass Functions
|
34
38
|
|
@@ -36,3 +40,45 @@ For complete details, including function/mixin parameters, view the `stylesheets
|
|
36
40
|
* `pug-round-up-to-nearest-vertical-unit()`: Round a size up to the nearest factor of a vertical unit (or of a sub-unit of that vertical unit). Parameters must use the same unit of measurement (rem, px, etc).
|
37
41
|
* `pug-strip-units()`: Strip unit of measurement from a numeric value. Ex: `10px` becomes `10`.
|
38
42
|
* `pug-units-match()`: Determine whether two or more values use the same unit of measurement (such as px, rem, etc). Similar to the Sass comparable() function but requires exact match (such as mm and mm, but not cm and mm).
|
43
|
+
|
44
|
+
### Variables
|
45
|
+
|
46
|
+
Below are the variables and their default values defined in `stylesheets/_pug.scss`. You can override any or all of these in your code by declaring them yourself *before* you import Pug (omit the `!default` flag shown on the definitions below if you do that).
|
47
|
+
|
48
|
+
$pug-bg-color-light: #FFF !default;
|
49
|
+
$pug-bg-color-dark: #202020 !default;
|
50
|
+
|
51
|
+
// Darkish text colors used on light backgrounds.
|
52
|
+
$pug-text-color-dark: #202020 !default;
|
53
|
+
$pug-link-default-color-dark: #4183c4 !default;
|
54
|
+
$pug-link-visited-color-dark: $pug-link-default-color-dark !default;
|
55
|
+
$pug-link-hover-color-dark: lighten($pug-link-default-color-dark, 20%) !default;
|
56
|
+
|
57
|
+
// Lightish text colors used on dark backgrounds.
|
58
|
+
$pug-text-color-light: #FEFEFE !default;
|
59
|
+
$pug-link-default-color-light: #9DC7F5 !default;
|
60
|
+
$pug-link-visited-color-light: $pug-link-default-color-light !default;
|
61
|
+
$pug-link-hover-color-light: lighten($pug-link-default-color-light, 20%) !default;
|
62
|
+
|
63
|
+
// Tab size
|
64
|
+
$pug-tab-size: 2 !default;
|
65
|
+
|
66
|
+
// Vars related to vertical-rhythm.
|
67
|
+
$pug-vr-base-font-size: 16px !default;
|
68
|
+
$pug-vr-vertical-unit: 24px !default;
|
69
|
+
$pug-vr-preferred-division: 0.5 !default;
|
70
|
+
$pug-vr-line-height-minimum-difference-proportion: 0.25 !default;
|
71
|
+
|
72
|
+
// Vars related to horizontal rhythm (gridding).
|
73
|
+
$pug-hr-horizontal-unit: 10px !default;
|
74
|
+
|
75
|
+
|
76
|
+
## Development
|
77
|
+
|
78
|
+
### Generating a Release
|
79
|
+
|
80
|
+
* Update `README.md` with any new features or information required for usage
|
81
|
+
* Replace the list of variable definitions in `README.md` with the ones in `stylesheets/_pug.scss` to make sure they are in sync
|
82
|
+
* Update `s.version`, `s.date` and anything else that may need it in `compass-pug.gemspec`
|
83
|
+
* Run `gem build compass-pug.gemspec` in the root of the repository (this will generate a new `compass-pug-[VERSION].gem` file)
|
84
|
+
* Push that new file to `rubygems.org` with `gem push compass-pug-[VERSION].gem` (replace `[VERSION]` based on the actual name of the file)
|
data/stylesheets/_pug.scss
CHANGED
@@ -29,6 +29,9 @@ $pug-vr-vertical-unit: 24px !default;
|
|
29
29
|
$pug-vr-preferred-division: 0.5 !default;
|
30
30
|
$pug-vr-line-height-minimum-difference-proportion: 0.25 !default;
|
31
31
|
|
32
|
+
// Vars related to horizontal rhythm (gridding).
|
33
|
+
$pug-hr-horizontal-unit: 10px !default;
|
34
|
+
|
32
35
|
// Imports
|
33
36
|
// ---------------------------------------------------------------------------
|
34
37
|
@import "pug/functions";
|
@@ -1,5 +1,41 @@
|
|
1
1
|
/* Pug - Core Mixins */
|
2
2
|
|
3
|
+
/**
|
4
|
+
* Align center.
|
5
|
+
*/
|
6
|
+
@mixin pug-aligncenter {
|
7
|
+
clear: both;
|
8
|
+
display: block;
|
9
|
+
margin: 0 auto;
|
10
|
+
}
|
11
|
+
|
12
|
+
/**
|
13
|
+
* Align left.
|
14
|
+
*/
|
15
|
+
@mixin pug-alignleft {
|
16
|
+
display: inline;
|
17
|
+
float: left;
|
18
|
+
margin-right: $pug-hr-horizontal-unit;
|
19
|
+
}
|
20
|
+
|
21
|
+
/**
|
22
|
+
* Align right.
|
23
|
+
*/
|
24
|
+
@mixin pug-alignright {
|
25
|
+
display: inline;
|
26
|
+
float: right;
|
27
|
+
margin-left: $pug-hr-horizontal-unit;
|
28
|
+
}
|
29
|
+
|
30
|
+
/**
|
31
|
+
* Clearfix (alias for pug-micro-clearfix()).
|
32
|
+
*
|
33
|
+
* @see pug-micro-clearfix()
|
34
|
+
*/
|
35
|
+
@mixin pug-clearfix() {
|
36
|
+
@include pug-micro-clearfix();
|
37
|
+
}
|
38
|
+
|
3
39
|
/**
|
4
40
|
* Quickly apply appropriate styles to an element for having a dark background.
|
5
41
|
*
|
metadata
CHANGED
@@ -1,43 +1,29 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: compass-pug
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.5
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Andrew Kamm
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2014-
|
11
|
+
date: 2014-08-06 00:00:00.000000000 Z
|
12
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
13
|
- !ruby/object:Gem::Dependency
|
28
14
|
name: compass
|
29
15
|
requirement: !ruby/object:Gem::Requirement
|
30
16
|
requirements:
|
31
17
|
- - ! '>='
|
32
18
|
- !ruby/object:Gem::Version
|
33
|
-
version: 1.0.0.
|
19
|
+
version: 1.0.0.rc.1
|
34
20
|
type: :runtime
|
35
21
|
prerelease: false
|
36
22
|
version_requirements: !ruby/object:Gem::Requirement
|
37
23
|
requirements:
|
38
24
|
- - ! '>='
|
39
25
|
- !ruby/object:Gem::Version
|
40
|
-
version: 1.0.0.
|
26
|
+
version: 1.0.0.rc.1
|
41
27
|
description: a collection of mixins for compass
|
42
28
|
email: ak@kamm.co
|
43
29
|
executables: []
|