semantic-ui-rails 0.6.5 → 0.7.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (42) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +5 -0
  3. data/lib/semantic/ui/rails/version.rb +1 -1
  4. data/vendor/assets/javascripts/semantic-ui/modules/accordion.js +13 -16
  5. data/vendor/assets/javascripts/semantic-ui/modules/behavior/api.js +18 -22
  6. data/vendor/assets/javascripts/semantic-ui/modules/behavior/form.js +18 -24
  7. data/vendor/assets/javascripts/semantic-ui/modules/behavior/state.js +8 -8
  8. data/vendor/assets/javascripts/semantic-ui/modules/chatroom.js +18 -14
  9. data/vendor/assets/javascripts/semantic-ui/modules/checkbox.js +26 -24
  10. data/vendor/assets/javascripts/semantic-ui/modules/dimmer.js +70 -48
  11. data/vendor/assets/javascripts/semantic-ui/modules/dropdown.js +47 -46
  12. data/vendor/assets/javascripts/semantic-ui/modules/modal.js +44 -30
  13. data/vendor/assets/javascripts/semantic-ui/modules/nag.js +13 -16
  14. data/vendor/assets/javascripts/semantic-ui/modules/popup.js +347 -261
  15. data/vendor/assets/javascripts/semantic-ui/modules/rating.js +18 -22
  16. data/vendor/assets/javascripts/semantic-ui/modules/search.js +18 -24
  17. data/vendor/assets/javascripts/semantic-ui/modules/shape.js +182 -173
  18. data/vendor/assets/javascripts/semantic-ui/modules/sidebar.js +65 -42
  19. data/vendor/assets/javascripts/semantic-ui/modules/tab.js +47 -30
  20. data/vendor/assets/javascripts/semantic-ui/modules/transition.js +23 -23
  21. data/vendor/assets/javascripts/semantic-ui/modules/video.js +18 -22
  22. data/vendor/assets/stylesheets/semantic-ui/collections/grid.less +1 -1
  23. data/vendor/assets/stylesheets/semantic-ui/collections/menu.less +8 -3
  24. data/vendor/assets/stylesheets/semantic-ui/collections/message.less +6 -7
  25. data/vendor/assets/stylesheets/semantic-ui/collections/table.less +76 -23
  26. data/vendor/assets/stylesheets/semantic-ui/elements/button.less +163 -167
  27. data/vendor/assets/stylesheets/semantic-ui/elements/header.less +1 -1
  28. data/vendor/assets/stylesheets/semantic-ui/elements/icon.less +8 -10
  29. data/vendor/assets/stylesheets/semantic-ui/elements/input.less +0 -2
  30. data/vendor/assets/stylesheets/semantic-ui/elements/label.less +54 -5
  31. data/vendor/assets/stylesheets/semantic-ui/elements/segment.less +0 -9
  32. data/vendor/assets/stylesheets/semantic-ui/modules/accordion.less +197 -198
  33. data/vendor/assets/stylesheets/semantic-ui/modules/checkbox.less +17 -21
  34. data/vendor/assets/stylesheets/semantic-ui/modules/dimmer.less +4 -27
  35. data/vendor/assets/stylesheets/semantic-ui/modules/dropdown.less +28 -28
  36. data/vendor/assets/stylesheets/semantic-ui/modules/popup.less +255 -255
  37. data/vendor/assets/stylesheets/semantic-ui/modules/rating.less +1 -1
  38. data/vendor/assets/stylesheets/semantic-ui/modules/shape.less +81 -7
  39. data/vendor/assets/stylesheets/semantic-ui/modules/sidebar.less +129 -28
  40. data/vendor/assets/stylesheets/semantic-ui/modules/transition.less +12 -10
  41. data/vendor/assets/stylesheets/semantic-ui/views/list.less +6 -6
  42. metadata +2 -2
@@ -18,7 +18,7 @@
18
18
 
