semantic-ui-sass 0.8.1.0 → 0.8.2.0

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 (52) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +8 -0
  3. data/README.md +1 -1
  4. data/app/assets/javascripts/semantic-ui/dimmer.js +4 -2
  5. data/app/assets/javascripts/semantic-ui/modal.js +11 -6
  6. data/app/assets/javascripts/semantic-ui/popup.js +0 -1
  7. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +6 -2
  8. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +56 -73
  9. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +89 -53
  10. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +221 -316
  11. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +43 -88
  12. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +83 -23
  13. data/app/assets/stylesheets/semantic-ui/elements/_basic.icon.scss +831 -187
  14. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +189 -191
  15. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +4 -22
  16. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +43 -20
  17. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +1529 -472
  18. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +145 -152
  19. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +36 -63
  20. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +120 -175
  21. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +13 -11
  22. data/app/assets/stylesheets/semantic-ui/elements/_progress.scss +33 -115
  23. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +46 -101
  24. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +35 -65
  25. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +127 -170
  26. data/app/assets/stylesheets/semantic-ui/modules/_chatroom.scss +287 -269
  27. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +42 -129
  28. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +16 -49
  29. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +54 -107
  30. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +29 -22
  31. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +112 -147
  32. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +226 -230
  33. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +20 -28
  34. data/app/assets/stylesheets/semantic-ui/modules/_reveal.scss +35 -78
  35. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +27 -44
  36. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +10 -41
  37. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +31 -60
  38. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +3 -3
  39. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +219 -451
  40. data/app/assets/stylesheets/semantic-ui/modules/_video.scss +75 -79
  41. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +21 -23
  42. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +20 -8
  43. data/app/assets/stylesheets/semantic-ui/views/_item.scss +86 -43
  44. data/app/assets/stylesheets/semantic-ui/views/_list.scss +80 -53
  45. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +6 -1
  46. data/lib/semantic/ui/sass/version.rb +2 -2
  47. data/semantic-ui-sass.gemspec +1 -1
  48. data/spec/dummy/config/application.rb +1 -1
  49. data/spec/spec_helper.rb +0 -1
  50. data/tasks/converter.rb +7 -0
  51. metadata +4 -7
  52. data/spec/dummy/config/database.yml +0 -25
@@ -7,192 +7,149 @@
7
7
  * Released under the MIT license
8
8
  * http://opensource.org/licenses/MIT
9
9
  *
