staple 0.4.2 → 0.4.3

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.
Files changed (36) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +8 -7
  3. data/source/styles/colors/themes/default.theme +8 -0
  4. data/source/styles/colors/themes/flatland.theme +10 -2
  5. data/source/styles/colors/themes/peace.theme +8 -0
  6. data/source/styles/colors/themes/plastic.theme +8 -3
  7. data/source/styles/staple/buttons.scss +1 -0
  8. data/source/styles/staple/colors.scss +6 -1
  9. data/source/styles/staple/init/overrides.scss +19 -18
  10. data/source/styles/staple/typography.scss +4 -9
  11. data/source/styles/typography/droid-serif-import.scss +1 -0
  12. data/source/styles/typography/droid-serif.typeface +1 -0
  13. data/source/styles/typography/gloria-import.scss +1 -0
  14. data/source/styles/typography/gloria.typeface +1 -0
  15. data/source/styles/typography/inconsolata-import.scss +1 -0
  16. data/source/styles/typography/inconsolata.typeface +1 -0
  17. data/source/styles/typography/lato-import.scss +1 -0
  18. data/source/styles/typography/lato.typeface +1 -0
  19. data/source/styles/typography/open-sans-import.scss +1 -0
  20. data/source/styles/typography/open-sans.typeface +1 -0
  21. data/source/styles/typography/oswald-import.scss +1 -0
  22. data/source/styles/typography/oswald.typeface +1 -0
  23. data/source/styles/typography/oxygen-import.scss +1 -0
  24. data/source/styles/typography/oxygen.typeface +1 -0
  25. data/source/styles/typography/pacifico-import.scss +1 -0
  26. data/source/styles/typography/pacifico.typeface +1 -0
  27. data/source/styles/typography/roboto-import.scss +1 -1
  28. data/source/styles/typography/roboto-slab-import.scss +1 -0
  29. data/source/styles/typography/roboto-slab.typeface +1 -0
  30. data/source/styles/typography/roboto.typeface +1 -1
  31. data/source/styles/typography/themes/default.theme +3 -0
  32. data/source/styles/typography/themes/flatland.theme +3 -0
  33. data/source/styles/typography/themes/peace.theme +3 -0
  34. data/source/styles/typography/themes/plastic.theme +3 -5
  35. data/staple.gemspec +1 -1
  36. metadata +25 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 37dd82594a55d207062a5af33d61fb567c71fbfe
4
- data.tar.gz: 7202ea9aa3e87dc080eb76a04395e7074cc049d6
3
+ metadata.gz: 1994fd847f97d5f64e5fb8f630d47272d634df18
4
+ data.tar.gz: b65b6d78219985e2156a2b574334bae0914f79f9
5
5
  SHA512:
6
- metadata.gz: dfc0a4c443f5af11b4dbd00872f0d3deef55dc60648bb6387d4a572472ab60ef20bf6fe764b15e621b74f5c8b6c8eb8d37facc956e6b7c14e540e1a0cd52de0d
7
- data.tar.gz: 61db24a5db834c7e375c9f39be0013d5e0821d18413082e7e61d11b864264879a13614e783641b02f18a8a1c5dbab909c55e7adc4db5c987ca4792b02eda8016
6
+ metadata.gz: d12a8f806ed2af885a58c934214d62d5f2a7fe14a49c026a3239da50a6d327264edf35fc4dae871664ed1f56b5f544e0115bdd0b3251656b52fc8b77c336bf49
7
+ data.tar.gz: 1a5d41d32231d0ea221b2182b93eba07a3b940bb89a520e72bc561510dcb66abce08ce1a64cae3f5346f9a795892de947b3d4aa403d46bc3d220014ed8e20da9
data/README.md CHANGED
@@ -3,13 +3,12 @@
3
3
  a modular ui framework for rails built on top of foundation and sass.
4
4
 
5
5
  ##goals
6
-
7
6
  * favor presets over explicit declaration
8
7
  * convention over configuration
9
8
  * keep it simple