19
19
  font-size: 0em;
20
20
  vertical-align: baseline;
21
- margin: 0em 0.5em 0em 0em;
21
+ margin: 0em 0.5rem 0em 0em;
22
22
  }
23
23
  .ui.rating:last-child {
24
24
  margin-right: 0em;
@@ -14,12 +14,19 @@
14
14
  *******************************/
15
15
 
16
16
  .ui.shape {
17
+ display: inline-block;
17
18
  position: relative;
18
19
 
19
20
  -webkit-perspective: 2000px;
20
21
  -moz-perspective: 2000px;
21
22
  -ms-perspective: 2000px;
22
23
  perspective: 2000px;
24
+
25
+ -webkit-box-sizing: border-box;
26
+ -moz-box-sizing: border-box;
27
+ -ms-box-sizing: border-box;
28
+ box-sizing: border-box;
29
+
23
30
  }
24
31
 
25
32
  .ui.shape .sides {
@@ -32,10 +39,18 @@
32
39
  .ui.shape .side {
33
40
  opacity: 1;
34
41
  width: 100%;
42
+
43
+ margin: 0em !important;
44
+
35
45
  -webkit-backface-visibility: hidden;
36
46
  -moz-backface-visibility: hidden;
37
47
  -ms-backface-visibility: hidden;
38
48
  backface-visibility: hidden;
49
+
50
+ -webkit-box-sizing: border-box;
51
+ -moz-box-sizing: border-box;
52
+ -ms-box-sizing: border-box;
53
+ box-sizing: border-box;
39
54
  }
40
55
 
41
56
  .ui.shape .side {
@@ -43,22 +58,77 @@
43
58
  }
44
59
 
45
60
 
61
+ /*******************************
62
+ Types
63
+ *******************************/
64
+
65
+ .ui.cube.shape .side {
66
+ min-width: 15em;
67
+ height: 15em;
68
+
69
+ padding: 2em;
70
+
71
+ background-color: #E6E6E6;
72
+ color: rgba(0, 0, 0, 0.6);
73
+
74
+ -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
75
+ -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
76
+ box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
77
+ }
78
+ .ui.cube.shape .side > .content {
79
+ width: 100%;
80
+ height: 100%;
81
+ display: table;
82
+
83
+ text-align: center;
84
+
85
+ -webkit-user-select: text;
86
+ -moz-user-select: text;
87
+ -ms-user-select: text;
88
+ user-select: text;
89
+ }
90
+ .ui.cube.shape .side > .content > div {
91
+ display: table-cell;
92
+ vertical-align: middle;
93
+ font-size: 2em;
94
+ }
46
95
 
47
96
  /*******************************
48
- States
97
+ Variations
49
98
  *******************************/
50
99
 
100
+ .ui.text.shape.animating .sides {
101
+ position: static;
102
+ }
103
+ .ui.text.shape .side {
104
+ white-space: nowrap;
105
+ }
106
+ .ui.text.shape .side > * {
107
+ white-space: normal;
108
+ }
109
+
110
+
111
+ /*******************************
112
+ States
113
+ *******************************/
51
114
 
52
115
  /*--------------
53
- Animating
116
+ Loading
54
117
  ---------------*/
55
118
 
56
- .ui.shape.animating .sides {
119
+ .ui.loading.shape {
57
120
  position: absolute;
121
+ top: -9999px;
122
+ left: -9999px;
58
123
  }
124
+
125
+
126
+ /*--------------
127
+ Animating
128
+ ---------------*/
129
+
59
130
  .ui.shape .animating.side {
60
131
  position: absolute;
61
- width: 100%;
62
132
  top: 0px;
63
133
  left: 0px;
64
134
  z-index: 100;
@@ -72,7 +142,7 @@
72
142
  CSS
73
143
  ---------------*/
74
144
 
75
- .ui.shape.css {
145
+ .ui.shape.animating {
76
146
  -webkit-transition:
77
147
  all 0.6s ease-in-out;
78
148
  ;
@@ -89,14 +159,17 @@
89
159
  all 0.6s ease-in-out;
90
160
  ;
91
161
  }
92
- .ui.shape.css .sides {
162
+ .ui.shape.animating .sides {
163
+ position: absolute;
164
+ }
165
+ .ui.shape.animating .sides {
93
166
  -webkit-transition: all 0.6s ease-in-out;
94
167
  -moz-transition: all 0.6s ease-in-out;
95
168
  -o-transition: all 0.6s ease-in-out;
96
169
  -ms-transition: all 0.6s ease-in-out;
97
170
  transition: all 0.6s ease-in-out;
98
171
  }
99
- .ui.shape.css .side {
172
+ .ui.shape.animating .side {
100
173
  -webkit-transition: opacity 0.6s ease-in-out;
101
174
  -moz-transition: opacity 0.6s ease-in-out;
102
175
  -o-transition: opacity 0.6s ease-in-out;
@@ -104,6 +177,7 @@
104
177
  transition: opacity 0.6s ease-in-out;
105
178
  }
106
179
 
180
+
107
181
  /*--------------
108
182
  Active
109
183
  ---------------*/
@@ -40,13 +40,17 @@ body {
40
40
 
41
41
  margin: 0 !important;
42
42
 
43
- width: 275px !important;
44
43
  height: 100% !important;
45
44
 
46
45
  -webkit-border-radius: 0px !important;
47
46
  -moz-border-radius: 0px !important;
48
47
  border-radius: 0px !important;
49
48
 
49
+ -webkit-box-sizing: border-box;
50
+ -moz-box-sizing: border-box;
51
+ -ms-box-sizing: border-box;
52
+ box-sizing: border-box;
53
+
50
54
  -ms-overflow-y: auto;
51
55
  overflow-y: auto;
52
56
  top: 0px;
@@ -77,12 +81,13 @@ body {
77
81
 
78
82
 
79
83
  /*******************************
80
- Types
84
+ Types
81
85
  *******************************/
82
86
 
83
- .ui.sidebar {
84
- margin-left: -275px !important;
85
- }
87
+ /*-------------------
88
+ Direction
89
+ --------------------*/
90
+
86
91
 
87
92
  .ui.right.sidebar {
88
93
  left: 100%;
@@ -90,14 +95,11 @@ body {
90
95
  }
91
96
 
92
97
  .ui.top.sidebar {
93
- margin: -40px 0px 0px 0px !important;
94
98
  width: 100% !important;
95
- height: 40px !important;
96
99
  }
97
100
 
98
101
  .ui.bottom.sidebar {
99
102
  width: 100% !important;
100
- height: 40px !important;
101
103
  top: 100%;
102
104
  margin: 0px !important;
103
105
  }
@@ -110,41 +112,140 @@ body {
110
112
  .ui.active.sidebar {
111
113
  margin-left: 0px !important;
112
114
  }
113
- .ui.active.right.sidebar {
114
- margin-left: -275px !important;
115
- }
116
-
117
- .ui.active.top.sidebar {
118
- margin-top: 0px !important;
119
- }
115
+ .ui.active.top.sidebar,
120
116
  .ui.active.bottom.sidebar {
121
- margin-top: -40px !important;
117
+ margin-top: 0px !important;
122
118
  }
123
119
 
120
+
124
121
  /*******************************
125
122
  Variations
126
123
  *******************************/
127
124
 
125
+ /*-------------------
126
+ Formatted
127
+ --------------------*/
128
+
129
+ .ui.styled.sidebar {
130
+ padding: 1em 1.5em;
131
+ background-color: #FFFFFF;
132
+ box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1);
133
+ }
134
+ .ui.styled.very.thin.sidebar {
135
+ padding: 0.5em;
136
+ }
137
+ .ui.styled.thin.sidebar {
138
+ padding: 1em;
139
+ }
140
+
141
+
142
+ /*-------------------
143
+ Floating
144
+ --------------------*/
145
+
128
146
  .ui.floating.sidebar {
129
- -webkit-box-shadow: 3px 0px 3px rgba(0, 0, 0, 0.2);
130
- -moz-box-shadow: 3px 0px 3px rgba(0, 0, 0, 0.2);
131
- box-shadow: 3px 0px 3px rgba(0, 0, 0, 0.2);
147
+ -webkit-box-shadow: 2px 0px 2px rgba(0, 0, 0, 0.2);
148
+ -moz-box-shadow: 2px 0px 2px rgba(0, 0, 0, 0.2);
149
+ box-shadow: 2px 0px 2px rgba(0, 0, 0, 0.2);
132
150
  }
133
151
 
134
152
  .ui.right.floating.sidebar {
135
- -webkit-box-shadow: -3px 0px 3px rgba(0, 0, 0, 0.2);
136
- -moz-box-shadow: -3px 0px 3px rgba(0, 0, 0, 0.2);
137
- box-shadow: -3px 0px 3px rgba(0, 0, 0, 0.2);
153
+ -webkit-box-shadow: -2px 0px 2px rgba(0, 0, 0, 0.2);
154
+ -moz-box-shadow: -2px 0px 2px rgba(0, 0, 0, 0.2);
155
+ box-shadow: -2px 0px 2px rgba(0, 0, 0, 0.2);
138
156
  }
139
157
 
140
158
  .ui.top.floating.sidebar {
141
- -webkit-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
142
- -moz-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
143
- box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
159
+ -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2);
160
+ -moz-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2);
161
+ box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2);
144
162
  }
145
163
 
146
164
  .ui.bottom.floating.sidebar {
147
- -webkit-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
148
- -moz-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
149
- box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
165
+ -webkit-box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.2);
166
+ -moz-box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.2);
167
+ box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.2);
168
+ }
169
+
170
+
171
+ /*-------------------
172
+ Width
173
+ --------------------*/
174
+
175
+ /* Very Thin */
176
+ .ui.very.thin.sidebar {
177
+ width: 60px !important;
178
+ margin-left: -60px !important;
179
+ }
180
+ .ui.active.very.thin.sidebar {
181
+ margin-left: 0px !important;
182
+ }
183
+ .ui.active.right.very.thin.sidebar {
184
+ margin-left: -60px !important;
185
+ }
186
+
187
+ /* Thin */
188
+ .ui.thin.sidebar {
189
+ width: 200px !important;
190
+ margin-left: -200px !important;
191
+ }
192
+ .ui.active.thin.sidebar {
193
+ margin-left: 0px !important;
194
+ }
195
+ .ui.active.right.thin.sidebar {
196
+ margin-left: -200px !important;
197
+ }
198
+
199
+ /* Standard */
200
+ .ui.sidebar {
201
+ width: 275px !important;
202
+ margin-left: -275px !important;
203
+ }
204
+ .ui.active.sidebar {
205
+ margin-left: 0px !important;
206
+ }
207
+ .ui.active.right.sidebar {
208
+ margin-left: -275px !important;
209
+ }
210
+
211
+ /* Wide */
212
+ .ui.wide.sidebar {
213
+ width: 350px !important;
214
+ margin-left: -350px !important;
215
+ }
216
+ .ui.active.wide.sidebar {
217
+ margin-left: 0px !important;
218
+ }
219
+ .ui.active.right.wide.sidebar {
220
+ margin-left: -350px !important;
150
221
  }
222
+
223
+ /* Very Wide */
224
+ .ui.very.wide.sidebar {
225
+ width: 475px !important;
226
+ margin-left: -475px !important;
227
+ }
228
+ .ui.active.very.wide.sidebar {
229
+ margin-left: 0px !important;
230
+ }
231
+ .ui.active.right.very.wide.sidebar {
232
+ margin-left: -475px !important;
233
+ }
234
+
235
+
236
+
237
+ /*-------------------
238
+ Height
239
+ --------------------*/
240
+
241
+ /* Standard */
242
+ .ui.top.sidebar {
243
+ margin: -40px 0px 0px 0px !important;
244
+ }
245
+ .ui.top.sidebar,
246
+ .ui.bottom.sidebar {
247
+ height: 40px !important;
248
+ }
249
+ .ui.active.bottom.sidebar {
250
+ margin-top: -40px !important;
251
+ }
@@ -14,12 +14,6 @@
14
14
 
15
15
 
16
16
  .ui.transition {
17
- -webkit-backface-visibility: hidden;
18
- -moz-backface-visibility: hidden;
19
- -ms-backface-visibility: hidden;
20
- -o-backface-visibility: hidden;
21
- backface-visibility: hidden;
22
-
23
17
  -webkit-animation-iteration-count: 1;
24
18
  -moz-animation-iteration-count: 1;
25
19
  -ms-animation-iteration-count: 1;
@@ -40,6 +34,18 @@
40
34
  -ms-animation-fill-mode: both;
41
35
  -o-animation-fill-mode: both;
42
36
  animation-fill-mode: both;
37
+ }
38
+
39
+ /*******************************
40
+ States
41
+ *******************************/
42
+
43
+ .ui.animating.transition {
44
+ -webkit-backface-visibility: hidden;
45
+ -moz-backface-visibility: hidden;
46
+ -ms-backface-visibility: hidden;
47
+ -o-backface-visibility: hidden;
48
+ backface-visibility: hidden;
43
49
 
44
50
  -webkit-transform: translateZ(0);
45
51
  -moz-transform: translateZ(0);
@@ -48,10 +54,6 @@
48
54
  transform: translateZ(0);
49
55
  }
50
56
 
51
- /*******************************
52
- States
53
- *******************************/
54
-
55
57
  /* Loading */
56
58
  .ui.loading.transition {
57
59
  position: absolute;
@@ -70,8 +70,8 @@ ol.ui.list li,
70
70
  .ui.list .item > .icon {
71
71
  display: table-cell;
72
72
  margin: 0em;
73
- padding: 0em 0.5em 0em 0em;
74
- vertical-align: middle;
73
+ padding: 0.1em 0.5em 0em 0em;
74
+ vertical-align: top;
75
75
  }
76
76
  .ui.list .item > .icon:only-child {
77
77
  display: inline-block;
@@ -265,7 +265,7 @@ ol.ui.list li,
265
265
 
266
266
  ul.ui.list,
267
267
  .ui.bulleted.list {
268
- margin-left: 1em;
268
+ margin-left: 1.5em;
269
269
  }
270
270
  ul.ui.list li,
271
271
  .ui.bulleted.list .item {
@@ -274,7 +274,7 @@ ul.ui.list li,
274
274
  ul.ui.list li:before,
275
275
  .ui.bulleted.list .item:before {
276
276
  position: absolute;
277
- left: -1em;
277
+ left: -1.5em;
278
278
  content: '•';
279
279
 
280
280
  line-height: 1.2rem;
@@ -283,7 +283,7 @@ ul.ui.list li:before,
283
283
 
284
284
  ul.ui.list ul,
285
285
  .ui.bulleted.list .list {
286
- padding-left: 1.2em;
286
+ padding-left: 1.5em;
287
287
  }
288
288
 
289
289
  /* Horizontal Bulleted */
@@ -339,7 +339,7 @@ ol.ui.list li:before,
339
339
  ol.ui.list ol,
340
340
  .ui.ordered.list .list {
341
341
  counter-reset: ordered;
342
- padding-left: 3em;
342
+ padding-left: 2.5em;
343
343
  }
344
344
 
345
345
  ol.ui.list ol li:before,