semantic-ui 0.0.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.
Files changed (75) hide show
  1. checksums.yaml +7 -0
  2. data/lib/semantic-ui.rb +8 -0
  3. data/lib/semantic-ui/version.rb +5 -0
  4. data/vendor/assets/fonts/icons.eot +0 -0
  5. data/vendor/assets/fonts/icons.svg +450 -0
  6. data/vendor/assets/fonts/icons.ttf +0 -0
  7. data/vendor/assets/fonts/icons.woff +0 -0
  8. data/vendor/assets/images/loader-large-inverted.gif +0 -0
  9. data/vendor/assets/images/loader-large.gif +0 -0
  10. data/vendor/assets/images/loader-medium-inverted.gif +0 -0
  11. data/vendor/assets/images/loader-medium.gif +0 -0
  12. data/vendor/assets/images/loader-mini-inverted.gif +0 -0
  13. data/vendor/assets/images/loader-mini.gif +0 -0
  14. data/vendor/assets/images/loader-small-inverted.gif +0 -0
  15. data/vendor/assets/images/loader-small.gif +0 -0
  16. data/vendor/assets/javascripts/modules/accordion.js +411 -0
  17. data/vendor/assets/javascripts/modules/behavior/api.js +666 -0
  18. data/vendor/assets/javascripts/modules/behavior/colorize.js +271 -0
  19. data/vendor/assets/javascripts/modules/behavior/form.js +703 -0
  20. data/vendor/assets/javascripts/modules/behavior/state.js +752 -0
  21. data/vendor/assets/javascripts/modules/chatroom.js +766 -0
  22. data/vendor/assets/javascripts/modules/checkbox.js +348 -0
  23. data/vendor/assets/javascripts/modules/dimmer.js +524 -0
  24. data/vendor/assets/javascripts/modules/dropdown.js +707 -0
  25. data/vendor/assets/javascripts/modules/modal.js +478 -0
  26. data/vendor/assets/javascripts/modules/nag.js +542 -0
  27. data/vendor/assets/javascripts/modules/popup.js +721 -0
  28. data/vendor/assets/javascripts/modules/rating.js +358 -0
  29. data/vendor/assets/javascripts/modules/search.js +769 -0
  30. data/vendor/assets/javascripts/modules/shape.js +776 -0
  31. data/vendor/assets/javascripts/modules/sidebar.js +489 -0
  32. data/vendor/assets/javascripts/modules/tab.js +674 -0
  33. data/vendor/assets/javascripts/modules/transition.js +650 -0
  34. data/vendor/assets/javascripts/modules/video.js +459 -0
  35. data/vendor/assets/javascripts/semantic-ui.js +1 -0
  36. data/vendor/assets/stylesheets/collections/breadcrumb.less +79 -0
  37. data/vendor/assets/stylesheets/collections/form.less +536 -0
  38. data/vendor/assets/stylesheets/collections/grid.less +655 -0
  39. data/vendor/assets/stylesheets/collections/menu.less +1765 -0
  40. data/vendor/assets/stylesheets/collections/message.less +337 -0
  41. data/vendor/assets/stylesheets/collections/table.less +532 -0
  42. data/vendor/assets/stylesheets/elements/button.less +1190 -0
  43. data/vendor/assets/stylesheets/elements/divider.less +200 -0
  44. data/vendor/assets/stylesheets/elements/header.less +325 -0
  45. data/vendor/assets/stylesheets/elements/icon.less +484 -0
  46. data/vendor/assets/stylesheets/elements/image.less +170 -0
  47. data/vendor/assets/stylesheets/elements/input.less +300 -0
  48. data/vendor/assets/stylesheets/elements/label.less +824 -0
  49. data/vendor/assets/stylesheets/elements/loader.less +178 -0
  50. data/vendor/assets/stylesheets/elements/progress.less +353 -0
  51. data/vendor/assets/stylesheets/elements/segment.less +465 -0
  52. data/vendor/assets/stylesheets/elements/step.less +294 -0
  53. data/vendor/assets/stylesheets/modules/accordion.less +135 -0
  54. data/vendor/assets/stylesheets/modules/chatroom.less +271 -0
  55. data/vendor/assets/stylesheets/modules/checkbox.less +380 -0
  56. data/vendor/assets/stylesheets/modules/dimmer.less +230 -0
  57. data/vendor/assets/stylesheets/modules/dropdown.less +506 -0
  58. data/vendor/assets/stylesheets/modules/modal.less +160 -0
  59. data/vendor/assets/stylesheets/modules/nag.less +175 -0
  60. data/vendor/assets/stylesheets/modules/popup.less +238 -0
  61. data/vendor/assets/stylesheets/modules/rating.less +151 -0
  62. data/vendor/assets/stylesheets/modules/reveal.less +367 -0
  63. data/vendor/assets/stylesheets/modules/search.less +275 -0
  64. data/vendor/assets/stylesheets/modules/shape.less +115 -0
  65. data/vendor/assets/stylesheets/modules/sidebar.less +147 -0
  66. data/vendor/assets/stylesheets/modules/tab.less +59 -0
  67. data/vendor/assets/stylesheets/modules/transition.less +839 -0
  68. data/vendor/assets/stylesheets/modules/video.less +99 -0
  69. data/vendor/assets/stylesheets/semantic-ui.less +1 -0
  70. data/vendor/assets/stylesheets/views/comment.less +221 -0
  71. data/vendor/assets/stylesheets/views/feed.less +151 -0
  72. data/vendor/assets/stylesheets/views/item.less +641 -0
  73. data/vendor/assets/stylesheets/views/list.less +508 -0
  74. data/vendor/assets/stylesheets/views/statistic.css +27 -0
  75. metadata +187 -0
