compass-pattern-primer 0.4.beta → 0.4
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 +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
|