semantic-ui-rails 0.6.5 → 0.7.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 (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,