groundworkcss-rails 0.1 → 0.2

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 (29) hide show
  1. data/lib/generators/groundworkcss/install/templates/groundwork-and-overrides.scss +1 -1
  2. data/lib/generators/groundworkcss/install/templates/groundwork-and-overrides.scss~ +3 -1
  3. data/lib/groundworkcss/rails/version.rb +1 -1
  4. data/lib/groundworkcss/rails/version.rb~ +4 -6
  5. data/vendor/assets/javascripts/{groundwork.js → groundwork-hook.js} +0 -0
  6. data/vendor/assets/javascripts/groundworkcss/coffee/groundwork.coffee +1 -1
  7. data/vendor/assets/javascripts/groundworkcss/coffee/plugins/jquery.modals.coffee +162 -0
  8. data/vendor/assets/javascripts/groundworkcss/coffee/plugins/jquery.popover.coffee +198 -0
  9. data/vendor/assets/javascripts/groundworkcss/coffee/plugins/jquery.responsiveTables.coffee +56 -0
  10. data/vendor/assets/javascripts/groundworkcss/coffee/plugins/jquery.responsiveText.coffee +32 -0
  11. data/vendor/assets/javascripts/groundworkcss/coffee/plugins/jquery.tooltip.coffee +121 -0
  12. data/vendor/assets/javascripts/groundworkcss/groundwork.js +16 -14
  13. data/vendor/assets/javascripts/groundworkcss/plugins/jquery.modals.js +15 -13
  14. data/vendor/assets/stylesheets/groundworkcss-scss/_buttons.scss +7 -7
  15. data/vendor/assets/stylesheets/groundworkcss-scss/_forms.scss +4 -1
  16. data/vendor/assets/stylesheets/groundworkcss-scss/_mixins.scss +5 -5
  17. data/vendor/assets/stylesheets/groundworkcss-scss/_mobile-reset.scss +1 -1
  18. data/vendor/assets/stylesheets/groundworkcss-scss/_modals.scss +7 -6
  19. data/vendor/assets/stylesheets/groundworkcss-scss/_navigation.scss +51 -18
  20. data/vendor/assets/stylesheets/groundworkcss-scss/_responsive.scss +9 -9
  21. data/vendor/assets/stylesheets/groundworkcss-scss/_social-icons.scss +54 -54
  22. data/vendor/assets/stylesheets/groundworkcss-scss/_tables.scss +5 -0
  23. data/vendor/assets/stylesheets/groundworkcss-scss/_tabs.scss +41 -2
  24. data/vendor/assets/stylesheets/groundworkcss-scss/_typography.scss +31 -56
  25. data/vendor/assets/stylesheets/groundworkcss-scss/_webfonts.scss +1 -1
  26. data/vendor/assets/stylesheets/groundworkcss-scss/groundwork-ie.scss +61 -0
  27. data/vendor/assets/stylesheets/groundworkcss-scss/groundwork.scss +1 -1
  28. data/vendor/assets/stylesheets/groundworkcss-scss/no-svg.scss +344 -57
  29. metadata +20 -15
@@ -111,12 +111,12 @@
111
111
  @include filter-shadow(rgba(0,0,0,0), 0, 0, 0);
