express_ui 0.4.0 → 0.4.1
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
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 69bcce5371653226cf808c04eda1a897381506ce
|
|
4
|
+
data.tar.gz: 5a5ba6f11f9eb3fd4a9668f344c43a8816e3c7fe
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: b0a345c06dbfd397994b4d3eb44248293a255a55cca094c77edd224fcb24cf3ec53914c3ecc98dabde5651bd6df26ec07a3d751d87bb2c3b29ff41f3e4bb814e
|
|
7
|
+
data.tar.gz: 975d352658faf4e7650e9e4fa7feaafde6a45c1f6a03722d8c35b8caf5d08c7cbb587577aac2121ed400a536c6e29ebf9dddfef01f2dfe76c64420411cccd0fe
|
|
@@ -0,0 +1,305 @@
|
|
|
1
|
+
// IMPORTANT: Make sure this file is imported in the application.sass, i.e.g, @import 'mixins/express_ui'
|
|
2
|
+
// Content Outline
|
|
3
|
+
//
|
|
4
|
+
// I. Variables
|
|
5
|
+
// II. Mixins
|
|
6
|
+
|
|
7
|
+
// I. Variables
|
|
8
|
+
$primary-color: #6699CC
|
|
9
|
+
$primary-active-color: #477db0
|
|
10
|
+
$secondary-color: #999999
|
|
11
|
+
$sidebar-caret-icon: #ffffff
|
|
12
|
+
$success: #3c763d
|
|
13
|
+
$cancelled: #a94442
|
|
14
|
+
$pending: #faf2cc
|
|
15
|
+
$deleted: lighten($secondary-color, 30%)
|
|
16
|
+
$border-dark: $secondary-color
|
|
17
|
+
$border-light: #eaeaea
|
|
18
|
+
$body-color: #666
|
|
19
|
+
$body-background: #fff
|
|
20
|
+
$heading-color: #333
|
|
21
|
+
$link-color: $primary-color
|
|
22
|
+
$body-lighter: #999
|
|
23
|
+
$icon-color: #333
|
|
24
|
+
$smartphone: 480px
|
|
25
|
+
$tablet: 768px
|
|
26
|
+
$laptop: 1024px
|
|
27
|
+
$desktop: 1440px
|
|
28
|
+
$gray-background: #F7F7F7
|
|
29
|
+
$thead-color: #888
|
|
30
|
+
$dark-gray-background: rgba(#ccc, 0.1)
|
|
31
|
+
$container: 960px
|
|
32
|
+
$line-height: 14px
|
|
33
|
+
$font-size-root: 62.5%
|
|
34
|
+
$header-height: 55px
|
|
35
|
+
$header-max-height: 60px
|
|
36
|
+
$container-padding: 0.25em
|
|
37
|
+
// Because all browsers have a default font-size of 16px, setting the font-size to 62.5% on the html element gives it a font-size of 10px (10 / 16 * 100 = 62.5)
|
|
38
|
+
|
|
39
|
+
// II. Mixins
|
|
40
|
+
|
|
41
|
+
@mixin border-radius($n)
|
|
42
|
+
-moz-border-radius: $n
|
|
43
|
+
-webkit-border-radius: $n
|
|
44
|
+
border-radius: $n
|
|
45
|
+
|
|
46
|
+
@mixin box-shadow($top, $left, $blur, $color, $inset:"")
|
|
47
|
+
-webkit-box-shadow: $top $left $blur $color #{$inset}
|
|
48
|
+
-moz-box-shadow: $top $left $blur $color #{$inset}
|
|
49
|
+
box-shadow: $top $left $blur $color #{$inset}
|
|
50
|
+
|
|
51
|
+
@mixin well
|
|
52
|
+
margin: 0
|
|
53
|
+
background: $gray-background
|
|
54
|
+
@include border-radius(2px)
|
|
55
|
+
@include box-shadow(inset 0, 0, 3px, $border-dark)
|
|
56
|
+
@include animate(0.5s)
|
|
57
|
+
|
|
58
|
+
&:hover
|
|
59
|
+
background: rgba($primary-color, 0.1)
|
|
60
|
+
|
|
61
|
+
*
|
|
62
|
+
color: #333
|
|
63
|
+
|
|
64
|
+
@mixin clearfix
|
|
65
|
+
overflow: auto
|
|
66
|
+
|
|
67
|
+
&:before, &:after
|
|
68
|
+
content: ""
|
|
69
|
+
display: table
|
|
70
|
+
|
|
71
|
+
|
|
72
|
+
@mixin easeInOut
|
|
73
|
+
-moz-transition: all 0.3s ease-in-out
|
|
74
|
+
-o-transition: all 0.3s ease-in-out
|
|
75
|
+
-webkit-transition: all 0.3s ease-in-out
|
|
76
|
+
transition: all 0.3s ease-in-out
|
|
77
|
+
|
|
78
|
+
@mixin animate($n)
|
|
79
|
+
transition: all $n ease-out
|
|
80
|
+
|
|
81
|
+
@mixin scale
|
|
82
|
+
transform: scale(1.1)
|
|
83
|
+
|
|
84
|
+
@mixin button
|
|
85
|
+
@include border-radius(3px)
|
|
86
|
+
padding: 0.5em
|
|
87
|
+
margin: 0.25em 0.25em 0 0
|
|
88
|
+
border: 0
|
|
89
|
+
cursor: pointer
|
|
90
|
+
text-align: center
|
|
91
|
+
|
|
92
|
+
@mixin btn-type($type)
|
|
93
|
+
background: $type
|
|
94
|
+
border: 1px solid $type
|
|
95
|
+
|
|
96
|
+
&.ae-btn-border
|
|
97
|
+
color: $type !important
|
|
98
|
+
|
|
99
|
+
&:active, &:focus
|
|
100
|
+
@include box-shadow(inset, 2px, 2px, 2px, darken($type, 20%))
|
|
101
|
+
|
|
102
|
+
@mixin h1
|
|
103
|
+
@include font-size(32px, 32px)
|
|
104
|
+
|
|
105
|
+
@mixin h2
|
|
106
|
+
@include font-size(28px, 28px)
|
|
107
|
+
|
|
108
|
+
@mixin h3
|
|
109
|
+
@include font-size(24px, 24px)
|
|
110
|
+
|
|
111
|
+
@mixin h4
|
|
112
|
+
@include font-size(20px, 20px)
|
|
113
|
+
|
|
114
|
+
@mixin h5
|
|
115
|
+
@include font-size(16px, 16px)
|
|
116
|
+
|
|
117
|
+
@mixin h6
|
|
118
|
+
@include font-size(12px, 12px)
|
|
119
|
+
|
|
120
|
+
@mixin heading($border-color, $casing)
|
|
121
|
+
text-transform: $casing
|
|
122
|
+
border-bottom: 1px solid $border-color
|
|
123
|
+
padding-bottom: 0.5em
|
|
124
|
+
|
|
125
|
+
// $casing: uppercase, default
|
|
126
|
+
|
|
127
|
+
|
|
128
|
+
@mixin smartphone
|
|
129
|
+
@media only screen and (min-width: $smartphone)
|
|
130
|
+
@content
|
|
131
|
+
|
|
132
|
+
@mixin smartphone-max
|
|
133
|
+
@media only screen and (max-width: $smartphone)
|
|
134
|
+
@content
|
|
135
|
+
|
|
136
|
+
@mixin tablet
|
|
137
|
+
@media only screen and (min-width: $tablet)
|
|
138
|
+
@content
|
|
139
|
+
|
|
140
|
+
@mixin tablet-max
|
|
141
|
+
@media only screen and (max-width: $tablet)
|
|
142
|
+
@content
|
|
143
|
+
|
|
144
|
+
@mixin laptop
|
|
145
|
+
@media only screen and (min-width: $laptop)
|
|
146
|
+
@content
|
|
147
|
+
|
|
148
|
+
@mixin laptop-max
|
|
149
|
+
@media only screen and (max-width: $laptop)
|
|
150
|
+
@content
|
|
151
|
+
|
|
152
|
+
@mixin desktop
|
|
153
|
+
@media only screen and (min-width: $desktop)
|
|
154
|
+
@content
|
|
155
|
+
|
|
156
|
+
@mixin desktop-only
|
|
157
|
+
display: none !important
|
|
158
|
+
|
|
159
|
+
@include tablet
|
|
160
|
+
display: inline-block !important
|
|
161
|
+
|
|
162
|
+
@mixin mobile-only
|
|
163
|
+
display: block
|
|
164
|
+
|
|
165
|
+
@include tablet
|
|
166
|
+
display: none !important
|
|
167
|
+
|
|
168
|
+
|
|
169
|
+
@mixin body-font
|
|
170
|
+
font-family: 'Lato', sans-serif
|
|
171
|
+
|
|
172
|
+
@mixin header-font
|
|
173
|
+
font-family: 'Lato', sans-serif
|
|
174
|
+
|
|
175
|
+
@mixin icon-font
|
|
176
|
+
font-family: FontAwesome
|
|
177
|
+
|
|
178
|
+
@function rem($size)
|
|
179
|
+
$remSize: $size / 16px
|
|
180
|
+
@return #{$remSize}rem
|
|
181
|
+
|
|
182
|
+
@mixin font-size($size, $large_size)
|
|
183
|
+
font-size: rem($size)
|
|
184
|
+
|
|
185
|
+
@include tablet
|
|
186
|
+
font-size: rem($large_size*1.3)
|
|
187
|
+
|
|
188
|
+
@include desktop
|
|
189
|
+
font-size: rem($large_size*1.5)
|
|
190
|
+
|
|
191
|
+
@mixin p
|
|
192
|
+
@include font-size(18px, 24px)
|
|
193
|
+
font-weight: normal
|
|
194
|
+
|
|
195
|
+
|
|
196
|
+
@mixin ae-margin-left
|
|
197
|
+
margin-left: 0.25em
|
|
198
|
+
|
|
199
|
+
@mixin ae-margin-right
|
|
200
|
+
margin-right: 0.25em
|
|
201
|
+
|
|
202
|
+
@mixin status
|
|
203
|
+
@include border-radius(2px)
|
|
204
|
+
padding: 4px 10px
|
|
205
|
+
font-weight: bold
|
|
206
|
+
text-transform: uppercase
|
|
207
|
+
|
|
208
|
+
@mixin status-success
|
|
209
|
+
background: $success
|
|
210
|
+
color: #fff !important
|
|
211
|
+
|
|
212
|
+
@mixin status-error
|
|
213
|
+
background: $cancelled
|
|
214
|
+
color: #fff !important
|
|
215
|
+
|
|
216
|
+
@mixin status-pending
|
|
217
|
+
background: $pending
|
|
218
|
+
color: darken($pending, 60%)
|
|
219
|
+
|
|
220
|
+
@mixin status-deleted
|
|
221
|
+
background: $deleted
|
|
222
|
+
color: #999
|
|
223
|
+
|
|
224
|
+
@mixin badge
|
|
225
|
+
background: $primary-color
|
|
226
|
+
color: #fff
|
|
227
|
+
@include border-radius(20px)
|
|
228
|
+
margin-left: 10px
|
|
229
|
+
padding: 4px 10px
|
|
230
|
+
font-weight: bold
|
|
231
|
+
text-transform: uppercase
|
|
232
|
+
|
|
233
|
+
@mixin badge-success
|
|
234
|
+
background: $success
|
|
235
|
+
color: #fff !important
|
|
236
|
+
|
|
237
|
+
@mixin badge-error
|
|
238
|
+
background: $cancelled
|
|
239
|
+
color: #fff !important
|
|
240
|
+
|
|
241
|
+
@mixin badge-pending
|
|
242
|
+
background: $pending
|
|
243
|
+
color: darken($pending, 60%) !important
|
|
244
|
+
|
|
245
|
+
@mixin badge-deleted
|
|
246
|
+
background: $deleted
|
|
247
|
+
color: #999 !important
|
|
248
|
+
|
|
249
|
+
@mixin container-table
|
|
250
|
+
display: table
|
|
251
|
+
|
|
252
|
+
@mixin container-table-cell
|
|
253
|
+
display: table-cell
|
|
254
|
+
|
|
255
|
+
@mixin fa-input
|
|
256
|
+
position: absolute
|
|
257
|
+
top: 30%
|
|
258
|
+
left: 15px
|
|
259
|
+
color: $body-color
|
|
260
|
+
|
|
261
|
+
@include tablet-max
|
|
262
|
+
top: 34%
|
|
263
|
+
|
|
264
|
+
@include desktop
|
|
265
|
+
top: 30%
|
|
266
|
+
|
|
267
|
+
@mixin input
|
|
268
|
+
border: 1px solid $border-dark
|
|
269
|
+
width: 100%
|
|
270
|
+
@include border-radius(3px)
|
|
271
|
+
@include box-shadow(inset, 2px, 2px, 2px, lighten($border-dark, 20%))
|
|
272
|
+
outline: none
|
|
273
|
+
@include easeInOut
|
|
274
|
+
margin: 10px 0
|
|
275
|
+
@include body-font
|
|
276
|
+
vertical-align: top
|
|
277
|
+
|
|
278
|
+
&:focus
|
|
279
|
+
border: 1px solid $primary-color
|
|
280
|
+
@include box-shadow(0, 0, 5px, 0, $primary-color)
|
|
281
|
+
|
|
282
|
+
@mixin sidebar($width)
|
|
283
|
+
.ae-sidebar-left
|
|
284
|
+
width: $width
|
|
285
|
+
|
|
286
|
+
@include laptop
|
|
287
|
+
width: 250px
|
|
288
|
+
|
|
289
|
+
@mixin sidebar-fixed($width)
|
|
290
|
+
.ae-sidebar-left
|
|
291
|
+
width: $width
|
|
292
|
+
position: fixed
|
|
293
|
+
|
|
294
|
+
@include laptop
|
|
295
|
+
max-width: 250px
|
|
296
|
+
|
|
297
|
+
.ae-content
|
|
298
|
+
left: $width
|
|
299
|
+
|
|
300
|
+
@mixin sidebar-right($width)
|
|
301
|
+
.ae-content
|
|
302
|
+
right: $width
|
|
303
|
+
|
|
304
|
+
.ae-sidebar-right
|
|
305
|
+
width: $width
|
data/lib/express_ui/version.rb
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
module ExpressUi
|
|
2
2
|
module Generators
|
|
3
|
-
class
|
|
3
|
+
class InstallMixinsGenerator < Rails::Generators::Base
|
|
4
4
|
namespace "express_ui:install_mixins"
|
|
5
5
|
|
|
6
6
|
source_root File.expand_path('../../../../app/assets/stylesheets/express_ui/mixins', __FILE__)
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: express_ui
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.4.
|
|
4
|
+
version: 0.4.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Steven Talcott Smith
|
|
@@ -168,6 +168,7 @@ files:
|
|
|
168
168
|
- app/assets/javascripts/express_ui/search.js
|
|
169
169
|
- app/assets/javascripts/express_ui/sidebar.js
|
|
170
170
|
- app/assets/javascripts/express_ui/styleguide.js
|
|
171
|
+
- app/assets/stylesheets/_express_ui.sass
|
|
171
172
|
- app/assets/stylesheets/express_ui/application.sass
|
|
172
173
|
- app/assets/stylesheets/express_ui/atoms/_animations.sass
|
|
173
174
|
- app/assets/stylesheets/express_ui/atoms/_buttons.sass
|
|
@@ -303,7 +304,7 @@ files:
|
|
|
303
304
|
- lib/express_ui/engine.rb
|
|
304
305
|
- lib/express_ui/version.rb
|
|
305
306
|
- lib/generators/express_ui/USAGE
|
|
306
|
-
- lib/generators/express_ui/
|
|
307
|
+
- lib/generators/express_ui/install_mixins_generator.rb
|
|
307
308
|
- lib/tasks/express_ui_tasks.rake
|
|
308
309
|
- vendor/assets/javascripts/anchorific.js
|
|
309
310
|
- vendor/assets/javascripts/forms.js
|