compass-pattern-primer 0.4.beta → 0.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +5 -5
- data/README.md +22 -25
- data/lib/compass-pattern-primer.rb +2 -2
- data/templates/project/manifest.rb +1 -0
- data/templates/shared/patterns/00_a_header_toc.html +7 -0
- data/templates/shared/patterns/01_a_header.html +1 -1
- data/templates/shared/patterns/02_a_header.html +1 -1
- data/templates/shared/patterns/03_a_header.html +1 -1
- data/templates/shared/patterns/04_a_header.html +1 -1
- data/templates/shared/sass/_config-adactio.scss +54 -43
- data/templates/shared/sass/_config.scss +63 -52
- data/templates/shared/sass/base/buttons/_buttons_variables.scss +8 -1
- data/templates/shared/sass/base/forms/_forms_variables.scss +7 -0
- data/templates/shared/sass/base/links/_links_variables.scss +8 -0
- data/templates/shared/sass/base/page/_page_variables.scss +8 -1
- data/templates/shared/sass/base/typography/_typography.scss +7 -0
- data/templates/shared/sass/base/typography/_typography_variables.scss +7 -0
- data/templates/shared/sass/global-adactio.scss +1 -3
- data/templates/shared/sass/global.scss +2 -6
- data/templates/shared/sass/modules/controls/_controls_variables.scss +7 -0
- data/templates/shared/sass/modules/feedback/_feedback_variables.scss +17 -10
- data/templates/shared/sass/modules/options/_options_variables.scss +7 -0
- data/templates/shared/sass/modules/pagination/_pagination_extendables.scss +2 -0
- data/templates/shared/sass/modules/pagination/_pagination_variables.scss +8 -1
- data/templates/shared/sass/pattern-primer-static.scss +2 -0
- data/templates/shared/sass/pattern-primer.scss +11 -1
- data/templates/static/manifest.rb +1 -1
- metadata +3 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
|
-
SHA512:
|
|
3
|
-
metadata.gz: 61319d807f6764e5db0ddd72b8df8bcadafc710db87764be33f5d065aa13a9ecc4bb0a4cb5c4a3c341fff65605c17b3d2855804323da452364df8c5272455af6
|
|
4
|
-
data.tar.gz: 3b5ed5ac6dad4033532079cffb8acca9a1fbf74fdd585e6ce93c28406c6eafbb9401c0a9e88f8d26f1b9bb32d6542578ee785ea6d78b75c430a3d55f9cb97070
|
|
5
2
|
SHA1:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: bf8d12bbfb3792687b6c6e05d0d707844fd104c2
|
|
4
|
+
data.tar.gz: 56d2b5339490ada67e8ce60172430d13dfc3890e
|
|
5
|
+
SHA512:
|
|
6
|
+
metadata.gz: 21b2fef2769b623397ed8ae6a4f00f52cee9ce88aec12a3ed8e336f7b503c96dd66f785bb1d6b0d701149a85d1a3e7dc46089d36ca9d996e685b08fa4f10596a
|
|
7
|
+
data.tar.gz: 1194d120b55705e0a706d313dc876891b2424b54baaf86f2e48080608222ad65c1cfee85bd5c67652944ec593146d3df54f8c75e0ea45771a48f5fb97f30d3e2
|
data/README.md
CHANGED
|
@@ -42,7 +42,7 @@ This creates a SMACSS style scaffolding for your project. It includes an `index.
|
|
|
42
42
|
```bash
|
|
43
43
|
compass create <MyProject> -r compass-pattern-primer -u compass-pattern-primer/static
|
|
44
44
|
```
|
|
45
|
-
This creates a SMACSS style scaffolding for your project. Instead of the `index.php` it includes `
|
|
45
|
+
This creates a SMACSS style scaffolding for your project. Instead of the `index.php` it includes `index.html` a static html page where you can preview the style guide. You edit the html to add your own patterns. All the `base` and `modules` files are imported into `global.scss` which will be the main CSS file. It also creates a `pattern-primer.scss` which imports `global.scss` and adds a color guide viewable in your `index.php`. The color guide adds a lot of CSS that has no business being in the production site but is useful for the style guide.
|
|
46
46
|
|
|
47
47
|
##### Adactio's Pattern Primer (PHP)
|
|
48
48
|
|
|
@@ -142,42 +142,39 @@ __Adactio Scaffold__
|
|
|
142
142
|
The styles will be in your `sass` folder
|
|
143
143
|
|
|
144
144
|
```bash
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
145
|
+
sass/
|
|
146
|
+
buttons/
|
|
147
|
+
forms/
|
|
148
|
+
links/
|
|
149
|
+
page/
|
|
150
|
+
search/
|
|
151
|
+
typography/
|
|
152
152
|
```
|
|
153
153
|
|
|
154
154
|
### Modules
|
|
155
155
|
Similarly the modules are in different folders depending on your scaffolding setup.
|
|
156
156
|
|
|
157
157
|
__SMACSS Scaffold__
|
|
158
|
-
The styles will be in your `sass/
|
|
159
|
-
|
|
158
|
+
The styles will be in your `sass/modules` folder
|
|
159
|
+
|
|
160
|
+
```bash
|
|
160
161
|
sass/
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
search/
|
|
167
|
-
typography/
|
|
162
|
+
modules/
|
|
163
|
+
controls/
|
|
164
|
+
feedback/
|
|
165
|
+
options/
|
|
166
|
+
pagination/
|
|
168
167
|
```
|
|
169
168
|
|
|
170
169
|
__Adactio Scaffold__
|
|
171
170
|
The styles will be in your `sass` folder
|
|
172
171
|
|
|
173
172
|
```bash
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
search/
|
|
180
|
-
typography/
|
|
173
|
+
sass/
|
|
174
|
+
controls/
|
|
175
|
+
feedback/
|
|
176
|
+
options/
|
|
177
|
+
pagination/
|
|
181
178
|
```
|
|
182
179
|
Each base and module folder will have a `_basename.scss` and a `_basename_variables.scss` file. It may also have a `_basename_mixins.scss` and a `_basename_extendables.scss`
|
|
183
180
|
|
|
@@ -209,7 +206,7 @@ input#reset {
|
|
|
209
206
|
}
|
|
210
207
|
```
|
|
211
208
|
#### Colors
|
|
212
|
-
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 on the `index.php` (default) or `
|
|
209
|
+
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 on the `index.php` (default) or `index.html` (static) page.
|
|
213
210
|
|
|
214
211
|
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.
|
|
215
212
|
|
|
@@ -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.4
|
|
22
|
-
DATE = "2013-10-
|
|
21
|
+
VERSION = "0.4"
|
|
22
|
+
DATE = "2013-10-30"
|
|
23
23
|
end
|
|
24
24
|
|
|
25
25
|
# This is where any custom SassScript should be placed. The functions will be
|
|
@@ -83,6 +83,7 @@ file "../shared/patterns/pagination-first.html" , :like => :html, :to => "patter
|
|
|
83
83
|
file "../shared/patterns/pagination-last.html" , :like => :html, :to => "patterns/03_pagination-last.html"
|
|
84
84
|
file "../shared/patterns/pagination.html" , :like => :html, :to => "patterns/03_pagination.html"
|
|
85
85
|
file "../shared/patterns/text-new.html" , :like => :html, :to => "patterns/01_text.html"
|
|
86
|
+
file "../shared/patterns/00_a_header_toc.html" , :like => :html, :to => "patterns/00_a_header_toc.html"
|
|
86
87
|
file "../shared/patterns/01_a_header.html" , :like => :html, :to => "patterns/01_a_header.html"
|
|
87
88
|
file "../shared/patterns/02_a_header.html" , :like => :html, :to => "patterns/02_a_header.html"
|
|
88
89
|
file "../shared/patterns/03_a_header.html" , :like => :html, :to => "patterns/03_a_header.html"
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
<h1 id="top">Style Guide</h1>
|
|
2
|
+
<ul class="toc">
|
|
3
|
+
<li class="toc list"><a href="#typography" class="toc list item">Typography Elements</a></li>
|
|
4
|
+
<li class="toc list"><a href="#forms" class="toc list item">Form Elements</a></li>
|
|
5
|
+
<li class="toc list"><a href="#messaging" class="toc list item">Messaging and Pagers</a></li>
|
|
6
|
+
<li class="toc list"><a href="#color-guide" class="toc list item">Color Guide</a></li>
|
|
7
|
+
</ul>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<h3>
|
|
1
|
+
<h3>Typography Elements<a id="typography" class="toc link" href="#top">Top</a></h3>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<h3>
|
|
1
|
+
<h3>Form Elements<a id="forms" class="toc link" href="#top">Top</a></h3>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<h3>Messaging and Pagers</h3>
|
|
1
|
+
<h3>Messaging and Pagers<a id="messaging" class="toc link" href="#top">Top</a></h3>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<h3>Color Guide</h3>
|
|
1
|
+
<h3>Color Guide<a id="color-guide" class="toc link" href="#top">Top</a></h3>
|
|
@@ -4,62 +4,73 @@
|
|
|
4
4
|
|
|
5
5
|
// Some example overrides
|
|
6
6
|
|
|
7
|
-
//
|
|
8
|
-
//
|
|
9
|
-
//
|
|
10
|
-
//
|
|
11
|
-
//
|
|
7
|
+
// // Fonts
|
|
8
|
+
// $body-font-family: Calibri, 'Helvetica Neue', Arial, sans-serif;
|
|
9
|
+
// $secondary-font: $body-font-family;
|
|
10
|
+
// $header-font-family: $body-font-family;
|
|
11
|
+
// $blockquote-font-family: $body-font-family;
|
|
12
12
|
|
|
13
13
|
// // Colors
|
|
14
|
-
//
|
|
14
|
+
// $primary-color: #369;
|
|
15
15
|
|
|
16
16
|
// // body
|
|
17
|
-
//
|
|
18
|
-
//
|
|
19
|
-
//
|
|
17
|
+
// $body-background-color: nth($black , 6);
|
|
18
|
+
// $body-background-rgba: rgba($body-background-color, 1);
|
|
19
|
+
// $body-border-width: false;
|
|
20
20
|
//
|
|
21
|
-
//
|
|
22
|
-
//
|
|
21
|
+
// $body-margin: 0;
|
|
22
|
+
// $body-padding: 0;
|
|
23
23
|
//
|
|
24
|
-
//
|
|
25
|
-
//
|
|
24
|
+
// $html-border-width: false;
|
|
25
|
+
// $html-background-color: lighten($body-background-color, 10%);
|
|
26
26
|
|
|
27
27
|
// // Links
|
|
28
|
-
//
|
|
29
|
-
//
|
|
30
|
-
//
|
|
28
|
+
// $link-color: nth($primary, 1);
|
|
29
|
+
// $link-text-decoration: none;
|
|
30
|
+
// $link-border-width: false;
|
|
31
31
|
//
|
|
32
|
-
|
|
33
|
-
//
|
|
34
|
-
//
|
|
35
|
-
|
|
36
|
-
//
|
|
37
|
-
//
|
|
38
|
-
//
|
|
39
|
-
|
|
40
|
-
//
|
|
32
|
+
// // Visited
|
|
33
|
+
// $link-visited-link-color: nth($primary, 2);
|
|
34
|
+
// $link-visited-border-width: $link-border-width;
|
|
35
|
+
// // Hover
|
|
36
|
+
// $link-hover-link-color: lighten($link-color, 10%);
|
|
37
|
+
// $link-text-decoration: none;
|
|
38
|
+
// $link-hover-border-width: $link-border-width;
|
|
39
|
+
// // Active
|
|
40
|
+
// $link-active-link-color: $link-color;
|
|
41
41
|
//
|
|
42
42
|
//
|
|
43
|
-
//
|
|
44
|
-
//
|
|
45
|
-
//
|
|
46
|
-
//
|
|
43
|
+
// $h1-margin-pos: none;
|
|
44
|
+
// $h1-border-width: false;
|
|
45
|
+
// $h2-border-width: false;
|
|
46
|
+
// $h3-border-width: false;
|
|
47
47
|
//
|
|
48
|
-
//
|
|
49
|
-
//
|
|
50
|
-
//
|
|
51
|
-
//
|
|
52
|
-
//
|
|
48
|
+
// $button-padding: 0.33em .66em;
|
|
49
|
+
// $button-border-color: nth($black, 3);
|
|
50
|
+
// $button-border-radius: .5em;
|
|
51
|
+
// $button-color: nth($black, 1);
|
|
52
|
+
// $button-text-shadow: 0 -1px 0 rgba(#fff, 0.25);
|
|
53
53
|
//
|
|
54
|
-
//
|
|
55
|
-
//
|
|
54
|
+
// $button-gradient-stop-1: nth($black, 6);
|
|
55
|
+
// $button-gradient-stop-2: nth($black, 5);
|
|
56
56
|
//
|
|
57
|
-
//
|
|
58
|
-
//
|
|
59
|
-
//
|
|
57
|
+
// $button-hover-color: $button-color;
|
|
58
|
+
// $button-hover-gradient-stop-1: nth($black, 4);
|
|
59
|
+
// $button-hover-gradient-stop-2: nth($black, 5);
|
|
60
60
|
//
|
|
61
|
-
//
|
|
62
|
-
//
|
|
63
|
-
//
|
|
61
|
+
// $button-active-color: $button-color;
|
|
62
|
+
// $button-active-gradient-stop-1: nth($black, 3);
|
|
63
|
+
// $button-active-gradient-stop-2: nth($black, 4);
|
|
64
64
|
//
|
|
65
|
-
//
|
|
65
|
+
// $forms-input-width: auto;
|
|
66
|
+
|
|
67
|
+
// $feedback-background: #d9edf7;
|
|
68
|
+
// $feedback-margin: 1em;
|
|
69
|
+
// $feedback-color: #3A87AD;
|
|
70
|
+
// $feedback-border-width: false;
|
|
71
|
+
// $feedback-border-color: #bce8f1;
|
|
72
|
+
// $feedback-border-radius: 0.5em;
|
|
73
|
+
// /// Feedback Error
|
|
74
|
+
// $feedback-error-color: #B94A48;
|
|
75
|
+
// /// Feedback Warning
|
|
76
|
+
// $feedback-warning-color: #947D72;
|
|
@@ -4,70 +4,81 @@
|
|
|
4
4
|
|
|
5
5
|
// Some example overrides
|
|
6
6
|
|
|
7
|
-
//
|
|
8
|
-
//
|
|
9
|
-
//
|
|
10
|
-
//
|
|
11
|
-
//
|
|
7
|
+
// // Fonts
|
|
8
|
+
// $body-font-family: Calibri, 'Helvetica Neue', Arial, sans-serif;
|
|
9
|
+
// $secondary-font: $body-font-family;
|
|
10
|
+
// $header-font-family: $body-font-family;
|
|
11
|
+
// $blockquote-font-family: $body-font-family;
|
|
12
12
|
|
|
13
|
-
//
|
|
14
|
-
//
|
|
13
|
+
// // Colors
|
|
14
|
+
// $primary-color: #369;
|
|
15
15
|
|
|
16
|
-
//
|
|
17
|
-
//
|
|
18
|
-
//
|
|
19
|
-
//
|
|
16
|
+
// // body
|
|
17
|
+
// $body-background-color: nth($black , 6);
|
|
18
|
+
// $body-background-rgba: rgba($body-background-color, 1);
|
|
19
|
+
// $body-border-width: false;
|
|
20
20
|
//
|
|
21
|
-
//
|
|
22
|
-
//
|
|
21
|
+
// $body-margin: 0;
|
|
22
|
+
// $body-padding: 0;
|
|
23
23
|
//
|
|
24
|
-
//
|
|
25
|
-
//
|
|
24
|
+
// $html-border-width: false;
|
|
25
|
+
// $html-background-color: lighten($body-background-color, 10%);
|
|
26
26
|
|
|
27
|
-
//
|
|
28
|
-
//
|
|
29
|
-
//
|
|
30
|
-
//
|
|
27
|
+
// // Links
|
|
28
|
+
// $link-color: nth($primary, 1);
|
|
29
|
+
// $link-text-decoration: none;
|
|
30
|
+
// $link-border-width: false;
|
|
31
31
|
//
|
|
32
|
-
|
|
33
|
-
//
|
|
34
|
-
//
|
|
35
|
-
|
|
36
|
-
//
|
|
37
|
-
//
|
|
38
|
-
//
|
|
39
|
-
|
|
40
|
-
//
|
|
32
|
+
// // Visited
|
|
33
|
+
// $link-visited-link-color: nth($primary, 2);
|
|
34
|
+
// $link-visited-border-width: $link-border-width;
|
|
35
|
+
// // Hover
|
|
36
|
+
// $link-hover-link-color: lighten($link-color, 10%);
|
|
37
|
+
// $link-text-decoration: none;
|
|
38
|
+
// $link-hover-border-width: $link-border-width;
|
|
39
|
+
// // Active
|
|
40
|
+
// $link-active-link-color: $link-color;
|
|
41
41
|
//
|
|
42
42
|
//
|
|
43
|
-
//
|
|
44
|
-
//
|
|
45
|
-
//
|
|
46
|
-
//
|
|
43
|
+
// $h1-margin-pos: none;
|
|
44
|
+
// $h1-border-width: false;
|
|
45
|
+
// $h2-border-width: false;
|
|
46
|
+
// $h3-border-width: false;
|
|
47
47
|
//
|
|
48
|
-
//
|
|
49
|
-
//
|
|
50
|
-
//
|
|
51
|
-
//
|
|
52
|
-
//
|
|
48
|
+
// $button-padding: 0.33em .66em;
|
|
49
|
+
// $button-border-color: nth($black, 3);
|
|
50
|
+
// $button-border-radius: .5em;
|
|
51
|
+
// $button-color: nth($black, 1);
|
|
52
|
+
// $button-text-shadow: 0 -1px 0 rgba(#fff, 0.25);
|
|
53
53
|
//
|
|
54
|
-
//
|
|
55
|
-
//
|
|
54
|
+
// $button-gradient-stop-1: nth($black, 6);
|
|
55
|
+
// $button-gradient-stop-2: nth($black, 5);
|
|
56
56
|
//
|
|
57
|
-
//
|
|
58
|
-
//
|
|
59
|
-
//
|
|
57
|
+
// $button-hover-color: $button-color;
|
|
58
|
+
// $button-hover-gradient-stop-1: nth($black, 4);
|
|
59
|
+
// $button-hover-gradient-stop-2: nth($black, 5);
|
|
60
60
|
//
|
|
61
|
-
//
|
|
62
|
-
//
|
|
63
|
-
//
|
|
61
|
+
// $button-active-color: $button-color;
|
|
62
|
+
// $button-active-gradient-stop-1: nth($black, 3);
|
|
63
|
+
// $button-active-gradient-stop-2: nth($black, 4);
|
|
64
64
|
//
|
|
65
|
-
//
|
|
66
|
-
//
|
|
65
|
+
// $button-action-gradient-stop-1: nth($primary, 2);
|
|
66
|
+
// $button-action-gradient-stop-2: nth($primary, 1);
|
|
67
67
|
//
|
|
68
|
-
//
|
|
69
|
-
//
|
|
70
|
-
//
|
|
71
|
-
//
|
|
68
|
+
// $button-action-hover-gradient-stop-1: nth($primary, 1);
|
|
69
|
+
// $button-action-hover-gradient-stop-2: nth($primary, 2);
|
|
70
|
+
// $button-action-active-gradient-stop-1: darken(nth($primary, 1), 20%);
|
|
71
|
+
// $button-action-active-gradient-stop-2: nth($primary, 1);
|
|
72
72
|
//
|
|
73
|
-
//
|
|
73
|
+
// $forms-input-width: auto;
|
|
74
|
+
|
|
75
|
+
// $feedback-background: #d9edf7;
|
|
76
|
+
// $feedback-margin: 1em;
|
|
77
|
+
// $feedback-color: #3A87AD;
|
|
78
|
+
// $feedback-border-width: false;
|
|
79
|
+
// $feedback-border-color: #bce8f1;
|
|
80
|
+
// $feedback-border-radius: 0.5em;
|
|
81
|
+
// /// Feedback Error
|
|
82
|
+
// $feedback-error-color: #B94A48;
|
|
83
|
+
// /// Feedback Warning
|
|
84
|
+
// $feedback-warning-color: #947D72;
|
|
@@ -2,10 +2,17 @@
|
|
|
2
2
|
// VARIABLES: For Base styles
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
5
12
|
/// Buttons
|
|
6
13
|
$button-font-family: $secondary-font !default;
|
|
7
14
|
$button-padding: 0.5em 1em !default;
|
|
8
|
-
$button-border-width:
|
|
15
|
+
$button-border-width: 1px !default;
|
|
9
16
|
$button-border-style: solid !default;
|
|
10
17
|
$button-border-color: #666 !default;
|
|
11
18
|
$button-border-radius: 1em !default;
|
|
@@ -2,6 +2,13 @@
|
|
|
2
2
|
// VARIABLES: For Base styles
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
5
12
|
// Forms _forms.scss
|
|
6
13
|
$forms-input-width: 100% !default;
|
|
7
14
|
$forms-background-color: #fff !default;
|
|
@@ -2,6 +2,14 @@
|
|
|
2
2
|
// VARIABLES: For Base styles
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
12
|
+
// Links
|
|
5
13
|
$link-color: #369 !default;
|
|
6
14
|
$link-text-decoration: none !default;
|
|
7
15
|
$link-border-width: 0 0 1px 0 !default;
|
|
@@ -2,7 +2,14 @@
|
|
|
2
2
|
// VARIABLES: For Base styles
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
12
|
+
// Typography
|
|
6
13
|
$body-font-family: Palatino, Cambria, Georgia, serif !default;
|
|
7
14
|
$secondary-font: Calibri, 'Helvetica Neue', Arial, sans-serif !default;
|
|
8
15
|
$header-font-family: $body-font-family !default;
|
|
@@ -73,6 +73,13 @@ hr {
|
|
|
73
73
|
p, ul, ol, hr, table, form, fieldset {
|
|
74
74
|
@include margin-padding(margin, $element-margin);
|
|
75
75
|
}
|
|
76
|
+
// removed by Meyer reset! why?
|
|
77
|
+
ol {
|
|
78
|
+
list-style-type: decimal;
|
|
79
|
+
}
|
|
80
|
+
ul {
|
|
81
|
+
list-style-type: disc;
|
|
82
|
+
}
|
|
76
83
|
li {
|
|
77
84
|
list-style-position: $li-list-style-position;
|
|
78
85
|
@include margin-padding(margin, $li-margin, $li-margin-pos);
|
|
@@ -19,9 +19,7 @@
|
|
|
19
19
|
// @import "compass-pattern-primer/reset/libraries/_formalize";
|
|
20
20
|
/* @end Reset */
|
|
21
21
|
|
|
22
|
-
@import "compass-pattern-primer/partials
|
|
23
|
-
@import "compass-pattern-primer/partials/_extendables";
|
|
24
|
-
@import "compass-pattern-primer/partials/_functions";
|
|
22
|
+
@import "compass-pattern-primer/partials";
|
|
25
23
|
|
|
26
24
|
@import "_config";
|
|
27
25
|
|
|
@@ -9,11 +9,7 @@
|
|
|
9
9
|
@import "partials/_mixins";
|
|
10
10
|
@import "partials/_colors";
|
|
11
11
|
|
|
12
|
-
@import "compass-pattern-primer
|
|
13
|
-
|
|
14
|
-
@import "compass-pattern-primer/partials/_mixins";
|
|
15
|
-
@import "compass-pattern-primer/partials/_extendables";
|
|
16
|
-
@import "compass-pattern-primer/partials/_functions";
|
|
12
|
+
@import "compass-pattern-primer";
|
|
17
13
|
|
|
18
14
|
@import "_config";
|
|
19
15
|
|
|
@@ -24,7 +20,7 @@
|
|
|
24
20
|
@import "base/buttons/_buttons";
|
|
25
21
|
@import "base/search/_search";
|
|
26
22
|
|
|
27
|
-
// optional module imports.
|
|
23
|
+
// optional module imports. Comment out or remove ones you don't use
|
|
28
24
|
@import "modules/pagination/_pagination";
|
|
29
25
|
@import "modules/controls/_controls";
|
|
30
26
|
@import "modules/feedback/_feedback";
|
|
@@ -2,6 +2,13 @@
|
|
|
2
2
|
// VARIABLES: For Modules
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
5
12
|
// Controls
|
|
6
13
|
$controls-font-family: $secondary-font !default;
|
|
7
14
|
$controls-font-size: 1.5em !default;
|
|
@@ -2,24 +2,31 @@
|
|
|
2
2
|
// VARIABLES: For Modules
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
5
12
|
// Feedback
|
|
6
|
-
$feedback-background: #
|
|
13
|
+
$feedback-background: #ffffcc !default;
|
|
7
14
|
$feedback-padding: 0.125em 1em !default;
|
|
8
|
-
$feedback-margin: 1em !default;
|
|
9
|
-
$feedback-color:
|
|
10
|
-
$feedback-border-width:
|
|
15
|
+
$feedback-margin: 1em 0 !default;
|
|
16
|
+
$feedback-color: inherit !default;
|
|
17
|
+
$feedback-border-width: 0.125em 0 0 0 !default;
|
|
11
18
|
$feedback-border-style: solid !default;
|
|
12
|
-
$feedback-border-color: #
|
|
13
|
-
$feedback-border-radius: 0.
|
|
19
|
+
$feedback-border-color: #cccc99 !default;
|
|
20
|
+
$feedback-border-radius: 0.25em !default;
|
|
14
21
|
$feedback-a-font-bold: true !default; // bold
|
|
15
22
|
$feedback-a-font-italic: false !default;
|
|
16
23
|
$feedback-a-font-uppercase: false !default;
|
|
17
24
|
$feedback-a-font-variant: false !default;
|
|
18
25
|
/// Feedback Error
|
|
19
|
-
$feedback-error-background: #
|
|
20
|
-
$feedback-error-color:
|
|
21
|
-
$feedback-error-border-color: #
|
|
26
|
+
$feedback-error-background: #ffcccc !default;
|
|
27
|
+
$feedback-error-color: inherit !default;
|
|
28
|
+
$feedback-error-border-color: #cc9999 !default;
|
|
22
29
|
/// Feedback Warning
|
|
23
30
|
$feedback-warning-background: #FFF7BD !default;
|
|
24
|
-
$feedback-warning-color:
|
|
31
|
+
$feedback-warning-color: inherit !default;
|
|
25
32
|
$feedback-warning-border-color: #947D72 !default;
|
|
@@ -2,6 +2,13 @@
|
|
|
2
2
|
// VARIABLES: For Modules
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
5
12
|
// Options
|
|
6
13
|
$options-border-width: 1px 0 0 0!default;
|
|
7
14
|
$options-border-style: solid !default;
|
|
@@ -26,10 +26,12 @@
|
|
|
26
26
|
&[href]:focus {
|
|
27
27
|
color: $pagination-link-hover-color;
|
|
28
28
|
background-color: $pagination-link-hover-background-color;
|
|
29
|
+
@include border-outline(border, $pagination-a-border-width, $pagination-a-border-style, $pagination-a-border-color);
|
|
29
30
|
}
|
|
30
31
|
&:active {
|
|
31
32
|
color: $pagination-link-active-color;
|
|
32
33
|
background-color: $pagination-link-active-background-color;
|
|
34
|
+
@include border-outline(border, $pagination-a-border-width, $pagination-a-border-style, $pagination-a-border-color);
|
|
33
35
|
}
|
|
34
36
|
}
|
|
35
37
|
}
|
|
@@ -2,6 +2,13 @@
|
|
|
2
2
|
// VARIABLES: For Modules
|
|
3
3
|
//////////////////////////////
|
|
4
4
|
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
//////////////////////////////
|
|
9
|
+
// DEFAULT VARIABLES
|
|
10
|
+
//////////////////////////////
|
|
11
|
+
|
|
5
12
|
// Pagination
|
|
6
13
|
$pagination-font-family: $secondary-font !default;
|
|
7
14
|
$pagination-text-indent: 0 !default;
|
|
@@ -15,7 +22,7 @@ $pagination-a-padding: 0.5em 1em !default;
|
|
|
15
22
|
$pagination-a-margin: 0.1em !default;
|
|
16
23
|
$pagination-a-border-radius: 0.25em !default;
|
|
17
24
|
$pagination-a-line-height: 1em !default;
|
|
18
|
-
$pagination-a-border-width:
|
|
25
|
+
$pagination-a-border-width: 1px !default;
|
|
19
26
|
$pagination-a-border-style: solid !default;
|
|
20
27
|
$pagination-a-border-color: #666 !default;
|
|
21
28
|
/// Pagination links
|
|
@@ -52,7 +52,7 @@ file '../shared/sass/theme/page/_page.scss', :like => :stylesheet, :to => 'theme
|
|
|
52
52
|
# file 'scripts.js', :like => :javascript, :to => 'scripts.js'
|
|
53
53
|
|
|
54
54
|
# HTML Import
|
|
55
|
-
file 'pattern-primer.html', :like => :html, :to => "
|
|
55
|
+
file 'pattern-primer.html', :like => :html, :to => "index.html"
|
|
56
56
|
|
|
57
57
|
# General File Import
|
|
58
58
|
# file 'README.md', :to => "README.md"
|
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.4
|
|
4
|
+
version: "0.4"
|
|
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-10-
|
|
12
|
+
date: 2013-10-30 00:00:00 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: sass
|
|
@@ -98,6 +98,7 @@ files:
|
|
|
98
98
|
- templates/adactio/manifest.rb
|
|
99
99
|
- templates/project/config.rb
|
|
100
100
|
- templates/project/manifest.rb
|
|
101
|
+
- templates/shared/patterns/00_a_header_toc.html
|
|
101
102
|
- templates/shared/patterns/01_a_header.html
|
|
102
103
|
- templates/shared/patterns/02_a_header.html
|
|
103
104
|
- templates/shared/patterns/03_a_header.html
|