112
112
  li {
113
113
  &:first-child {
114
- a, a:link, a:visited {
114
+ a, a:visited {
115
115
  @include rounded(0 !important);
116
116
  }
117
117
  }
118
118
  &:last-child {
119
- a, a:link, a:visited {
119
+ a, a:visited {
120
120
  @include rounded(0 !important);
121
121
  }
122
122
  }
@@ -129,7 +129,7 @@
129
129
  ul {
130
130
  li {
131
131
  &:last-child {
132
- a, a:link, a:visited {
132
+ a, a:visited {
133
133
  @include rounded(0 0 $radius $radius !important);
134
134
  }
135
135
  }
@@ -144,16 +144,16 @@
144
144
  ul, ul.row {
145
145
  li {
146
146
  &:first-child {
147
- > a, > a:link, > a:visited {
147
+ > a, > , > a:visited {
148
148
  @include rounded($radius $radius 0 0 !important);
149
149
  }
150
150
  }
151
151
  &:last-child {
152
- > a, > a:link, > a:visited {
152
+ > a, > , > a:visited {
153
153
  @include rounded(0 0 $radius $radius !important);
154
154
  }
155
155
  &.on {
156
- > a, > a:link, > a:visited {
156
+ > a, > , > a:visited {
157
157
  border-bottom-right-radius:0 !important;
158
158
  border-bottom-left-radius:0 !important;
159
159
  }
@@ -163,7 +163,7 @@
163
163
  li {
164
164
  ul {
165
165
  li {
166
- a, a:link, a:visited {
166
+ a, a:visited {
167
167
  @include rounded(0 !important);
168
168
  }
169
169
  }
@@ -185,7 +185,7 @@
185
185
  }
186
186
  }
187
187
  &:first-child a {
188
- @include rounded($radius $radius 0 0);
188
+ @include rounded($radius $radius 0 0);
189
189
  }
190
190
  }
191
191
  }
@@ -269,7 +269,7 @@
269
269
  border-bottom:none;
270
270
  }
271
271
  &:first-child a {
272
- @include rounded($radius $radius 0 0);
272
+ @include rounded($radius $radius 0 0);
273
273
  }
274
274
  }
275
275
  }
@@ -35,58 +35,58 @@
35
35
  &.round {
36
36
  @include rounded(50% 50%);
37
37
  }
38
- &.aboutme { @include data-image("#{$socialPath}/aboutme.svg"); }
39
- &.adn { @include data-image("#{$socialPath}/adn.svg"); }
40
- &.android { @include data-image("#{$socialPath}/android.svg"); }
41
- &.apple { @include data-image("#{$socialPath}/apple.svg"); }
42
- &.behance { @include data-image("#{$socialPath}/behance.svg"); }
43
- &.bitbucket { @include data-image("#{$socialPath}/bitbucket.svg"); }
44
- &.coderwall { @include data-image("#{$socialPath}/coderwall.svg"); }
45
- &.creativecloud { @include data-image("#{$socialPath}/creativecloud.svg"); }
46
- &.dribbble { @include data-image("#{$socialPath}/dribbble.svg"); }
47
- &.dropbox { @include data-image("#{$socialPath}/dropbox.svg"); }
48
- &.evernote { @include data-image("#{$socialPath}/evernote.svg"); }
49
- &.facebook { @include data-image("#{$socialPath}/facebook.svg"); }
50
- &.flickr { @include data-image("#{$socialPath}/flickr.svg"); }
51
- &.foursquare { @include data-image("#{$socialPath}/foursquare.svg"); }
52
- &.git { @include data-image("#{$socialPath}/git.svg"); }
53
- &.github { @include data-image("#{$socialPath}/github.svg"); }
54
- &.googleplay { @include data-image("#{$socialPath}/googleplay.svg"); }
55
- &.googleplus { @include data-image("#{$socialPath}/googleplus.svg"); }
56
- &.html5 { @include data-image("#{$socialPath}/html5.svg"); }
57
- &.icloud { @include data-image("#{$socialPath}/icloud.svg"); }
58
- &.instagram { @include data-image("#{$socialPath}/instagram.svg"); }
59
- &.lastfm { @include data-image("#{$socialPath}/lastfm.svg"); }
60
- &.linkedin { @include data-image("#{$socialPath}/linkedin.svg"); }
61
- &.mail { @include data-image("#{$socialPath}/mail.svg"); }
62
- &.mixi { @include data-image("#{$socialPath}/mixi.svg"); }
63
- &.msn { @include data-image("#{$socialPath}/msn.svg"); }
64
- &.pinterest { @include data-image("#{$socialPath}/pinterest.svg"); }
65
- &.pocket { @include data-image("#{$socialPath}/pocketapp.svg"); }
66
- &.quora { @include data-image("#{$socialPath}/quora.svg"); }
67
- &.orkut { @include data-image("#{$socialPath}/orkut.svg"); }
68
- &.mercurial { @include data-image("#{$socialPath}/mercurial.svg"); }
69
- &.rdio { @include data-image("#{$socialPath}/rdio.svg"); }
70
- &.renren { @include data-image("#{$socialPath}/renren.svg"); }
71
- &.rss { @include data-image("#{$socialPath}/rss.svg"); }
72
- &.skitch { @include data-image("#{$socialPath}/skitch.svg"); }
73
- &.skype { @include data-image("#{$socialPath}/skype.svg"); }
74
- &.soundcloud { @include data-image("#{$socialPath}/soundcloud.svg"); }
75
- &.spotify { @include data-image("#{$socialPath}/spotify.svg"); }
76
- &.stackoverflow { @include data-image("#{$socialPath}/stackoverflow.svg"); }
77
- &.stumbleupon { @include data-image("#{$socialPath}/stumbleupon.svg"); }
78
- &.svn { @include data-image("#{$socialPath}/svn.svg"); }
79
- &.tent { @include data-image("#{$socialPath}/tent.svg"); }
80
- &.tripadvisor { @include data-image("#{$socialPath}/tripadvisor.svg"); }
81
- &.tumblr { @include data-image("#{$socialPath}/tumblr.svg"); }
82
- &.twitter { @include data-image("#{$socialPath}/twitter.svg"); }
83
- &.vimeo { @include data-image("#{$socialPath}/vimeo.svg"); }
84
- &.weibo { @include data-image("#{$socialPath}/weibo.svg"); }
85
- &.windows { @include data-image("#{$socialPath}/windows.svg"); }
86
- &.wordpress { @include data-image("#{$socialPath}/wordpress.svg"); }
87
- &.xing { @include data-image("#{$socialPath}/xing.svg"); }
88
- &.yelp { @include data-image("#{$socialPath}/yelp.svg"); }
89
- &.youtube { @include data-image("#{$socialPath}/youtube.svg"); }
90
- &.youversion { @include data-image("#{$socialPath}/youversion.svg"); }
91
- &.zerply { @include data-image("#{$socialPath}/zerply.svg"); }
38
+ &.aboutme { @include data-image("social-icons/aboutme.svg"); }
39
+ &.adn { @include data-image("social-icons/adn.svg"); }
40
+ &.android { @include data-image("social-icons/android.svg"); }
41
+ &.apple { @include data-image("social-icons/apple.svg"); }
42
+ &.behance { @include data-image("social-icons/behance.svg"); }
43
+ &.bitbucket { @include data-image("social-icons/bitbucket.svg"); }
44
+ &.coderwall { @include data-image("social-icons/coderwall.svg"); }
45
+ &.creativecloud { @include data-image("social-icons/creativecloud.svg"); }
46
+ &.dribbble { @include data-image("social-icons/dribbble.svg"); }
47
+ &.dropbox { @include data-image("social-icons/dropbox.svg"); }
48
+ &.evernote { @include data-image("social-icons/evernote.svg"); }
49
+ &.facebook { @include data-image("social-icons/facebook.svg"); }
50
+ &.flickr { @include data-image("social-icons/flickr.svg"); }
51
+ &.foursquare { @include data-image("social-icons/foursquare.svg"); }
52
+ &.git { @include data-image("social-icons/git.svg"); }
53
+ &.github { @include data-image("social-icons/github.svg"); }
54
+ &.googleplay { @include data-image("social-icons/googleplay.svg"); }
55
+ &.googleplus { @include data-image("social-icons/googleplus.svg"); }
56
+ &.html5 { @include data-image("social-icons/html5.svg"); }
57
+ &.icloud { @include data-image("social-icons/icloud.svg"); }
58
+ &.instagram { @include data-image("social-icons/instagram.svg"); }
59
+ &.lastfm { @include data-image("social-icons/lastfm.svg"); }
60
+ &.linkedin { @include data-image("social-icons/linkedin.svg"); }
61
+ &.mail { @include data-image("social-icons/mail.svg"); }
62
+ &.mixi { @include data-image("social-icons/mixi.svg"); }
63
+ &.msn { @include data-image("social-icons/msn.svg"); }
64
+ &.pinterest { @include data-image("social-icons/pinterest.svg"); }
65
+ &.pocket { @include data-image("social-icons/pocketapp.svg"); }
66
+ &.quora { @include data-image("social-icons/quora.svg"); }
67
+ &.orkut { @include data-image("social-icons/orkut.svg"); }
68
+ &.mercurial { @include data-image("social-icons/mercurial.svg"); }
69
+ &.rdio { @include data-image("social-icons/rdio.svg"); }
70
+ &.renren { @include data-image("social-icons/renren.svg"); }
71
+ &.rss { @include data-image("social-icons/rss.svg"); }
72
+ &.skitch { @include data-image("social-icons/skitch.svg"); }
73
+ &.skype { @include data-image("social-icons/skype.svg"); }
74
+ &.soundcloud { @include data-image("social-icons/soundcloud.svg"); }
75
+ &.spotify { @include data-image("social-icons/spotify.svg"); }
76
+ &.stackoverflow { @include data-image("social-icons/stackoverflow.svg"); }
77
+ &.stumbleupon { @include data-image("social-icons/stumbleupon.svg"); }
78
+ &.svn { @include data-image("social-icons/svn.svg"); }
79
+ &.tent { @include data-image("social-icons/tent.svg"); }
80
+ &.tripadvisor { @include data-image("social-icons/tripadvisor.svg"); }
81
+ &.tumblr { @include data-image("social-icons/tumblr.svg"); }
82
+ &.twitter { @include data-image("social-icons/twitter.svg"); }
83
+ &.vimeo { @include data-image("social-icons/vimeo.svg"); }
84
+ &.weibo { @include data-image("social-icons/weibo.svg"); }
85
+ &.windows { @include data-image("social-icons/windows.svg"); }
86
+ &.wordpress { @include data-image("social-icons/wordpress.svg"); }
87
+ &.xing { @include data-image("social-icons/xing.svg"); }
88
+ &.yelp { @include data-image("social-icons/yelp.svg"); }
89
+ &.youtube { @include data-image("social-icons/youtube.svg"); }
90
+ &.youversion { @include data-image("social-icons/youversion.svg"); }
91
+ &.zerply { @include data-image("social-icons/zerply.svg"); }
92
92
  }
@@ -12,6 +12,11 @@ table {
12
12
  padding:0;
13
13
  margin:0;
14
14
  font-size:1em;
15
+ &.align-center {
16
+ th, td {
17
+ text-align:center;
18
+ }
19
+ }
15
20
  &.responsive {
16
21
  table-layout:fixed;
17
22
  }
@@ -1,5 +1,5 @@
1
1
  // ===================================
2
- // Groundwork Tabs
2
+ // GroundworkCSS Tabs
3
3
  // ===================================
4
4
 
5
5
 
@@ -7,6 +7,44 @@
7
7
 
8
8
  .tabs {
9
9
  position:relative;
10
+ &.vertical {
11
+ > ul {
12
+ height:100%;
13
+ position:absolute;
14
+ width:20%;
15
+ background:$button-active;
16
+ border-bottom:1px solid $button-active;
17
+ @include rounded($radius 0 0 $radius);
18
+ li {
19
+ float:none;
20
+ margin:0 -1px 0 0;
21
+ &:first-child {
22
+ a, a:visited {
23
+ @include rounded($radius 0 0 0);
24
+ }
25
+ }
26
+ a, a:visited {
27
+ height:auto;
28
+ border-bottom:1px solid $button-active;
29
+ @include rounded(0);
30
+ &:before, &:after {
31
+ display:none !important;
32
+ }
33
+ &.active {
34
+ border-right:none;
35
+ color:$font-color;
36
+ background:$background-color;
37
+ }
38
+ }
39
+ }
40
+ }
41
+ > div {
42
+ position:relative;
43
+ left:20%;
44
+ width:80%;
45
+ @include rounded(0 $radius $radius 0);
46
+ }
47
+ }
10
48
  > ul {
11
49
  display:block;
12
50
  width:100%;
@@ -67,7 +105,6 @@
67
105
  border:1px solid $button-active;
68
106
  color:$button-text;
69
107
  z-index:2;
70
- @include filter-shadow(rgba(0,0,0,0.25), 5px, 0, 0);
71
108
  &:before {
72
109
  box-shadow:2px 1px 0 $button-active;
73
110
  }
@@ -123,6 +160,8 @@
123
160
  > div {
124
161
  display:none;
125
162
  padding:$gutter * 2;
163
+ background:$background-color;
164
+ @include rounded(0 0 $radius $radius);
126
165
  *:first-child {
127
166
  margin-top:0;
128
167
  }
@@ -19,48 +19,20 @@ body {
19
19
  background:$selection-color;
20
20
  color:$selection-text;
21
21
  }
22
- // * {
23
- // outline:none;
24
- // &:focus {
25
- // @include filter-shadow(rgba(0,0,0,0.35), 15px, 0, 0);
26
- // }
27
- // }
28
- a, a:link, a:visited {
22
+ * {
23
+ outline:none;
24
+ &:focus {
25
+ @include filter-shadow(rgba(0,0,0,0.35), 15px, 0, 0);
26
+ }
27
+ }
28
+ a, a:visited {
29
29
  color:$link-color;
30
30
  @include transition(color 0.25s);
31
31
  &:hover, &:focus {
32
32
  text-decoration:underline;
33
33
  }
34
34
  }
35
- h1.heading {
36
- font-size:3em;
37
- text-shadow:0 0 5px rgba(0,0,0,0.25);
38
- a, a:link, a:visited {
39
- color:$font-color;
40
- text-decoration:none;
41
- a:hover, a:focus {
42
- color:$font-color;
43
- text-decoration:none;
44
- }
45
- }
46
- sup {
47
- font-size:0.35em;
48
- }
49
- .logo {
50
- display:inline-block;
51
- width:1em;
52
- height:1em;
53
- position:relative;
54
- top:0.1em;
55
- background:transparent url('../images/groundwork-logo.svg') bottom right no-repeat;
56
- background-size:100% 100%;
57
- text-indent:-9999em;
58
- overflow:hidden;
59
- @include filter-shadow(rgba(0,0,0,0.25), 5px, 0, 0); // color, blur, x, y
60
- }
61
- }
62
35
  h1, h2, h3, h4, h5, h6 {
63
- @include font-stack('Average Sans');
64
36
  line-height:1.1;
65
37
  margin-bottom:15px;
66
38
  }
@@ -97,14 +69,14 @@ p, ul, ol, dl {
97
69
  }
98
70
  ul, ol {
99
71
  margin-left:20px;
100
- }
101
- ul {
102
- list-style-type:circle;
72
+ li {
73
+ display:list-item;
74
+ }
103
75
  }
104
76
  ul.list {
105
77
  list-style:none;
106
78
  margin-left:0;
107
- li {
79
+ > li {
108
80
  &:before {
109
81
  content:'\f00c';
110
82
  display: inline-block;
@@ -129,25 +101,25 @@ ol.list {
129
101
  counter-reset:li;
130
102
  list-style:none;
131
103
  margin-left:1.5em;
132
- }
133
- ol.list > li {
104
+ > li {
134
105
  position:relative;
135
106
  padding:2px 6px 0;
136
- }
137
- ol.list > li:before {
138
- content:counter(li);
139
- counter-increment:li;
140
- position:absolute;
141
- top:2px;
142
- left:-2em;
143
- width:2em;
144
- text-align:center;
145
- padding:2px;
146
- font-size:0.8em;
147
- color:$background-color;
148
- background:$font-color;
149
- font-weight:bold;
150
- @include rounded(4px);
107
+ &:before {
108
+ content:counter(li);
109
+ counter-increment:li;
110
+ position:absolute;
111
+ top:2px;
112
+ left:-2em;
113
+ width:2em;
114
+ text-align:center;
115
+ padding:2px;
116
+ font-size:0.8em;
117
+ color:$background-color;
118
+ background:$font-color;
119
+ font-weight:bold;
120
+ @include rounded(4px);
121
+ }
122
+ }
151
123
  }
152
124
  dl {
153
125
  dt {
@@ -246,6 +218,9 @@ pre {
246
218
  .success, .valid {
247
219
  color:$success-color;
248
220
  }
221
+ .warning {
222
+ color:$warning-color;
223
+ }
249
224
  // responsive headings
250
225
  .js {
251
226
  .responsive {
@@ -1,5 +1,5 @@
1
1
  // ===================================
2
- // Groundwork Web Fonts
2
+ // GroundworkCSS Web Fonts
3
3
  // ===================================
4
4
 
5
5
 
@@ -48,6 +48,10 @@ html {
48
48
  }
49
49
  }
50
50
  }
51
+ // social icons
52
+ .social-icon {
53
+ filter:none;
54
+ }
51
55
  // modals
52
56
  div.modal {
53
57
  .close, .fullscreen {
@@ -61,4 +65,61 @@ html {
61
65
  }
62
66
  }
63
67
  }
68
+ &.lt-ie8 {
69
+ // navigation
70
+ nav {
71
+ &.inline {
72
+ > ul {
73
+ li {
74
+ display:block;
75
+ float:left;
76
+ white-space-collapse:preserve;
77
+ ul {
78
+ width:100%;
79
+ li {
80
+ float:none;
81
+ width:100%;
82
+ }
83
+ }
84
+ }
85
+ }
86
+ }
87
+ }
88
+ // typography
89
+ h1, h2, h3, h4, h5, h6 {
90
+ line-height:1.5;
91
+ }
92
+ ul, ul.list,
93
+ ol, ol.list {
94
+ margin-left:0;
95
+ padding-left:25px;
96
+ }
97
+ ul {
98
+ &.list {
99
+ list-style:disc;
100
+ }
101
+ }
102
+ ol {
103
+ &.list {
104
+ list-style:decimal;
105
+ li {
106
+ padding:0;
107
+ }
108
+ }
109
+ }
110
+ // buttons
111
+ ul, ol {
112
+ &.button-list {
113
+ margin:0;
114
+ padding:0;
115
+ }
116
+ }
117
+ button, .button, a.button, a.button:visited {
118
+ &.dropdown {
119
+ ul {
120
+ top:2em;
121
+ }
122
+ }
123
+ }
124
+ }
64
125
  }