10
- */
11
-
10
+ */
11
+
12
12
  /*******************************
13
13
  Accordion
14
- *******************************/
15
-
16
- .ui.accordion {
17
- width: 600px;
18
- max-width: 100%;
19
- overflow: hidden;
20
-
21
- font-size: 1rem;
22
- border-radius: 0.3125em;
23
-
24
- background-color: #FFFFFF;
25
-
26
- -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
27
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
28
- box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
29
- }
30
-
31
- .ui.accordion .title {
32
- cursor: pointer;
33
-
34
- margin: 0em;
35
- padding: 0.75em 1em;
36
-
37
- color: rgba(0, 0, 0, 0.6);
38
-
39
- border-top: 1px solid rgba(0, 0, 0, 0.05);
40
-
41
- -webkit-transition:
42
- background-color 0.2s ease-out
43
- ;
44
- -moz-transition:
45
- background-color 0.2s ease-out
46
- ;
47
- -o-transition:
48
- background-color 0.2s ease-out
49
- ;
50
- -ms-transition:
51
- background-color 0.2s ease-out
52
- ;
53
- transition:
54
- background-color 0.2s ease-out
55
- ;
56
- }
57
- .ui.accordion .title:first-child {
58
- border-top: none;
59
- }
60
-
61
-
62
- /* Content */
63
- .ui.accordion .content {
64
- display: none;
65
- margin: 0em;
66
- padding: 1.3em 1em;
67
- }
68
-
69
- /* Arrow */
70
- .ui.accordion .title .dropdown.icon {
71
- display: inline-block;
72
- float: none;
73
- margin: 0em 0.5em 0em 0em;
74
-
75
- -webkit-transition:
76
- -webkit-transform 0.2s ease,
77
- opacity 0.2s ease
78
- ;
79
- -moz-transition:
80
- -moz-transform 0.2s ease,
81
- opacity 0.2s ease
82
- ;
83
- -o-transition:
84
- -o-transform 0.2s ease,
85
- opacity 0.2s ease
86
- ;
87
- -ms-transition:
88
- -ms-transform 0.2s ease,
89
- opacity 0.2s ease
90
- ;
91
- transition:
92
- transform 0.2s ease,
93
- opacity 0.2s ease
94
- ;
95
- -webkit-transform: rotate(0deg);
96
- -moz-transform: rotate(0deg);
97
- -o-transform: rotate(0deg);
98
- -ms-transform: rotate(0deg);
99
- transform: rotate(0deg);
100
- }
101
- .ui.accordion .title .dropdown.icon:before {
102
- content: '\f0da';
103
- }
104
-
14
+ *******************************/
15
+
16
+ .ui.accordion {
17
+ width: 600px;
18
+ max-width: 100%;
19
+ overflow: hidden;
20
+ font-size: 1rem;
21
+ border-radius: 0.3125em;
22
+ background-color: #FFFFFF;
23
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
24
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
25
+ }
26
+
27
+ .ui.accordion .title {
28
+ cursor: pointer;
29
+ margin: 0em;
30
+ padding: 0.75em 1em;
31
+ color: rgba(0, 0, 0, 0.6);
32
+ border-top: 1px solid rgba(0, 0, 0, 0.05);
33
+ -webkit-transition: background-color 0.2s ease-out;
34
+ transition: background-color 0.2s ease-out;
35
+ }
36
+
37
+ .ui.accordion .title:first-child {
38
+ border-top: none;
39
+ }
40
+
41
+ /* Content */
42
+
43
+ .ui.accordion .content {
44
+ display: none;
45
+ margin: 0em;
46
+ padding: 1.3em 1em;
47
+ }
48
+
49
+ /* Arrow */
50
+
51
+ .ui.accordion .title .dropdown.icon {
52
+ display: inline-block;
53
+ float: none;
54
+ margin: 0em 0.5em 0em 0em;
55
+ -webkit-transition: -webkit-transform 0.2s ease,
56
+ opacity 0.2s ease;
57
+ transition: transform 0.2s ease,
58
+ opacity 0.2s ease;
59
+ -webkit-transform: rotate(0deg);
60
+ -ms-transform: rotate(0deg);
61
+ transform: rotate(0deg);
62
+ }
63
+
64
+ .ui.accordion .title .dropdown.icon:before {
65
+ content: '\f0da';
66
+ }
67
+
105
68
  /*--------------
106
69
  Loose Coupling
107
- ---------------*/
108
-
109
- .ui.basic.accordion.menu {
110
- background-color: #FFFFFF;
111
- -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
112
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
113
- box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
114
- }
115
- .ui.basic.accordion.menu .title,
116
- .ui.basic.accordion.menu .content {
117
- padding: 0em;
118
- }
119
-
120
-
70
+ ---------------*/
71
+
72
+ .ui.basic.accordion.menu {
73
+ background-color: #FFFFFF;
74
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
75
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
76
+ }
77
+
78
+ .ui.basic.accordion.menu .title,
79
+ .ui.basic.accordion.menu .content {
80
+ padding: 0em;
81
+ }
82
+
121
83
  /*******************************
122
84
  Types
123
- *******************************/
124
-
85
+ *******************************/
86
+
125
87
  /*--------------
126
88
  Basic
127
- ---------------*/
128
-
129
- .ui.basic.accordion {
130
- background-color: transparent;
131
-
132
- -webkit-box-shadow: none;
133
- -moz-box-shadow: none;
134
- box-shadow: none;
135
- }
136
-
137
- .ui.basic.accordion .title,
138
- .ui.basic.accordion .title {
139
- background-color: transparent;
140
- border-top: none;
141
- padding-left: 0em;
142
- padding-right: 0em;
143
- }
144
-
145
- .ui.basic.accordion .content {
146
- padding: 0.5em 0em;
147
- }
148
-
149
- .ui.basic.accordion .active.title {
150
- background-color: transparent;
151
- }
152
-
153
-
89
+ ---------------*/
90
+
91
+ .ui.basic.accordion {
92
+ background-color: transparent;
93
+ -webkit-box-shadow: none;
94
+ box-shadow: none;
95
+ }
96
+
97
+ .ui.basic.accordion .title,
98
+ .ui.basic.accordion .title {
99
+ background-color: transparent;
100
+ border-top: none;
101
+ padding-left: 0em;
102
+ padding-right: 0em;
103
+ }
104
+
105
+ .ui.basic.accordion .content {
106
+ padding: 0.5em 0em;
107
+ }
108
+
109
+ .ui.basic.accordion .active.title {
110
+ background-color: transparent;
111
+ }
112
+
154
113
  /*******************************
155
114
  States
156
- *******************************/
157
-
158
-
115
+ *******************************/
116
+
159
117
  /*--------------
160
118
  Hover
161
- ---------------*/
162
-
163
- .ui.accordion .title:hover,
164
- .ui.accordion .active.title {
165
- color: rgba(0, 0, 0, 0.8);
166
- }
167
-
119
+ ---------------*/
120
+
121
+ .ui.accordion .title:hover,
122
+ .ui.accordion .active.title {
123
+ color: rgba(0, 0, 0, 0.8);
124
+ }
125
+
168
126
  /*--------------
169
127
  Active
170
- ---------------*/
171
-
172
- .ui.accordion .active.title {
173
- background-color: rgba(0, 0, 0, 0.1);
174
- color: rgba(0, 0, 0, 0.8);
175
- }
176
- .ui.accordion .active.title .dropdown.icon {
177
- -webkit-transform: rotate(90deg);
178
- -moz-transform: rotate(90deg);
179
- -o-transform: rotate(90deg);
180
- -ms-transform: rotate(90deg);
181
- transform: rotate(90deg);
182
- }
183
- .ui.accordion .active.content {
184
- display: block;
185
- }
186
-
187
-
128
+ ---------------*/
129
+
130
+ .ui.accordion .active.title {
131
+ background-color: rgba(0, 0, 0, 0.1);
132
+ color: rgba(0, 0, 0, 0.8);
133
+ }
134
+
135
+ .ui.accordion .active.title .dropdown.icon {
136
+ -webkit-transform: rotate(90deg);
137
+ -ms-transform: rotate(90deg);
138
+ transform: rotate(90deg);
139
+ }
140
+
141
+ .ui.accordion .active.content {
142
+ display: block;
143
+ }
144
+
188
145
  /*******************************
189
146
  Variations
190
- *******************************/
191
-
147
+ *******************************/
148
+
192
149
  /*--------------
193
150
  Fluid
194
- ---------------*/
195
-
196
- .ui.fluid.accordion {
197
- width: 100%;
151
+ ---------------*/
152
+
153
+ .ui.fluid.accordion {
154
+ width: 100%;
198
155
  }
@@ -7,275 +7,293 @@
7
7
  * Released under the MIT license
8
8
  * http://opensource.org/licenses/MIT
9
9
  *
10
- */
11
-
10
+ */
11
+
12
12
  /*******************************
13
13
  Chat Room
14
- *******************************/
15
-
16
- .ui.chatroom {
17
- background-color: #F8F8F8;
18
- width: 330px;
19
- height: 370px;
20
- padding: 0px;
21
- }
22
- .ui.chatroom .room {
23
- position: relative;
24
- background-color: #FFFFFF;
25
- overflow: hidden;
26
- height: 286px;
27
- border: 1px solid rgba(0, 0, 0, 0.1);
28
- border-top: none;
29
- border-bottom: none;
30
- }
31
- .ui.chatroom .room .loader {
32
- display: none;
33
- margin: -25px 0px 0px -25px;
34
- }
35
- /* Chat Room Actions */
36
- .ui.chatroom .actions {
37
- overflow: hidden;
38
- background-color: #EEEEEE;
39
- padding: 4px;
40
- border: 1px solid rgba(0, 0, 0, 0.1);
41
-
42
- -moz-border-radius: 5px 5px 0px 0px;
43
- -webkit-border-radius: 5px 5px 0px 0px;
44
- border-radius: 5px 5px 0px 0px;
45
- }
46
- .ui.chatroom .actions .button {
47
- float: right;
48
- margin-left: 3px;
49
- }
50
-
51
- /* Online User Count */
52
- .ui.chatroom .actions .message {
53
- float: left;
54
- margin-left: 6px;
55
- font-size: 11px;
56
- color: #AAAAAA;
57
- text-shadow: 0px -1px 0px rgba(255, 255, 255, 0.8);
58
- line-height: 28px;
59
- }
60
- .ui.chatroom .actions .message .loader {
61
- display: inline-block;
62
- margin-right: 8px;
63
- }
64
-
65
-
66
- /* Chat Room Text Log */
67
- .ui.chatroom .log {
68
- float: left;
69
-
70
- overflow: auto;
71
- overflow-x: hidden;
72
- overflow-y: auto;
73
- }
74
- .ui.chatroom .log .message {
75
- padding: 3px 0px;
76
- border-top: 1px dotted #DADADA;
77
- }
78
- .ui.chatroom .log .message:first-child {
79
- border-top: none;
80
- }
81
- /* status event */
82
- .ui.chatroom .status {
83
- padding: 5px 0px;
84
- color: #AAAAAA;
85
-
86
- font-size: 12px;
87
- font-style: italic;
88
- line-height: 1.33;
89
- border-top: 1px dotted #DADADA;
90
- }
91
- .ui.chatroom .log .status:first-child {
92
- border-top: none;
93
- }
94
-
95
-
96
-
97
- .ui.chatroom .log .flag {
98
- float: left;
99
- }
100
- .ui.chatroom .log p {
101
- margin-left: 0px;
102
- }
103
- .ui.chatroom .log .author {
104
- font-weight: bold;
105
- -webkit-transition: color 0.3s ease-out;
106
- -moz-transition: color 0.3s ease-out;
107
- -o-transition: color 0.3s ease-out;
108
- -ms-transition: color 0.3s ease-out;
109
- transition: color 0.3s ease-out;
110
- }
111
- .ui.chatroom .log a.author:hover {
112
- opacity: 0.8;
113
- }
114
-
115
- .ui.chatroom .log .message.admin p {
116
- font-weight: bold;
117
- margin: 1px 0px 0px 23px;
118
- }
119
- .ui.chatroom .log .divider {
120
- margin: -1px 0px;
121
- font-size: 11px;
122
- padding: 10px 0px;
123
- border-top: 1px solid #F8F8F8;
124
- border-bottom: 1px solid #F8F8F8;
125
- }
126
- .ui.chatroom .log .divider .rule {
127
- top: 50%;
128
- width: 15%;
129
- }
130
-
131
- .ui.chatroom .log .divider .label {
132
- color: #777777;
133
- margin: 0px;
134
- }
135
-
136
- /* Chat Room User List */
137
- .ui.chatroom .room .list {
138
- position: relative;
139
- overflow: auto;
140
- overflow-x: hidden;
141
- overflow-y: auto;
142
-
143
- float: left;
144
- background-color: #EEEEEE;
145
- border-left: 1px solid #DDDDDD;
146
- }
147
- .ui.chatroom .room .list .user {
148
- display: table;
149
- padding: 3px 7px;
150
- border-bottom: 1px solid #DDDDDD;
151
- }
152
- .ui.chatroom .room .list .user:hover {
153
- background-color: #F8F8F8;
154
- }
155
- .ui.chatroom .room .list .image {
156
- display: table-cell;
157
- vertical-align: middle;
158
- width: 20px;
159
- }
160
- .ui.chatroom .room .list .image img {
161
- width: 20px;
162
- height: 20px;
163
- vertical-align: middle;
164
- }
165
- .ui.chatroom .room .list p {
166
- display: table-cell;
167
- vertical-align: middle;
168
- padding-left: 7px;
169
- padding-right: 14px;
170
- font-size: 11px;
171
- line-height: 1.2;
172
- font-weight: bold;
173
- }
174
- .ui.chatroom .room .list a:hover {
175
- opacity: 0.8;
176
- }
177
-
178
- /* User List Loading */
179
- .ui.chatroom.loading .loader {
180
- display: block;
181
- }
182
-
183
-
184
-
185
- /* Chat Room Talk Input */
186
- .ui.chatroom .talk {
187
- border: 1px solid rgba(0, 0, 0, 0.1);
188
- padding: 5px 0px 0px;
189
-
190
- background-color: #EEEEEE;
191
-
192
- -webkit-border-radius: 0px 0px 5px 5px;
193
- -moz-border-radius: 0px 0px 5px 5px;
194
- border-radius: 0px 0px 5px 5px;
195
- }
196
- .ui.chatroom .talk .avatar,
197
- .ui.chatroom .talk input,
198
- .ui.chatroom .talk .button {
199
- float: left;
200
- }
201
-
202
- .ui.chatroom .talk .avatar img {
203
- display: block;
204
- width: 30px;
205
- height: 30px;
206
- margin-right: 4px;
207
- border-radius: 500rem;
208
- }
209
- .ui.chatroom .talk input {
210
- border: 1px solid #CCCCCC;
211
- margin: 0px;
212
- width: 196px;
213
- height: 14px;
214
- padding: 8px 5px;
215
- font-size: 12px;
216
- color: #555555;
217
- }
218
- .ui.chatroom .talk input.focus {
219
- border: 1px solid #AAAAAA;
220
- }
221
- .ui.chatroom .send {
222
- width: 80px;
223
- height: 32px;
224
-
225
- margin-left: -1px;
226
- padding: 4px 12px;
227
- font-size: 12px;
228
- line-height: 23px;
229
-
230
- -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
231
- -moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
232
- box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
233
-
234
- border-radius: 0 5px 5px 0;
235
- }
236
- .ui.chatroom .talk .log-in.button {
237
- display: block;
238
- float: none;
239
- margin-top: -6px;
240
- height: 22px;
241
- border-radius: 0px 0px 4px 4px;
242
- }
243
- .ui.chatroom .talk .log-in.button i {
244
- vertical-align: text-top;
245
- }
246
-
247
- /* Quirky Flags */
248
- .ui.chatroom .log .team.flag {
249
- width: 18px;
250
- }
251
-
252
- /* Chat room Loaded */
253
- .ui.chatroom.loading .loader {
254
- display: block;
255
- }
256
-
257
-
258
- /* Standard Size */
259
- .ui.chatroom {
260
- width: 330px;
261
- height: 370px;
262
- }
263
- .ui.chatroom .room .container {
264
- width: 3000px;
265
- }
266
- .ui.chatroom .log {
267
- width: 314px;
268
- height: 278px;
269
- padding: 4px 7px;
270
- }
271
- .ui.chatroom .room .list {
272
- width: 124px;
273
- height: 278px;
274
- padding: 4px 0px;
275
- }
276
- .ui.chatroom .room .list .user {
277
- width: 110px;
278
- }
279
- .ui.chatroom .talk {
280
- height: 40px;
14
+ *******************************/
15
+
16
+ .ui.chatroom {
17
+ background-color: #F8F8F8;
18
+ width: 330px;
19
+ height: 370px;
20
+ padding: 0px;
21
+ }
22
+
23
+ .ui.chatroom .room {
24
+ position: relative;
25
+ background-color: #FFFFFF;
26
+ overflow: hidden;
27
+ height: 286px;
28
+ border: 1px solid rgba(0, 0, 0, 0.1);
29
+ border-top: none;
30
+ border-bottom: none;
31
+ }
32
+
33
+ .ui.chatroom .room .loader {
34
+ display: none;
35
+ margin: -25px 0px 0px -25px;
36
+ }
37
+
38
+ /* Chat Room Actions */
39
+
40
+ .ui.chatroom .actions {
41
+ overflow: hidden;
42
+ background-color: #EEEEEE;
43
+ padding: 4px;
44
+ border: 1px solid rgba(0, 0, 0, 0.1);
45
+ border-radius: 5px 5px 0px 0px;
46
+ }
47
+
48
+ .ui.chatroom .actions .button {
49
+ float: right;
50
+ margin-left: 3px;
51
+ }
52
+
53
+ /* Online User Count */
54
+
55
+ .ui.chatroom .actions .message {
56
+ float: left;
57
+ margin-left: 6px;
58
+ font-size: 11px;
59
+ color: #AAAAAA;
60
+ text-shadow: 0px -1px 0px rgba(255, 255, 255, 0.8);
61
+ line-height: 28px;
62
+ }
63
+
64
+ .ui.chatroom .actions .message .loader {
65
+ display: inline-block;
66
+ margin-right: 8px;
67
+ }
68
+
69
+ /* Chat Room Text Log */
70
+
71
+ .ui.chatroom .log {
72
+ float: left;
73
+ overflow: auto;
74
+ overflow-x: hidden;
75
+ overflow-y: auto;
76
+ }
77
+
78
+ .ui.chatroom .log .message {
79
+ padding: 3px 0px;
80
+ border-top: 1px dotted #DADADA;
81
+ }
82
+
83
+ .ui.chatroom .log .message:first-child {
84
+ border-top: none;
85
+ }
86
+
87
+ /* status event */
88
+
89
+ .ui.chatroom .status {
90
+ padding: 5px 0px;
91
+ color: #AAAAAA;
92
+ font-size: 12px;
93
+ font-style: italic;
94
+ line-height: 1.33;
95
+ border-top: 1px dotted #DADADA;
96
+ }
97
+
98
+ .ui.chatroom .log .status:first-child {
99
+ border-top: none;
100
+ }
101
+
102
+ .ui.chatroom .log .flag {
103
+ float: left;
104
+ }
105
+
106
+ .ui.chatroom .log p {
107
+ margin-left: 0px;
108
+ }
109
+
110
+ .ui.chatroom .log .author {
111
+ font-weight: bold;
112
+ -webkit-transition: color 0.3s ease-out;
113
+ transition: color 0.3s ease-out;
114
+ }
115
+
116
+ .ui.chatroom .log a.author:hover {
117
+ opacity: 0.8;
118
+ }
119
+
120
+ .ui.chatroom .log .message.admin p {
121
+ font-weight: bold;
122
+ margin: 1px 0px 0px 23px;
123
+ }
124
+
125
+ .ui.chatroom .log .divider {
126
+ margin: -1px 0px;
127
+ font-size: 11px;
128
+ padding: 10px 0px;
129
+ border-top: 1px solid #F8F8F8;
130
+ border-bottom: 1px solid #F8F8F8;
131
+ }
132
+
133
+ .ui.chatroom .log .divider .rule {
134
+ top: 50%;
135
+ width: 15%;
136
+ }
137
+
138
+ .ui.chatroom .log .divider .label {
139
+ color: #777777;
140
+ margin: 0px;
141
+ }
142
+
143
+ /* Chat Room User List */
144
+
145
+ .ui.chatroom .room .list {
146
+ position: relative;
147
+ overflow: auto;
148
+ overflow-x: hidden;
149
+ overflow-y: auto;
150
+ float: left;
151
+ background-color: #EEEEEE;
152
+ border-left: 1px solid #DDDDDD;
153
+ }
154
+
155
+ .ui.chatroom .room .list .user {
156
+ display: table;
157
+ padding: 3px 7px;
158
+ border-bottom: 1px solid #DDDDDD;
159
+ }
160
+
161
+ .ui.chatroom .room .list .user:hover {
162
+ background-color: #F8F8F8;
163
+ }
164
+
165
+ .ui.chatroom .room .list .image {
166
+ display: table-cell;
167
+ vertical-align: middle;
168
+ width: 20px;
169
+ }
170
+
171
+ .ui.chatroom .room .list .image img {
172
+ width: 20px;
173
+ height: 20px;
174
+ vertical-align: middle;
175
+ }
176
+
177
+ .ui.chatroom .room .list p {
178
+ display: table-cell;
179
+ vertical-align: middle;
180
+ padding-left: 7px;
181
+ padding-right: 14px;
182
+ font-size: 11px;
183
+ line-height: 1.2;
184
+ font-weight: bold;
185
+ }
186
+
187
+ .ui.chatroom .room .list a:hover {
188
+ opacity: 0.8;
189
+ }
190
+
191
+ /* User List Loading */
192
+
193
+ .ui.chatroom.loading .loader {
194
+ display: block;
195
+ }
196
+
197
+ /* Chat Room Talk Input */
198
+
199
+ .ui.chatroom .talk {
200
+ border: 1px solid rgba(0, 0, 0, 0.1);
201
+ padding: 5px 0px 0px;
202
+ background-color: #EEEEEE;
203
+ border-radius: 0px 0px 5px 5px;
204
+ }
205
+
206
+ .ui.chatroom .talk .avatar,
207
+ .ui.chatroom .talk input,
208
+ .ui.chatroom .talk .button {
209
+ float: left;
210
+ }
211
+
212
+ .ui.chatroom .talk .avatar img {
213
+ display: block;
214
+ width: 30px;
215
+ height: 30px;
216
+ margin-right: 4px;
217
+ border-radius: 500rem;
218
+ }
219
+
220
+ .ui.chatroom .talk input {
221
+ border: 1px solid #CCCCCC;
222
+ margin: 0px;
223
+ width: 196px;
224
+ height: 14px;
225
+ padding: 8px 5px;
226
+ font-size: 12px;
227
+ color: #555555;
228
+ }
229
+
230
+ .ui.chatroom .talk input.focus {
231
+ border: 1px solid #AAAAAA;
232
+ }
233
+
234
+ .ui.chatroom .send {
235
+ width: 80px;
236
+ height: 32px;
237
+ margin-left: -1px;
238
+ padding: 4px 12px;
239
+ font-size: 12px;
240
+ line-height: 23px;
241
+ -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
242
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
243
+ border-radius: 0 5px 5px 0;
244
+ }
245
+
246
+ .ui.chatroom .talk .log-in.button {
247
+ display: block;
248
+ float: none;
249
+ margin-top: -6px;
250
+ height: 22px;
251
+ border-radius: 0px 0px 4px 4px;
252
+ }
253
+
254
+ .ui.chatroom .talk .log-in.button i {
255
+ vertical-align: text-top;
256
+ }
257
+
258
+ /* Quirky Flags */
259
+
260
+ .ui.chatroom .log .team.flag {
261
+ width: 18px;
262
+ }
263
+
264
+ /* Chat room Loaded */
265
+
266
+ .ui.chatroom.loading .loader {
267
+ display: block;
268
+ }
269
+
270
+ /* Standard Size */
271
+
272
+ .ui.chatroom {
273
+ width: 330px;
274
+ height: 370px;
275
+ }
276
+
277
+ .ui.chatroom .room .container {
278
+ width: 3000px;
279
+ }
280
+
281
+ .ui.chatroom .log {
282
+ width: 314px;
283
+ height: 278px;
284
+ padding: 4px 7px;
285
+ }
286
+
287
+ .ui.chatroom .room .list {
288
+ width: 124px;
289
+ height: 278px;
290
+ padding: 4px 0px;
291
+ }
292
+
293
+ .ui.chatroom .room .list .user {
294
+ width: 110px;
295
+ }
296
+
297
+ .ui.chatroom .talk {
298
+ height: 40px;
281
299
  }