@@ -0,0 +1,294 @@
1
+ /*
2
+ * # Semantic Steps
3
+ * http://github.com/quirkyinc/semantic
4
+ *
5
+ *
6
+ * Copyright 2013 Contributors
7
+ * Released under the MIT license
8
+ * http://opensource.org/licenses/MIT
9
+ *
10
+ * Released: April 17 2013
11
+ */
12
+
13
+ /*******************************
14
+ Step
15
+ *******************************/
16
+
17
+ .ui.step,
18
+ .ui.steps .step {
19
+ display: inline-block;
20
+ position: relative;
21
+ padding: 1em 2em 1em 3em;
22
+
23
+ vertical-align: top;
24
+ background-color: #FFFFFF;
25
+ color: #888888;
26
+
27
+ -webkit-box-sizing: border-box;
28
+ -moz-box-sizing: border-box;
29
+ -ms-box-sizing: border-box;
30
+ box-sizing: border-box;
31
+ }
32
+ .ui.step:after,
33
+ .ui.steps .step:after {
34
+ position: absolute;
35
+ z-index: 2;
36
+ content: '';
37
+ top: 0em;
38
+ right: -1.45em;
39
+
40
+ border-bottom: 1.5em solid transparent;
41
+ border-left: 1.5em solid #FFFFFF;
42
+ border-top: 1.5em solid transparent;
43
+
44
+ width: 0em;
45
+ height: 0em;
46
+ }
47
+
48
+ .ui.step,
49
+ .ui.steps .step,
50
+ .ui.steps .step:after {
51
+ -webkit-transition:
52
+ opacity 0.1s ease,
53
+ color 0.1s ease,
54
+ box-shadow 0.1s ease
55
+ ;
56
+ -moz-transition:
57
+ opacity 0.1s ease,
58
+ color 0.1s ease,
59
+ box-shadow 0.1s ease
60
+ ;
61
+ -o-transition:
62
+ opacity 0.1s ease,
63
+ color 0.1s ease,
64
+ box-shadow 0.1s ease
65
+ ;
66
+ -ms-transition:
67
+ opacity 0.1s ease,
68
+ color 0.1s ease,
69
+ box-shadow 0.1s ease
70
+ ;
71
+ transition:
72
+ opacity 0.1s ease,
73
+ color 0.1s ease,
74
+ box-shadow 0.1s ease
75
+ ;
76
+ }
77
+
78
+ /*******************************
79
+ Group
80
+ *******************************/
81
+
82
+ .ui.steps {
83
+ cursor: pointer;
84
+ display: inline-block;
85
+ font-size: 0em;
86
+
87
+ -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
88
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
89
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
90
+
91
+ line-height: 1;
92
+
93
+ -webkit-box-sizing: border-box;
94
+ -moz-box-sizing: border-box;
95
+ -ms-box-sizing: border-box;
96
+ box-sizing: border-box;
97
+
98
+ -moz-border-radius: 0.3125rem;
99
+ -webkit-border-radius: 0.3125rem;
100
+ border-radius: 0.3125rem;
101
+ }
102
+
103
+ .ui.steps .step:first-child {
104
+ padding-left: 1.35em;
105
+ -webkit-border-radius: 0.3125em 0em 0em 0.3125em;
106
+ -moz-border-radius: 0.3125em 0em 0em 0.3125em;
107
+ border-radius: 0.3125em 0em 0em 0.3125em;
108
+ }
109
+ .ui.steps .step:last-child {
110
+ -webkit-border-radius: 0em 0.3125em 0.3125em 0em;
111
+ -moz-border-radius: 0em 0.3125em 0.3125em 0em;
112
+ border-radius: 0em 0.3125em 0.3125em 0em;
113
+ }
114
+ .ui.steps .step:only-child {
115
+ -webkit-border-radius: 0.3125em;
116
+ -moz-border-radius: 0.3125em;
117
+ border-radius: 0.3125em;
118
+ }
119
+
120
+ .ui.steps .step:last-child {
121
+ margin-right: 0em;
122
+ }
123
+ .ui.steps .step:last-child:after {
124
+ display: none;
125
+ }
126
+
127
+
128
+ /*******************************
129
+ States
130
+ *******************************/
131
+
132
+ /* Hover */
133
+ .ui.step:hover,
134
+ .ui.step.hover {
135
+ background-color: #F7F7F7;
136
+ color: rgba(0, 0, 0, 0.8);
137
+ }
138
+ .ui.steps .step.hover:after,
139
+ .ui.steps .step:hover:after,
140
+ .ui.step:hover,
141
+ .ui.step.hover::after {
142
+ border-left-color: #F7F7F7;
143
+ }
144
+
145
+ /* Hover */
146
+ .ui.steps .step.down,
147
+ .ui.steps .step:active,
148
+ .ui.step.down,
149
+ .ui.step:active {
150
+ background-color: #F0F0F0;
151
+ }
152
+ .ui.steps .step.down:after,
153
+ .ui.steps .step:active:after,
154
+ .ui.steps.down::after,
155
+ .ui.steps:active::after {
156
+ border-left-color: #F0F0F0;
157
+ }
158
+
159
+ /* Active */
160
+ .ui.steps .step.active,
161
+ .ui.active.step {
162
+ cursor: auto;
163
+ background-color: #555555;
164
+
165
+ color: #FFFFFF;
166
+ font-weight: bold;
167
+ }
168
+ .ui.steps .step.active:after,
169
+ .ui.active.steps:after {
170
+ border-left-color: #555555;
171
+ }
172
+
173
+ /* Disabled */
174
+ .ui.steps .disabled.step,
175
+ .ui.disabled.step {
176
+ cursor: auto;
177
+ background-color: #FFFFFF;
178
+ color: #CBCBCB;
179
+ }
180
+ .ui.disabled.step:after {
181
+ border: none;
182
+ background-color: #FFFFFF;
183
+ top: 0.42em;
184
+ right: -1em;
185
+
186
+ width: 2.15em;
187
+ height: 2.15em;
188
+
189
+ -webkit-transform: rotate(-45deg);
190
+ -moz-transform: rotate(-45deg);
191
+ -o-transform: rotate(-45deg);
192
+ -ms-transform: rotate(-45deg);
193
+ transform: rotate(-45deg);
194
+
195
+ -webkit-box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
196
+ -moz-box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
197
+ box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
198
+ }
199
+
200
+ /*******************************
201
+ Variations
202
+ *******************************/
203
+
204
+ /* Attached */
205
+ .attached.ui.steps {
206
+ margin: 0em;
207
+ -webkit-border-radius: 0.3125em 0.3125em 0em 0em;
208
+ -moz-border-radius: 0.3125em 0.3125em 0em 0em;
209
+ border-radius: 0.3125em 0.3125em 0em 0em;
210
+ }
211
+ .attached.ui.steps .step:first-child {
212
+ -webkit-border-radius: 0.3125em 0em 0em 0em;
213
+ -moz-border-radius: 0.3125em 0em 0em 0em;
214
+ border-radius: 0.3125em 0em 0em 0em;
215
+ }
216
+ .attached.ui.steps .step:last-child {
217
+ -webkit-border-radius: 0em 0.3125em 0em 0em;
218
+ -moz-border-radius: 0em 0.3125em 0em 0em;
219
+ border-radius: 0em 0.3125em 0em 0em;
220
+ }
221
+
222
+ /* Bottom Side */
223
+ .bottom.attached.ui.steps {
224
+ margin-top: -1px;
225
+ -webkit-border-radius: 0em 0em 0.3125em 0.3125em;
226
+ -moz-border-radius: 0em 0em 0.3125em 0.3125em;
227
+ border-radius: 0em 0em 0.3125em 0.3125em;
228
+ }
229
+ .bottom.attached.ui.steps .step:first-child {
230
+ -webkit-border-radius: 0em 0em 0em 0.3125em;
231
+ -moz-border-radius: 0em 0em 0em 0.3125em;
232
+ border-radius: 0em 0em 0em 0.3125em;
233
+ }
234
+ .bottom.attached.ui.steps .step:last-child {
235
+ -webkit-border-radius: 0em 0em 0.3125em 0em;
236
+ -moz-border-radius: 0em 0em 0.3125em 0em;
237
+ border-radius: 0em 0em 0.3125em 0em;
238
+ }
239
+
240
+
241
+ /* Evenly divided */
242
+ .ui.one.steps,
243
+ .ui.two.steps,
244
+ .ui.three.steps,
245
+ .ui.four.steps,
246
+ .ui.five.steps,
247
+ .ui.six.steps,
248
+ .ui.seven.steps,
249
+ .ui.eight.steps {
250
+ display: block;
251
+ }
252
+ .ui.one.steps > .step {
253
+ width: 100%;
254
+ }
255
+ .ui.two.steps > .step {
256
+ width: 50%;
257
+ }
258
+ .ui.three.steps > .step {
259
+ width: 33.333%;
260
+ }
261
+ .ui.four.steps > .step {
262
+ width: 25%;
263
+ }
264
+ .ui.five.steps > .step {
265
+ width: 20%;
266
+ }
267
+ .ui.six.steps > .step {
268
+ width: 16.666%;
269
+ }
270
+ .ui.seven.steps > .step {
271
+ width: 14.285%;
272
+ }
273
+ .ui.eight.steps > .step {
274
+ width: 12.500%;
275
+ }
276
+
277
+
278
+
279
+ /*******************************
280
+ Sizes
281
+ *******************************/
282
+
283
+ .ui.small.step,
284
+ .ui.small.steps .step {
285
+ font-size: 0.8rem;
286
+ }
287
+ .ui.step,
288
+ .ui.steps .step {
289
+ font-size: 1rem;
290
+ }
291
+ .ui.large.step,
292
+ .ui.large.steps .step {
293
+ font-size: 1.25rem;
294
+ }
@@ -0,0 +1,135 @@
1
+ /*
2
+ * # Semantic Accordion
3
+ * http://github.com/quirkyinc/semantic
4
+ *
5
+ *
6
+ * Copyright 2013 Contributors
7
+ * Released under the MIT license
8
+ * http://opensource.org/licenses/MIT
9
+ *
10
+ * Released: April 17 2013
11
+ */
12
+
13
+
14
+ /*******************************
15
+ Button
16
+ *******************************/
17
+
18
+ .ui.accordion {
19
+ width: 600px;
20
+ max-width: 100%;
21
+ overflow: hidden;
22
+
23
+ font-size: 1rem;
24
+ border-radius: 0.3125em;
25
+
26
+ background-color: #FFFFFF;
27
+
28
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
29
+ -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
30
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
31
+ }
32
+
33
+ .ui.accordion .title {
34
+ cursor: pointer;
35
+
36
+ margin: 0em;
37
+ padding: 0.75em 1em;
38
+
39
+ color: rgba(0, 0, 0, 0.6);
40
+
41
+ border-top: 1px solid rgba(0, 0, 0, 0.05);
42
+
43
+ -webkit-transition:
44
+ background-color 0.2s ease-out
45
+ ;
46
+ -moz-transition:
47
+ background-color 0.2s ease-out
48
+ ;
49
+ -o-transition:
50
+ background-color 0.2s ease-out
51
+ ;
52
+ -ms-transition:
53
+ background-color 0.2s ease-out
54
+ ;
55
+ transition:
56
+ background-color 0.2s ease-out
57
+ ;
58
+ }
59
+ .ui.accordion .title:first-child {
60
+ border-top: none;
61
+ }
62
+
63
+
64
+ /* Content */
65
+ .ui.accordion .content {
66
+ display: none;
67
+ margin: 0em;
68
+ padding: 1.3em 1em;
69
+ }
70
+
71
+
72
+ /*--------------
73
+ Loose Coupling
74
+ ---------------*/
75
+
76
+ .ui.basic.accordion.menu {
77
+ background-color: #FFFFFF;
78
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
79
+ -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
80
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
81
+ }
82
+ .ui.basic.accordion.menu .title,
83
+ .ui.basic.accordion.menu .content {
84
+ padding: 0em;
85
+ }
86
+
87
+
88
+ /*******************************
89
+ States
90
+ *******************************/
91
+
92
+
93
+ /*--------------
94
+ Hover
95
+ ---------------*/
96
+
97
+ .ui.accordion .title:hover,
98
+ .ui.accordion .title.active {
99
+ color: rgba(0, 0, 0, 0.8);
100
+ }
101
+
102
+
103
+ /*--------------
104
+ Active
105
+ ---------------*/
106
+ .ui.accordion .title.active {
107
+ background-color: rgba(0, 0, 0, 0.1);
108
+ color: rgba(0, 0, 0, 0.8);
109
+ }
110
+ .ui.accordion .content.active {
111
+ display: block;
112
+ }
113
+
114
+
115
+ /*******************************
116
+ Variations
117
+ *******************************/
118
+
119
+ .ui.basic.accordion {
120
+ background-color: transparent;
121
+
122
+ -webkit-box-shadow: none;
123
+ -moz-box-shadow: none;
124
+ box-shadow: none;
125
+ }
126
+ .ui.basic.accordion .title {
127
+ background-color: transparent;
128
+ border-top: none;
129
+ }
130
+
131
+ .ui.basic.accordion .title,
132
+ .ui.basic.accordion .content {
133
+ padding-left: 0em;
134
+ padding-right: 0em;
135
+ }
@@ -0,0 +1,271 @@
1
+
2
+ /*******************************
3
+ Chat Room
4
+ *******************************/
5
+
6
+ .ui.chatroom {
7
+ background-color: #F8F8F8;
8
+ width: 330px;
9
+ height: 370px;
10
+ padding: 0px;
11
+ }
12
+ .ui.chatroom .room {
13
+ position: relative;
14
+ background-color: #FFFFFF;
15
+ overflow: hidden;
16
+ height: 286px;
17
+ border: 1px solid rgba(0, 0, 0, 0.1);
18
+ border-top: none;
19
+ border-bottom: none;
20
+ }
21
+ .ui.chatroom .room .loader {
22
+ display: none;
23
+ margin: -25px 0px 0px -25px;
24
+ }
25
+ /* Chat Room Actions */
26
+ .ui.chatroom .actions {
27
+ overflow: hidden;
28
+ background-color: #EEEEEE;
29
+ padding: 4px;
30
+ border: 1px solid rgba(0, 0, 0, 0.1);
31
+
32
+ -moz-border-radius: 5px 5px 0px 0px;
33
+ -webkit-border-radius: 5px 5px 0px 0px;
34
+ border-radius: 5px 5px 0px 0px;
35
+ }
36
+ .ui.chatroom .actions .button {
37
+ float: right;
38
+ margin-left: 3px;
39
+ }
40
+
41
+ /* Online User Count */
42
+ .ui.chatroom .actions .message {
43
+ float: left;
44
+ margin-left: 6px;
45
+ font-size: 11px;
46
+ color: #AAAAAA;
47
+ text-shadow: 0px -1px 0px rgba(255, 255, 255, 0.8);
48
+ line-height: 28px;
49
+ }
50
+ .ui.chatroom .actions .message .loader {
51
+ display: inline-block;
52
+ margin-right: 8px;
53
+ }
54
+
55
+
56
+ /* Chat Room Text Log */
57
+ .ui.chatroom .log {
58
+ float: left;
59
+
60
+ overflow: auto;
61
+ overflow-x: hidden;
62
+ overflow-y: auto;
63
+ }
64
+ .ui.chatroom .log .message {
65
+ padding: 3px 0px;
66
+ border-top: 1px dotted #DADADA;
67
+ }
68
+ .ui.chatroom .log .message:first-child {
69
+ border-top: none;
70
+ }
71
+ /* status event */
72
+ .ui.chatroom .status {
73
+ padding: 5px 0px;
74
+ color: #AAAAAA;
75
+
76
+ font-size: 12px;
77
+ font-style: italic;
78
+ line-height: 1.33;
79
+ border-top: 1px dotted #DADADA;
80
+ }
81
+ .ui.chatroom .log .status:first-child {
82
+ border-top: none;
83
+ }
84
+
85
+
86
+
87
+ .ui.chatroom .log .flag {
88
+ float: left;
89
+ }
90
+ .ui.chatroom .log p {
91
+ margin-left: 0px;
92
+ }
93
+ .ui.chatroom .log .author {
94
+ font-weight: bold;
95
+ -webkit-transition: color 0.3s ease-out;
96
+ -moz-transition: color 0.3s ease-out;
97
+ -o-transition: color 0.3s ease-out;
98
+ -ms-transition: color 0.3s ease-out;
99
+ transition: color 0.3s ease-out;
100
+ }
101
+ .ui.chatroom .log a.author:hover {
102
+ opacity: 0.8;
103
+ }
104
+
105
+ .ui.chatroom .log .message.admin p {
106
+ font-weight: bold;
107
+ margin: 1px 0px 0px 23px;
108
+ }
109
+ .ui.chatroom .log .divider {
110
+ margin: -1px 0px;
111
+ font-size: 11px;
112
+ padding: 10px 0px;
113
+ border-top: 1px solid #F8F8F8;
114
+ border-bottom: 1px solid #F8F8F8;
115
+ }
116
+ .ui.chatroom .log .divider .rule {
117
+ top: 50%;
118
+ width: 15%;
119
+ }
120
+
121
+ .ui.chatroom .log .divider .label {
122
+ color: #777777;
123
+ margin: 0px;
124
+ }
125
+
126
+ /* Chat Room User List */
127
+ .ui.chatroom .room .list {
128
+ position: relative;
129
+ overflow: auto;
130
+ overflow-x: hidden;
131
+ overflow-y: auto;
132
+
133
+ float: left;
134
+ background-color: #EEEEEE;
135
+ border-left: 1px solid #DDDDDD;
136
+ }
137
+ .ui.chatroom .room .list .user {
138
+ display: table;
139
+ padding: 3px 7px;
140
+ border-bottom: 1px solid #DDDDDD;
141
+ }
142
+ .ui.chatroom .room .list .user:hover {
143
+ background-color: #F8F8F8;
144
+ }
145
+ .ui.chatroom .room .list .image {
146
+ display: table-cell;
147
+ vertical-align: middle;
148
+ width: 20px;
149
+ }
150
+ .ui.chatroom .room .list .image img {
151
+ width: 20px;
152
+ height: 20px;
153
+ vertical-align: middle;
154
+ }
155
+ .ui.chatroom .room .list p {
156
+ display: table-cell;
157
+ vertical-align: middle;
158
+ padding-left: 7px;
159
+ padding-right: 14px;
160
+ font-size: 11px;
161
+ line-height: 1.2;
162
+ font-weight: bold;
163
+ }
164
+ .ui.chatroom .room .list a:hover {
165
+ opacity: 0.8;
166
+ }
167
+
168
+ /* User List Loading */
169
+ .ui.chatroom.loading .loader {
170
+ display: block;
171
+ }
172
+
173
+
174
+
175
+ /* Chat Room Talk Input */
176
+ .ui.chatroom .talk {
177
+ border: 1px solid rgba(0, 0, 0, 0.1);
178
+ padding: 5px 0px 0px;
179
+
180
+ background-color: #EEEEEE;
181
+
182
+ -webkit-border-radius: 0px 0px 5px 5px;
183
+ -moz-border-radius: 0px 0px 5px 5px;
184
+ border-radius: 0px 0px 5px 5px;
185
+ }
186
+ .ui.chatroom .talk .avatar,
187
+ .ui.chatroom .talk input,
188
+ .ui.chatroom .talk .button {
189
+ float: left;
190
+ }
191
+
192
+ .ui.chatroom .talk .avatar img {
193
+ display: block;
194
+ width: 30px;
195
+ height: 30px;
196
+ margin-right: 4px;
197
+ border-radius: 500rem;
198
+ }
199
+ .ui.chatroom .talk input {
200
+ border: 1px solid #CCCCCC;
201
+ margin: 0px;
202
+ width: 196px;
203
+ height: 14px;
204
+ padding: 8px 5px;
205
+ font-size: 12px;
206
+ color: #555555;
207
+ }
208
+ .ui.chatroom .talk input.focus {
209
+ border: 1px solid #AAAAAA;
210
+ }
211
+ .ui.chatroom .send {
212
+ width: 80px;
213
+ height: 32px;
214
+
215
+ margin-left: -1px;
216
+ padding: 4px 12px;
217
+ font-size: 12px;
218
+ line-height: 23px;
219
+
220
+ -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
221
+ -moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
222
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
223
+
224
+ border-radius: 0 5px 5px 0;
225
+ }
226
+ .ui.chatroom .talk .log-in.button {
227
+ display: block;
228
+ float: none;
229
+ margin-top: -6px;
230
+ height: 22px;
231
+ border-radius: 0px 0px 4px 4px;
232
+ }
233
+ .ui.chatroom .talk .log-in.button i {
234
+ vertical-align: text-top;
235
+ }
236
+
237
+ /* Quirky Flags */
238
+ .ui.chatroom .log .team.flag {
239
+ width: 18px;
240
+ }
241
+
242
+ /* Chat room Loaded */
243
+ .ui.chatroom.loading .loader {
244
+ display: block;
245
+ }
246
+
247
+
248
+ /* Standard Size */
249
+ .ui.chatroom {
250
+ width: 330px;
251
+ height: 370px;
252
+ }
253
+ .ui.chatroom .room .container {
254
+ width: 3000px;
255
+ }
256
+ .ui.chatroom .log {
257
+ width: 314px;
258
+ height: 278px;
259
+ padding: 4px 7px;
260
+ }
261
+ .ui.chatroom .room .list {
262
+ width: 124px;
263
+ height: 278px;
264
+ padding: 4px 0px;
265
+ }
266
+ .ui.chatroom .room .list .user {
267
+ width: 110px;
268
+ }
269
+ .ui.chatroom .talk {
270
+ height: 40px;
271
+ }