10
9
 
11
10
  ##todo
12
- * expand library and integration tests
11
+ * integrate images and navs, etc? (as elements?)
13
12
  * import web components
14
13
 
15
14
  ##lower priority todo
@@ -32,6 +31,9 @@ a modular ui framework for rails built on top of foundation and sass.
32
31
  * border-size
33
32
  * change amount (color dif, hover dif)
34
33
  * refactor generator code from low priority
34
+ * add are you sure? to staple:reset
35
+ * why does success (others too | nav button) button go darker?
36
+ * white/black swap shouldn't affect buttons
35
37
 
36
38
  ##Install
37
39
 
@@ -51,8 +53,7 @@ rails g staple:install
51
53
  ```
52
54
 
53
55
  ##intended use
54
-
55
- * special cases - seperate generators?
56
+ * *special cases - seperate generators?
56
57
 
57
58
  ###themes
58
59
  * rails g staple:theme buttons plastic
@@ -95,6 +96,6 @@ rails g staple:install
95
96
  * rails g staple:sizes amputate xxl
96
97
 
97
98
  #staple command - coming soon
98
- staple {button-style|button-theme} {pattern} (append)
99
- staple buttons round
100
- staple buttons-theme plastic
99
+ * staple {button-style|button-theme} {pattern} (append)
100
+ * staple buttons round
101
+ * staple buttons-theme plastic
@@ -0,0 +1,8 @@
1
+ primary-color:#2980b9
2
+ complement-color:#27ae60
3
+ secondary-color:#2c3e50
4
+ tertiary-color:#e67e22
5
+ topbar-bg-color:transparent
6
+ topbar-text-color:'rgba($black, $transparent-strong)'
7
+ body-bg:#FFF
8
+ body-font-color:'rgba($black, $transparent-strong)'
@@ -1,2 +1,10 @@
1
- secondary:green
2
- tertiary:yellow
1
+ primary-color:#01B0F0
2
+ complement-color:#FF358B
3
+ secondary-color:#AEEE00
4
+ tertiary-color:#f39c12
5
+ white:#000
6
+ black:#FFF
7
+ topbar-bg-color:transparent
8
+ topbar-text-color:'rgba($white, $transparent-strong)'
9
+ body-bg:#333333
10
+ body-font-color:'rgba($black, $transparent-medium)'
@@ -0,0 +1,8 @@
1
+ primary-color:#42826C
2
+ complement-color:#A5C77F
3
+ secondary-color:#FFC861
4
+ tertiary-color:#C84663
5
+ topbar-bg-color:transparent
6
+ topbar-text-color:'rgba($white, $transparent-strong)'
7
+ body-bg:#002F32
8
+ body-font-color:'rgba($white, $transparent-medium)'
@@ -1,3 +1,8 @@
1
- background:'rgba(25,228,20,0.5)'
2
- primary:'#477'
3
- paragraph:blue
1
+ primary-color:#105B63
2
+ complement-color:#FFD34E
3
+ secondary-color:#DB9E36
4
+ tertiary-color:#BD4932
5
+ topbar-bg-color:transparent
6
+ topbar-text-color:'rgba($black, $transparent-strong)'
7
+ body-bg:#FFFAD5
8
+ body-font-color:'rgba($black, $transparent-medium)'
@@ -4,6 +4,7 @@
4
4
  color: set-text-color($primary-color);
5
5
  font-weight: 200;
6
6
  letter-spacing: 1px;
7
+ margin-right: 5px;
7
8
  transition: background-color 150ms ease-out;//&*default
8
9
  }
9
10
  .button:hover{
@@ -29,4 +29,9 @@ $opacity-define:$transparent-light $transparent-weak $transparent-medium $tra
29
29
  $primary-difference: 30;
30
30
  $transition-brighten: 8%;
31
31
 
32
- //PUT BUILDER HERE?
32
+ //TOPBAR COLORS
33
+ $topbar-bg-color: $primary-color;
34
+ $topbar-text-color: $white;
35
+
36
+ $body-bg: $white;
37
+ $body-font-color: rgba($black, $transparent-strong);
@@ -154,7 +154,7 @@ $shiny-edge-active-color: rgba($black, .2);
154
154
  $header-font-family: $body-font-family;
155
155
  // $header-font-weight: $font-weight-normal;
156
156
  $header-font-style: normal;
157
- $header-font-color: rgba($black, $transparent-strong);
157
+ $header-font-color: $body-font-color;
158
158
  $header-line-height: 1.4;
159
159
  $header-top-margin: .2rem;
160
160
  $header-bottom-margin: .5rem;
@@ -1317,7 +1317,8 @@ $table-margin-bottom: rem-calc(20);
1317
1317
  // $include-html-top-bar-classes: $include-html-classes;
1318
1318
 
1319
1319
  // Background color for the top bar
1320
- $topbar-bg-color: rgba($black, $transparent-strong);
1320
+ // $topbar-bg-color: $primary-color;
1321
+ // $topbar-text-color: rgba($white, $transparent-strong);
1321
1322
  $topbar-bg: $topbar-bg-color;
1322
1323
 
1323
1324
  // Height and margin
@@ -1329,27 +1330,27 @@ $topbar-title-weight: $font-weight-normal;
1329
1330
  $topbar-title-font-size: rem-calc(17);
1330
1331
 
1331
1332
  // Style the top bar dropdown elements
1332
- $topbar-dropdown-bg: rgba($black, $transparent-strong);
1333
- $topbar-dropdown-link-color: $white;
1333
+ $topbar-dropdown-bg: $topbar-bg-color;
1334
+ $topbar-dropdown-link-color: $topbar-text-color;
1334
1335
  $topbar-dropdown-link-bg: rgba($black, $transparent-strong);
1335
1336
  $topbar-dropdown-link-weight: $font-weight-normal;
1336
1337
  $topbar-dropdown-toggle-size: 5px;
1337
- $topbar-dropdown-toggle-color: $white;
1338
+ $topbar-dropdown-toggle-color: $topbar-text-color;
1338
1339
  $topbar-dropdown-toggle-alpha: 0.4;
1339
1340
 
1340
1341
  // Set the link colors and styles for top-level nav
1341
- $topbar-link-color: $white;
1342
- $topbar-link-color-hover: $white;
1343
- $topbar-link-color-active: $white;
1344
- $topbar-link-color-active-hover: $white;
1342
+ $topbar-link-color: $topbar-text-color;
1343
+ $topbar-link-color-hover: $topbar-text-color;
1344
+ $topbar-link-color-active: $topbar-text-color;
1345
+ $topbar-link-color-active-hover: $topbar-text-color;
1345
1346
  $topbar-link-weight: $font-weight-normal;
1346
1347
  $topbar-link-font-size: rem-calc(13);
1347
1348
  $topbar-link-hover-lightness: -10%; // Darken by 10%
1348
- $topbar-link-bg: $topbar-bg;
1349
+ $topbar-link-bg: transparent;
1349
1350
  $topbar-link-bg-color-hover: rgba($black, $transparent-strong);
1350
- $topbar-link-bg-hover: #272727;
1351
- $topbar-link-bg-active: $primary-color;
1352
- $topbar-link-bg-active-hover: scale-color($primary-color, $lightness: -14%);
1351
+ $topbar-link-bg-hover: rgba($black, $transparent-light);
1352
+ $topbar-link-bg-active: rgba($black, $transparent-weak);
1353
+ $topbar-link-bg-active-hover: rgba($black, $transparent-weak);
1353
1354
  $topbar-link-font-family: $body-font-family;
1354
1355
  $topbar-link-text-transform: none;
1355
1356
  $topbar-link-padding: $topbar-height / 3;
@@ -1369,20 +1370,20 @@ $topbar-dropdown-label-bg: rgba($black, $transparent-strong);
1369
1370
  $topbar-menu-link-transform: uppercase;
1370
1371
  $topbar-menu-link-font-size: rem-calc(13);
1371
1372
  $topbar-menu-link-weight: $font-weight-bold;
1372
- $topbar-menu-link-color: $white;
1373
- $topbar-menu-icon-color: $white;
1373
+ $topbar-menu-link-color: $topbar-text-color;
1374
+ $topbar-menu-icon-color: $topbar-text-color;
1374
1375
  $topbar-menu-link-color-toggled: rgba($black, $transparent-medium);
1375
1376
  $topbar-menu-icon-color-toggled: rgba($black, $transparent-medium);
1376
1377
 
1377
1378
  // Transitions and breakpoint styles
1378
- $topbar-transition-speed: 300ms;
1379
+ $topbar-transition-speed: 150ms;
1379
1380
  // Using rem-calc for the below breakpoint causes issues with top bar
1380
1381
  $topbar-breakpoint: #{lower-bound($medium-range)}; // Change to 9999px for always mobile layout
1381
1382
  // $topbar-media-query: $medium-up;
1382
1383
 
1383
1384
  // Divider Styles
1384
- $topbar-divider-border-bottom: solid $default-border-size scale-color($topbar-bg-color, $lightness: 13%);
1385
- $topbar-divider-border-top: solid $default-border-size scale-color($topbar-bg-color, $lightness: -50%);
1385
+ $topbar-divider-border-bottom: solid $default-border-size rgba($black, $transparent-light);
1386
+ $topbar-divider-border-top: solid $default-border-size rgba($black, $transparent-light);
1386
1387
 
1387
1388
  // Sticky Class
1388
1389
  $topbar-sticky-class: ".sticky";
@@ -1,12 +1,9 @@
1
- //IMPORT FONTS HERE Typekit and Google Fonts
2
- @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,700);
3
- @import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700);
4
- @import url(http://fonts.googleapis.com/css?family=Inconsolata);//&*import
1
+ //&*import
5
2
 
6
3
  //DEFAULTS
7
- $typeface-primary: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
8
- $typeface-secondary: "Roboto Slab", serif;
9
- $typeface-tertiary: "Inconsolata", monospace;
4
+ $typeface-primary: "Helvetica Neue", Helvetica, Arial, sans-serif;
5
+ $typeface-secondary: serif;
6
+ $typeface-tertiary: monospace;
10
7
  $normal-font-weight: 400;
11
8
  $header-font-weight: 300;
12
9
  $subheader-font-weight: 400;
@@ -16,8 +13,6 @@ $subheader-font-weight: 400;
16
13
  $font-family-sans-serif: $typeface-primary;
17
14
  $font-family-serif: $typeface-secondary;
18
15
  $font-family-monospace: $typeface-tertiary;
19
- $body-bg: $white;//can use any from colors
20
- $body-font-color: rgba($black, $transparent-strong);
21
16
  $body-font-family: $font-family-sans-serif;
22
17
  $body-font-weight: $normal-font-weight;
23
18
 
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Droid+Serif:400,700);
@@ -0,0 +1 @@
1
+ "Droid Serif", serif
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Gloria+Hallelujah);
@@ -0,0 +1 @@
1
+ "Gloria Hallelujah", serif
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Inconsolata:400,700);
@@ -0,0 +1 @@
1
+ "Inconsolata", monospace
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,900);
@@ -0,0 +1 @@
1
+ "Lato", sans-serif
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,700);
@@ -0,0 +1 @@
1
+ "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Oswald:400,300,700);
@@ -0,0 +1 @@
1
+ "Oswald", sans-serif
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Oxygen:400,300,700);
@@ -0,0 +1 @@
1
+ "Oxygen", sans-serif
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Pacifico);
@@ -0,0 +1 @@
1
+ "Pacifico", serif
@@ -1 +1 @@
1
- @import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700);
1
+ @import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700,900);
@@ -0,0 +1 @@
1
+ @import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700);
@@ -0,0 +1 @@
1
+ "Roboto Slab", serif
@@ -1 +1 @@
1
- "Roboto Slab", serif
1
+ "Roboto", sans-serif
@@ -0,0 +1,3 @@
1
+ typeface-primary:helvetica-neue
2
+ typeface-secondary:serif
3
+ typeface-tertiary:monospace
@@ -0,0 +1,3 @@
1
+ typeface-primary:oswald
2
+ typeface-secondary:inconsolata
3
+ typeface-tertiary:roboto
@@ -0,0 +1,3 @@
1
+ typeface-primary:pacifico
2
+ typeface-secondary:open-sans
3
+ typeface-tertiary:roboto
@@ -1,5 +1,3 @@
1
- typeface-primary:roboto
2
- typeface-secondary:'"Inconsolata", monospace'
3
- typeface-tertiary:helvetica-neue
4
- normal-font-weight:200
5
- header-font-weight:600
1
+ typeface-primary:lato
2
+ typeface-secondary:open-sans
3
+ typeface-tertiary:inconsolata
data/staple.gemspec CHANGED
@@ -4,7 +4,7 @@ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
4
4
 
5
5
  Gem::Specification.new do |spec|
6
6
  spec.name = "staple"
7
- spec.version = "0.4.2"
7
+ spec.version = "0.4.3"
8
8
  spec.summary = "Modular UI framework for rails built on top of foundation and sass"
9
9
  spec.description = "a modular ui framework for rails built on top of foundation and sass."
10
10
  spec.authors = ["Ryan Helsing"]
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: staple
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.4.2
4
+ version: 0.4.3
5
5
  platform: ruby
6
6
  authors:
7
7
  - Ryan Helsing
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2014-11-20 00:00:00.000000000 Z
11
+ date: 2014-11-21 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: foundation-rails
@@ -103,7 +103,9 @@ files:
103
103
  - source/styles/buttons/themes/plastic.theme
104
104
  - source/styles/buttons/transparent.scss
105
105
  - source/styles/colors/blue.color
106
+ - source/styles/colors/themes/default.theme
106
107
  - source/styles/colors/themes/flatland.theme
108
+ - source/styles/colors/themes/peace.theme
107
109
  - source/styles/colors/themes/plastic.theme
108
110
  - source/styles/forms/2px-border-focus.scss
109
111
  - source/styles/forms/2px-border.scss
@@ -146,9 +148,30 @@ files:
146
148
  - source/styles/tables/horizontal-lines.scss
147
149
  - source/styles/tables/stripe.scss
148
150
  - source/styles/tables/themes/plastic.theme
151
+ - source/styles/typography/droid-serif-import.scss
152
+ - source/styles/typography/droid-serif.typeface
153
+ - source/styles/typography/gloria-import.scss
154
+ - source/styles/typography/gloria.typeface
149
155
  - source/styles/typography/helvetica-neue.typeface
156
+ - source/styles/typography/inconsolata-import.scss
157
+ - source/styles/typography/inconsolata.typeface
158
+ - source/styles/typography/lato-import.scss
159
+ - source/styles/typography/lato.typeface
160
+ - source/styles/typography/open-sans-import.scss
161
+ - source/styles/typography/open-sans.typeface
162
+ - source/styles/typography/oswald-import.scss
163
+ - source/styles/typography/oswald.typeface
164
+ - source/styles/typography/oxygen-import.scss
165
+ - source/styles/typography/oxygen.typeface
166
+ - source/styles/typography/pacifico-import.scss
167
+ - source/styles/typography/pacifico.typeface
150
168
  - source/styles/typography/roboto-import.scss
169
+ - source/styles/typography/roboto-slab-import.scss
170
+ - source/styles/typography/roboto-slab.typeface
151
171
  - source/styles/typography/roboto.typeface
172
+ - source/styles/typography/themes/default.theme
173
+ - source/styles/typography/themes/flatland.theme
174
+ - source/styles/typography/themes/peace.theme
152
175
  - source/styles/typography/themes/plastic.theme
153
176
  - staple.gemspec
154
177
  homepage: https://github.com/rhelsing/staple