compass-pattern-primer 0.2.6 → 0.2.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +2 -1
- data/README.md +11 -13
- data/lib/compass-pattern-primer.rb +2 -2
- data/stylesheets/compass-pattern-primer/base/_forms.scss +1 -1
- data/stylesheets/compass-pattern-primer/partials/variables/base/_forms.scss +1 -0
- data/templates/project/manifest.rb +27 -27
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA512:
|
3
|
-
|
4
|
-
|
3
|
+
data.tar.gz: 98f466f0f904b87ef60bd2b7ce7f361b61f7b8604b481d3edefe6a9e47042934e6d30cc5852d6fc56d3ee422d38ea736dcaa07e1ab8a92fd9469a3467e7404b9
|
4
|
+
metadata.gz: caac415434592a67cb95930b666cb48d0f5d77cca68a68530b46d91d4f2cc034f9fd70a0154ef64dd99a6055577d40882295c665a9acbd144948c6077d4504a7
|
5
5
|
SHA1:
|
6
|
-
|
7
|
-
|
6
|
+
data.tar.gz: e64be830db644d3d93782328bc83f3c6d9809281
|
7
|
+
metadata.gz: 6c870c69d3e3d85c1ad8af93ea4eab61a5ef9a59
|
data/CHANGELOG.md
CHANGED
@@ -5,4 +5,5 @@
|
|
5
5
|
* **0.2.3** Fixed missing <html> tag on pattern-primer.html. Color scheme and modules are easier to opt out of in global.scss
|
6
6
|
* **0.2.4** Added MIT GPL-3 Licenses — thanks to Benjamin Fleischer (https://github.com/bf4) for the prompting
|
7
7
|
* **0.2.5** Fixed errors in time style in base/_tyopgraphy.scss
|
8
|
-
* **0.2.6** Forgot to update Changelog
|
8
|
+
* **0.2.6** Forgot to update Changelog
|
9
|
+
* **0.2.7** Added `$forms-input-width` variable
|
data/README.md
CHANGED
@@ -105,7 +105,6 @@ Or selectively, here's the full list you can select which parts:
|
|
105
105
|
@import "compass-pattern-primer/base/_buttons";
|
106
106
|
```
|
107
107
|
|
108
|
-
|
109
108
|
### Modules
|
110
109
|
Similarly the modules allow can be imported whole or selectively.
|
111
110
|
|
@@ -118,7 +117,7 @@ Or
|
|
118
117
|
@import "compass-pattern-primer/modules/_control";
|
119
118
|
@import "compass-pattern-primer/modules/_feedback";
|
120
119
|
@import "compass-pattern-primer/modules/_options";
|
121
|
-
@import "compass-pattern-primer/modules/_pagination";
|
120
|
+
@import "compass-pattern-primer/modules/_pagination";
|
122
121
|
```
|
123
122
|
Styles for the modules can be changed using **overrides** and extended to other elements using **extendables**.
|
124
123
|
|
@@ -136,19 +135,19 @@ In this example I am extending an `input` with the `id="reset"` to `%button-acti
|
|
136
135
|
|
137
136
|
```scss
|
138
137
|
input#reset {
|
139
|
-
@extend %button-active;
|
138
|
+
@extend %button-active;
|
140
139
|
}
|
141
140
|
```
|
142
141
|
#### Colors
|
143
142
|
Custom color guides can generated by altering the `$primary-color` variable in `partials/colors`. If you want to see this in action, the best option is to build a project using the SMACSS scaffolding. Color guides are created using [Color Schemer](https://github.com/Team-Sass/color-schemer) and can be viewed on the `pattern-primer.html` page.
|
144
143
|
|
145
|
-
Color Schemer is feature rich and allows you to generate color schemes using color theory schemes: mono, complement, triad, tetrad, analogic, accented-analogic. See [Color Schemer](https://github.com/Team-Sass/color-schemer) for more info.
|
144
|
+
Color Schemer is feature rich and allows you to generate color schemes using color theory schemes: mono, complement, triad, tetrad, analogic, accented-analogic. See [Color Schemer](https://github.com/Team-Sass/color-schemer) for more info.
|
146
145
|
|
147
146
|
The colors also take advantage of `tint-stack` and `shade-stack` to generate 6 (by default but can be extended) tints (mixed with white) or shades (mixed with black) of your colors. Documentation for these functions can be found in [Toolkit](https://github.com/Team-Sass/toolkit).
|
148
147
|
|
149
148
|
```scss
|
150
149
|
$primary-color: #57068c;
|
151
|
-
$black-value: #333;
|
150
|
+
$black-value: #333;
|
152
151
|
```
|
153
152
|
|
154
153
|
```scss
|
@@ -156,7 +155,7 @@ $black: tint-stack($black-value);
|
|
156
155
|
$primary: tint-stack(cs-primary());
|
157
156
|
$secondary: tint-stack(cs-secondary());
|
158
157
|
$tertiary: tint-stack(cs-tertiary());
|
159
|
-
$quadrary: tint-stack(cs-quadrary())
|
158
|
+
$quadrary: tint-stack(cs-quadrary())
|
160
159
|
```
|
161
160
|
|
162
161
|
The advantage of this is you can design your site using `tint-stack` variables. You can then easily adjust your colors by simply altering the `$primary-color` variable.
|
@@ -168,18 +167,17 @@ $link-visited-link-color: nth($primary, 2);
|
|
168
167
|
|
169
168
|
## Features to be added
|
170
169
|
#### More scaffolding options.
|
171
|
-
At the moment there's only one option to use my SMACSS scaffolding and a static html preview page. This works for some use cases but doesn't allow you to easily add patterns.
|
170
|
+
At the moment there's only one option to use my SMACSS scaffolding and a static html preview page. This works for some use cases but doesn't allow you to easily add patterns.
|
172
171
|
|
173
|
-
I intend to allow a scaffolding option that includes the original patterns and `index.php` file from Jeremy Keith's [Pattern Primer](https://github.com/adactio/Pattern-Primer) repo.
|
172
|
+
I intend to allow a scaffolding option that includes the original patterns and `index.php` file from Jeremy Keith's [Pattern Primer](https://github.com/adactio/Pattern-Primer) repo.
|
174
173
|
|
175
174
|
Another option could be to create a very basic scaffolding that doesn't use the SMACSS approach. So that you can use you own.
|
176
175
|
|
177
176
|
#### Use existing Compass Reset gems
|
178
|
-
I realized after the fact that all my reset's existed as compass gems. Doesn't seem like a good idea to duplicate code.
|
179
|
-
- [Meyer Reset](https://github.com/adamstac/meyer-reset)
|
180
|
-
- [Compass Normalize](https://github.com/ksmandersen/compass-normalize)
|
181
|
-
- [Compass Formalize](https://github.com/pengwynn/compass_formalize)
|
182
|
-
|
177
|
+
I realized after the fact that all my reset's existed as compass gems. Doesn't seem like a good idea to duplicate code.
|
178
|
+
- [Meyer Reset](https://github.com/adamstac/meyer-reset)
|
179
|
+
- [Compass Normalize](https://github.com/ksmandersen/compass-normalize)
|
180
|
+
- [Compass Formalize](https://github.com/pengwynn/compass_formalize)
|
183
181
|
|
184
182
|
|
185
183
|
#### ~~Simplify `bounding-box` mixin~~ DONE
|
@@ -18,8 +18,8 @@ Compass::Frameworks.register('compass-pattern-primer', :path => extension_path)
|
|
18
18
|
# a prerelease version
|
19
19
|
# Date is in the form of YYYY-MM-DD
|
20
20
|
module Compass_Pattern_Primer
|
21
|
-
VERSION = "0.2.
|
22
|
-
DATE = "2013-
|
21
|
+
VERSION = "0.2.7"
|
22
|
+
DATE = "2013-09-09"
|
23
23
|
end
|
24
24
|
|
25
25
|
# This is where any custom SassScript should be placed. The functions will be
|
@@ -5,34 +5,34 @@ description "Compass Pattern Primer is based on Adactio/Jeremy Keith's Pattern P
|
|
5
5
|
file 'global.scss', :like => :stylesheet, :media => 'screen, projection'
|
6
6
|
|
7
7
|
# Partials
|
8
|
-
file 'partials/_browsers.scss',
|
9
|
-
file 'partials/_colors.scss',
|
10
|
-
file 'partials/_extendables.scss',
|
11
|
-
file 'partials/_functions.scss',
|
12
|
-
file 'partials/_mixins.scss',
|
13
|
-
file 'partials/_variables.scss',
|
8
|
+
file 'partials/_browsers.scss', :like => :stylesheet, :to => 'partials/_browsers.scss'
|
9
|
+
file 'partials/_colors.scss', :like => :stylesheet, :to => 'partials/_colors.scss'
|
10
|
+
file 'partials/_extendables.scss', :like => :stylesheet, :to => 'partials/_extendables.scss'
|
11
|
+
file 'partials/_functions.scss', :like => :stylesheet, :to => 'partials/_functions.scss'
|
12
|
+
file 'partials/_mixins.scss', :like => :stylesheet, :to => 'partials/_mixins.scss'
|
13
|
+
file 'partials/_variables.scss', :like => :stylesheet, :to => 'partials/_variables.scss'
|
14
14
|
|
15
15
|
# Variables
|
16
|
-
file 'partials/variables/base/_page.scss',
|
17
|
-
file 'partials/variables/modules/_header.scss',
|
18
|
-
file 'partials/variables/modules/_footer.scss',
|
19
|
-
file 'partials/variables/layout/_breakpoints.scss',
|
20
|
-
file 'partials/variables/layout/_page.scss',
|
21
|
-
file 'partials/variables/state/_page.scss',
|
22
|
-
file 'partials/variables/state/_header.scss',
|
23
|
-
file 'partials/variables/state/_footer.scss',
|
24
|
-
file 'partials/variables/theme/_page.scss',
|
25
|
-
file 'partials/variables/theme/_overrides.scss',
|
16
|
+
file 'partials/variables/base/_page.scss', :like => :stylesheet, :to => 'partials/variables/base/_page.scss'
|
17
|
+
file 'partials/variables/modules/_header.scss', :like => :stylesheet, :to => 'partials/variables/modules/_header.scss'
|
18
|
+
file 'partials/variables/modules/_footer.scss', :like => :stylesheet, :to => 'partials/variables/modules/_footer.scss'
|
19
|
+
file 'partials/variables/layout/_breakpoints.scss', :like => :stylesheet, :to => 'partials/variables/layout/_breakpoints.scss'
|
20
|
+
file 'partials/variables/layout/_page.scss', :like => :stylesheet, :to => 'partials/variables/layout/_page.scss'
|
21
|
+
file 'partials/variables/state/_page.scss', :like => :stylesheet, :to => 'partials/variables/state/_page.scss'
|
22
|
+
file 'partials/variables/state/_header.scss', :like => :stylesheet, :to => 'partials/variables/state/_header.scss'
|
23
|
+
file 'partials/variables/state/_footer.scss', :like => :stylesheet, :to => 'partials/variables/state/_footer.scss'
|
24
|
+
file 'partials/variables/theme/_page.scss', :like => :stylesheet, :to => 'partials/variables/theme/_page.scss'
|
25
|
+
file 'partials/variables/theme/_overrides.scss', :like => :stylesheet, :to => 'partials/variables/theme/_overrides.scss'
|
26
26
|
|
27
27
|
# SMACSS
|
28
|
-
file 'base/_page.scss',
|
29
|
-
file 'modules/_header.scss',
|
30
|
-
file 'modules/_footer.scss',
|
31
|
-
file 'layout/_page.scss',
|
32
|
-
file 'state/_page.scss',
|
33
|
-
file 'state/_header.scss',
|
34
|
-
file 'state/_footer.scss',
|
35
|
-
file 'theme/_page.scss',
|
28
|
+
file 'base/_page.scss', :like => :stylesheet, :to => 'base/_page.scss'
|
29
|
+
file 'modules/_header.scss', :like => :stylesheet, :to => 'modules/_header.scss'
|
30
|
+
file 'modules/_footer.scss', :like => :stylesheet, :to => 'modules/_footer.scss'
|
31
|
+
file 'layout/_page.scss', :like => :stylesheet, :to => 'layout/_page.scss'
|
32
|
+
file 'state/_page.scss', :like => :stylesheet, :to => 'state/_page.scss'
|
33
|
+
file 'state/_header.scss', :like => :stylesheet, :to => 'state/_header.scss'
|
34
|
+
file 'state/_footer.scss', :like => :stylesheet, :to => 'state/_footer.scss'
|
35
|
+
file 'theme/_page.scss', :like => :stylesheet, :to => 'theme/_page.scss'
|
36
36
|
|
37
37
|
# Javascript Import
|
38
38
|
# file 'scripts.js', :like => :javascript, :to => 'scripts.js'
|
@@ -45,13 +45,13 @@ file 'pattern-primer.html', :like => :html, :to => "pattern-primer.html"
|
|
45
45
|
|
46
46
|
# Compass Extension Help
|
47
47
|
help %Q{
|
48
|
-
The best place for help is to read the documentation in Github: https://github.com/alienresident/compass-pattern-primer
|
48
|
+
The best place for help is to read the documentation in Github: https://github.com/alienresident/compass-pattern-primer
|
49
49
|
}
|
50
50
|
|
51
51
|
# Compass Extension Welcome Message
|
52
52
|
# Users will see this when they create a new project using this template.
|
53
53
|
welcome_message %Q{
|
54
|
-
Welcome to Compass Pattern Primer!
|
54
|
+
Welcome to Compass Pattern Primer!
|
55
55
|
Documentation: https://github.com/alienresident/compass-pattern-primer
|
56
|
-
Contact: mark@alienresident.net
|
56
|
+
Contact: mark@alienresident.net
|
57
57
|
}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: compass-pattern-primer
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.2.
|
4
|
+
version: 0.2.7
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Mark Reilly
|
@@ -9,7 +9,7 @@ autorequire:
|
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
11
|
|
12
|
-
date: 2013-
|
12
|
+
date: 2013-09-09 00:00:00 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: sass
|