fomantic-ui-sass 2.6.4

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 (165) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +27 -0
  3. data/.rspec +1 -0
  4. data/.travis.yml +5 -0
  5. data/CHANGELOG.md +370 -0
  6. data/Gemfile +4 -0
  7. data/LICENSE.txt +22 -0
  8. data/README.md +177 -0
  9. data/Rakefile +8 -0
  10. data/app/assets/fonts/semantic-ui/brand-icons.eot +0 -0
  11. data/app/assets/fonts/semantic-ui/brand-icons.svg +1008 -0
  12. data/app/assets/fonts/semantic-ui/brand-icons.ttf +0 -0
  13. data/app/assets/fonts/semantic-ui/brand-icons.woff +0 -0
  14. data/app/assets/fonts/semantic-ui/brand-icons.woff2 +0 -0
  15. data/app/assets/fonts/semantic-ui/icons.eot +0 -0
  16. data/app/assets/fonts/semantic-ui/icons.otf +0 -0
  17. data/app/assets/fonts/semantic-ui/icons.svg +1518 -0
  18. data/app/assets/fonts/semantic-ui/icons.ttf +0 -0
  19. data/app/assets/fonts/semantic-ui/icons.woff +0 -0
  20. data/app/assets/fonts/semantic-ui/icons.woff2 +0 -0
  21. data/app/assets/fonts/semantic-ui/outline-icons.eot +0 -0
  22. data/app/assets/fonts/semantic-ui/outline-icons.svg +366 -0
  23. data/app/assets/fonts/semantic-ui/outline-icons.ttf +0 -0
  24. data/app/assets/fonts/semantic-ui/outline-icons.woff +0 -0
  25. data/app/assets/fonts/semantic-ui/outline-icons.woff2 +0 -0
  26. data/app/assets/images/semantic-ui/flags.png +0 -0
  27. data/app/assets/javascripts/semantic-ui.js +27 -0
  28. data/app/assets/javascripts/semantic-ui/accordion.js +613 -0
  29. data/app/assets/javascripts/semantic-ui/api.js +1167 -0
  30. data/app/assets/javascripts/semantic-ui/calendar.js +1476 -0
  31. data/app/assets/javascripts/semantic-ui/checkbox.js +828 -0
  32. data/app/assets/javascripts/semantic-ui/colorize.js +280 -0
  33. data/app/assets/javascripts/semantic-ui/dimmer.js +735 -0
  34. data/app/assets/javascripts/semantic-ui/dropdown.js +4030 -0
  35. data/app/assets/javascripts/semantic-ui/embed.js +706 -0
  36. data/app/assets/javascripts/semantic-ui/form.js +1707 -0
  37. data/app/assets/javascripts/semantic-ui/modal.js +1090 -0
  38. data/app/assets/javascripts/semantic-ui/nag.js +507 -0
  39. data/app/assets/javascripts/semantic-ui/popup.js +1532 -0
  40. data/app/assets/javascripts/semantic-ui/progress.js +923 -0
  41. data/app/assets/javascripts/semantic-ui/range.js +278 -0
  42. data/app/assets/javascripts/semantic-ui/rating.js +511 -0
  43. data/app/assets/javascripts/semantic-ui/search.js +1515 -0
  44. data/app/assets/javascripts/semantic-ui/shape.js +921 -0
  45. data/app/assets/javascripts/semantic-ui/sidebar.js +1033 -0
  46. data/app/assets/javascripts/semantic-ui/site.js +490 -0
  47. data/app/assets/javascripts/semantic-ui/state.js +708 -0
  48. data/app/assets/javascripts/semantic-ui/sticky.js +959 -0
  49. data/app/assets/javascripts/semantic-ui/tab.js +952 -0
  50. data/app/assets/javascripts/semantic-ui/toast.js +592 -0
  51. data/app/assets/javascripts/semantic-ui/transition.js +1106 -0
  52. data/app/assets/javascripts/semantic-ui/video.js +532 -0
  53. data/app/assets/javascripts/semantic-ui/visibility.js +1311 -0
  54. data/app/assets/javascripts/semantic-ui/visit.js +525 -0
  55. data/app/assets/stylesheets/semantic-ui.scss +5 -0
  56. data/app/assets/stylesheets/semantic-ui/collections/_all.scss +6 -0
  57. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +124 -0
  58. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +1158 -0
  59. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +2093 -0
  60. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +2193 -0
  61. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +606 -0
  62. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +1117 -0
  63. data/app/assets/stylesheets/semantic-ui/elements/_all.scss +16 -0
  64. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +4530 -0
  65. data/app/assets/stylesheets/semantic-ui/elements/_container.scss +145 -0
  66. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +259 -0
  67. data/app/assets/stylesheets/semantic-ui/elements/_flag.scss +1036 -0
  68. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +762 -0
  69. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +6330 -0
  70. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +310 -0
  71. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +519 -0
  72. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +1395 -0
  73. data/app/assets/stylesheets/semantic-ui/elements/_list.scss +959 -0
  74. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +458 -0
  75. data/app/assets/stylesheets/semantic-ui/elements/_placeholder.scss +242 -0
  76. data/app/assets/stylesheets/semantic-ui/elements/_rail.scss +152 -0
  77. data/app/assets/stylesheets/semantic-ui/elements/_reveal.scss +295 -0
  78. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +884 -0
  79. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +675 -0
  80. data/app/assets/stylesheets/semantic-ui/globals/_all.scss +3 -0
  81. data/app/assets/stylesheets/semantic-ui/globals/_reset.scss +485 -0
  82. data/app/assets/stylesheets/semantic-ui/globals/_site.scss +206 -0
  83. data/app/assets/stylesheets/semantic-ui/globals/_variables.scss +4 -0
  84. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +247 -0
  85. data/app/assets/stylesheets/semantic-ui/modules/_all.scss +20 -0
  86. data/app/assets/stylesheets/semantic-ui/modules/_calendar.scss +165 -0
  87. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +718 -0
  88. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +464 -0
  89. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +1745 -0
  90. data/app/assets/stylesheets/semantic-ui/modules/_embed.scss +165 -0
  91. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +646 -0
  92. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +148 -0
  93. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +789 -0
  94. data/app/assets/stylesheets/semantic-ui/modules/_progress.scss +523 -0
  95. data/app/assets/stylesheets/semantic-ui/modules/_range.scss +192 -0
  96. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +263 -0
  97. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +445 -0
  98. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +154 -0
  99. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +626 -0
  100. data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss +78 -0
  101. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +92 -0
  102. data/app/assets/stylesheets/semantic-ui/modules/_toast.scss +291 -0
  103. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +2059 -0
  104. data/app/assets/stylesheets/semantic-ui/modules/_video.scss +125 -0
  105. data/app/assets/stylesheets/semantic-ui/views/_ad.scss +275 -0
  106. data/app/assets/stylesheets/semantic-ui/views/_all.scss +6 -0
  107. data/app/assets/stylesheets/semantic-ui/views/_card.scss +1124 -0
  108. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +296 -0
  109. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +314 -0
  110. data/app/assets/stylesheets/semantic-ui/views/_item.scss +555 -0
  111. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +583 -0
  112. data/app/helpers/semantic_breadcrumbs_helper.rb +10 -0
  113. data/app/helpers/semantic_flash_helper.rb +22 -0
  114. data/app/helpers/semantic_icon_helper.rb +8 -0
  115. data/app/views/semantic/_breadcrumbs.html.erb +12 -0
  116. data/fomantic-ui-sass.gemspec +31 -0
  117. data/lib/fomantic-ui-sass.rb +62 -0
  118. data/lib/fomantic/ui/sass/breadcrumbs.rb +41 -0
  119. data/lib/fomantic/ui/sass/engine.rb +23 -0
  120. data/lib/fomantic/ui/sass/version.rb +8 -0
  121. data/spec/dummy/README.rdoc +28 -0
  122. data/spec/dummy/Rakefile +6 -0
  123. data/spec/dummy/app/assets/images/.keep +0 -0
  124. data/spec/dummy/app/assets/javascripts/application.js +13 -0
  125. data/spec/dummy/app/assets/stylesheets/application.css +13 -0
  126. data/spec/dummy/app/controllers/application_controller.rb +5 -0
  127. data/spec/dummy/app/controllers/concerns/.keep +0 -0
  128. data/spec/dummy/app/helpers/application_helper.rb +2 -0
  129. data/spec/dummy/app/mailers/.keep +0 -0
  130. data/spec/dummy/app/models/.keep +0 -0
  131. data/spec/dummy/app/models/concerns/.keep +0 -0
  132. data/spec/dummy/app/views/layouts/application.html.erb +14 -0
  133. data/spec/dummy/bin/bundle +3 -0
  134. data/spec/dummy/bin/rails +4 -0
  135. data/spec/dummy/bin/rake +4 -0
  136. data/spec/dummy/config.ru +4 -0
  137. data/spec/dummy/config/application.rb +28 -0
  138. data/spec/dummy/config/boot.rb +5 -0
  139. data/spec/dummy/config/environment.rb +5 -0
  140. data/spec/dummy/config/environments/development.rb +29 -0
  141. data/spec/dummy/config/environments/production.rb +80 -0
  142. data/spec/dummy/config/environments/test.rb +36 -0
  143. data/spec/dummy/config/initializers/backtrace_silencers.rb +7 -0
  144. data/spec/dummy/config/initializers/filter_parameter_logging.rb +4 -0
  145. data/spec/dummy/config/initializers/inflections.rb +16 -0
  146. data/spec/dummy/config/initializers/mime_types.rb +5 -0
  147. data/spec/dummy/config/initializers/secret_token.rb +12 -0
  148. data/spec/dummy/config/initializers/session_store.rb +3 -0
  149. data/spec/dummy/config/initializers/wrap_parameters.rb +14 -0
  150. data/spec/dummy/config/locales/en.yml +23 -0
  151. data/spec/dummy/config/routes.rb +2 -0
  152. data/spec/dummy/lib/assets/.keep +0 -0
  153. data/spec/dummy/log/.keep +0 -0
  154. data/spec/dummy/public/404.html +58 -0
  155. data/spec/dummy/public/422.html +58 -0
  156. data/spec/dummy/public/500.html +57 -0
  157. data/spec/dummy/public/favicon.ico +0 -0
  158. data/spec/helpers/semantic_breadcrumbs_helper_spec.rb +38 -0
  159. data/spec/helpers/semantic_flash_helper_spec.rb +36 -0
  160. data/spec/helpers/semantic_icon_helper_spec.rb +48 -0
  161. data/spec/spec_helper.rb +17 -0
  162. data/tasks/converter.rb +216 -0
  163. data/templates/project/manifest.rb +29 -0
  164. data/templates/project/styles.scss +1 -0
  165. metadata +390 -0
@@ -0,0 +1,125 @@
1
+ /*!
2
+ * # Semantic UI 1.12.3 - Video
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Copyright 2014 Contributors
7
+ * Released under the MIT license
8
+ * http://opensource.org/licenses/MIT
9
+ *
10
+ */
11
+
12
+
13
+ /*******************************
14
+ Video
15
+ *******************************/
16
+
17
+ .ui.video {
18
+ background-color: #dddddd;
19
+ position: relative;
20
+ max-width: 100%;
21
+ padding-bottom: 56.25%;
22
+ height: 0px;
23
+ overflow: hidden;
24
+ }
25
+
26
+ /*--------------
27
+ Content
28
+ ---------------*/
29
+
30
+
31
+ /* Placeholder Image */
32
+ .ui.video .placeholder {
33
+ background-color: #333333;
34
+ }
35
+
36
+ /* Play Icon Overlay */
37
+ .ui.video .play {
38
+ cursor: pointer;
39
+ position: absolute;
40
+ top: 0px;
41
+ left: 0px;
42
+ z-index: 10;
43
+ width: 100%;
44
+ height: 100%;
45
+ opacity: 0.8;
46
+ -webkit-transition: opacity 0.3s;
47
+ transition: opacity 0.3s;
48
+ }
49
+ .ui.video .play.icon:before {
50
+ position: absolute;
51
+ top: 50%;
52
+ left: 50%;
53
+ z-index: 11;
54
+ background: rgba(0, 0, 0, 0.3);
55
+ width: 8rem;
56
+ height: 8rem;
57
+ line-height: 8rem;
58
+ border-radius: 500rem;
59
+ color: #ffffff;
60
+ font-size: 8rem;
61
+ text-shadow: none;
62
+ -webkit-transform: translateX(-50%) translateY(-50%);
63
+ -ms-transform: translateX(-50%) translateY(-50%);
64
+ transform: translateX(-50%) translateY(-50%);
65
+ }
66
+ .ui.video .placeholder {
67
+ position: absolute;
68
+ top: 0px;
69
+ left: 0px;
70
+ display: block;
71
+ width: 100%;
72
+ height: 100%;
73
+ }
74
+
75
+ /* IFrame Embed */
76
+ .ui.video .embed iframe,
77
+ .ui.video .embed embed,
78
+ .ui.video .embed object {
79
+ position: absolute;
80
+ border: none;
81
+ width: 100%;
82
+ height: 100%;
83
+ top: 0px;
84
+ left: 0px;
85
+ margin: 0em;
86
+ padding: 0em;
87
+ }
88
+
89
+
90
+ /*******************************
91
+ States
92
+ *******************************/
93
+
94
+
95
+ /*--------------
96
+ Hover
97
+ ---------------*/
98
+
99
+ .ui.video .play:hover {
100
+ opacity: 1;
101
+ }
102
+
103
+ /*--------------
104
+ Active
105
+ ---------------*/
106
+
107
+ .ui.video.active .play,
108
+ .ui.video.active .placeholder {
109
+ display: none;
110
+ }
111
+ .ui.video.active .embed {
112
+ display: inline;
113
+ }
114
+
115
+
116
+ /*******************************
117
+ Video Overrides
118
+ *******************************/
119
+
120
+
121
+
122
+ /*******************************
123
+ Site Overrides
124
+ *******************************/
125
+
@@ -0,0 +1,275 @@
1
+ /*!
2
+ * # Semantic UI 2.6.4 - Ad
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Copyright 2013 Contributors
7
+ * Released under the MIT license
8
+ * http://opensource.org/licenses/MIT
9
+ *
10
+ */
11
+
12
+
13
+ /*******************************
14
+ Advertisement
15
+ *******************************/
16
+
17
+ .ui.ad {
18
+ display: block;
19
+ overflow: hidden;
20
+ margin: 1em 0em;
21
+ }
22
+ .ui.ad:first-child {
23
+ margin: 0em;
24
+ }
25
+ .ui.ad:last-child {
26
+ margin: 0em;
27
+ }
28
+ .ui.ad iframe {
29
+ margin: 0em;
30
+ padding: 0em;
31
+ border: none;
32
+ overflow: hidden;
33
+ }
34
+
35
+ /*--------------
36
+ Common
37
+ ---------------*/
38
+
39
+
40
+ /* Leaderboard */
41
+ .ui.leaderboard.ad {
42
+ width: 728px;
43
+ height: 90px;
44
+ }
45
+
46
+ /* Medium Rectangle */
47
+ .ui[class*="medium rectangle"].ad {
48
+ width: 300px;
49
+ height: 250px;
50
+ }
51
+
52
+ /* Large Rectangle */
53
+ .ui[class*="large rectangle"].ad {
54
+ width: 336px;
55
+ height: 280px;
56
+ }
57
+
58
+ /* Half Page */
59
+ .ui[class*="half page"].ad {
60
+ width: 300px;
61
+ height: 600px;
62
+ }
63
+
64
+ /*--------------
65
+ Square
66
+ ---------------*/
67
+
68
+
69
+ /* Square */
70
+ .ui.square.ad {
71
+ width: 250px;
72
+ height: 250px;
73
+ }
74
+
75
+ /* Small Square */
76
+ .ui[class*="small square"].ad {
77
+ width: 200px;
78
+ height: 200px;
79
+ }
80
+
81
+ /*--------------
82
+ Rectangle
83
+ ---------------*/
84
+
85
+
86
+ /* Small Rectangle */
87
+ .ui[class*="small rectangle"].ad {
88
+ width: 180px;
89
+ height: 150px;
90
+ }
91
+
92
+ /* Vertical Rectangle */
93
+ .ui[class*="vertical rectangle"].ad {
94
+ width: 240px;
95
+ height: 400px;
96
+ }
97
+
98
+ /*--------------
99
+ Button
100
+ ---------------*/
101
+
102
+ .ui.button.ad {
103
+ width: 120px;
104
+ height: 90px;
105
+ }
106
+ .ui[class*="square button"].ad {
107
+ width: 125px;
108
+ height: 125px;
109
+ }
110
+ .ui[class*="small button"].ad {
111
+ width: 120px;
112
+ height: 60px;
113
+ }
114
+
115
+ /*--------------
116
+ Skyscrapers
117
+ ---------------*/
118
+
119
+
120
+ /* Skyscraper */
121
+ .ui.skyscraper.ad {
122
+ width: 120px;
123
+ height: 600px;
124
+ }
125
+
126
+ /* Wide Skyscraper */
127
+ .ui[class*="wide skyscraper"].ad {
128
+ width: 160px;
129
+ }
130
+
131
+ /*--------------
132
+ Banners
133
+ ---------------*/
134
+
135
+
136
+ /* Banner */
137
+ .ui.banner.ad {
138
+ width: 468px;
139
+ height: 60px;
140
+ }
141
+
142
+ /* Vertical Banner */
143
+ .ui[class*="vertical banner"].ad {
144
+ width: 120px;
145
+ height: 240px;
146
+ }
147
+
148
+ /* Top Banner */
149
+ .ui[class*="top banner"].ad {
150
+ width: 930px;
151
+ height: 180px;
152
+ }
153
+
154
+ /* Half Banner */
155
+ .ui[class*="half banner"].ad {
156
+ width: 234px;
157
+ height: 60px;
158
+ }
159
+
160
+ /*--------------
161
+ Boards
162
+ ---------------*/
163
+
164
+
165
+ /* Leaderboard */
166
+ .ui[class*="large leaderboard"].ad {
167
+ width: 970px;
168
+ height: 90px;
169
+ }
170
+
171
+ /* Billboard */
172
+ .ui.billboard.ad {
173
+ width: 970px;
174
+ height: 250px;
175
+ }
176
+
177
+ /*--------------
178
+ Panorama
179
+ ---------------*/
180
+
181
+
182
+ /* Panorama */
183
+ .ui.panorama.ad {
184
+ width: 980px;
185
+ height: 120px;
186
+ }
187
+
188
+ /*--------------
189
+ Netboard
190
+ ---------------*/
191
+
192
+
193
+ /* Netboard */
194
+ .ui.netboard.ad {
195
+ width: 580px;
196
+ height: 400px;
197
+ }
198
+
199
+ /*--------------
200
+ Mobile
201
+ ---------------*/
202
+
203
+
204
+ /* Large Mobile Banner */
205
+ .ui[class*="large mobile banner"].ad {
206
+ width: 320px;
207
+ height: 100px;
208
+ }
209
+
210
+ /* Mobile Leaderboard */
211
+ .ui[class*="mobile leaderboard"].ad {
212
+ width: 320px;
213
+ height: 50px;
214
+ }
215
+
216
+
217
+ /*******************************
218
+ Types
219
+ *******************************/
220
+
221
+
222
+ /* Mobile Sizes */
223
+ .ui.mobile.ad {
224
+ display: none;
225
+ }
226
+ @media only screen and (max-width: 767px) {
227
+ .ui.mobile.ad {
228
+ display: block;
229
+ }
230
+ }
231
+
232
+
233
+ /*******************************
234
+ Variations
235
+ *******************************/
236
+
237
+ .ui.centered.ad {
238
+ margin-left: auto;
239
+ margin-right: auto;
240
+ }
241
+ .ui.test.ad {
242
+ position: relative;
243
+ background: #545454;
244
+ }
245
+ .ui.test.ad:after {
246
+ position: absolute;
247
+ top: 50%;
248
+ left: 50%;
249
+ width: 100%;
250
+ text-align: center;
251
+ -webkit-transform: translateX(-50%) translateY(-50%);
252
+ transform: translateX(-50%) translateY(-50%);
253
+ content: 'Ad';
254
+ color: #FFFFFF;
255
+ font-size: 1em;
256
+ font-weight: bold;
257
+ }
258
+ .ui.mobile.test.ad:after {
259
+ font-size: 0.85714286em;
260
+ }
261
+ .ui.test.ad[data-text]:after {
262
+ content: attr(data-text);
263
+ }
264
+
265
+
266
+ /*******************************
267
+ Theme Overrides
268
+ *******************************/
269
+
270
+
271
+
272
+ /*******************************
273
+ User Variable Overrides
274
+ *******************************/
275
+
@@ -0,0 +1,6 @@
1
+ @import 'ad';
2
+ @import 'card';
3
+ @import 'comment';
4
+ @import 'feed';
5
+ @import 'item';
6
+ @import 'statistic';
@@ -0,0 +1,1124 @@
1
+ /*!
2
+ * # Semantic UI 2.6.4 - Card
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+
12
+ /*******************************
13
+ Standard
14
+ *******************************/
15
+
16
+
17
+ /*--------------
18
+ Card
19
+ ---------------*/
20
+
21
+ .ui.cards > .card,
22
+ .ui.card {
23
+ max-width: 100%;
24
+ position: relative;
25
+ display: -webkit-box;
26
+ display: -ms-flexbox;
27
+ display: flex;
28
+ -webkit-box-orient: vertical;
29
+ -webkit-box-direction: normal;
30
+ -ms-flex-direction: column;
31
+ flex-direction: column;
32
+ width: 290px;
33
+ min-height: 0px;
34
+ background: #FFFFFF;
35
+ padding: 0em;
36
+ border: none;
37
+ border-radius: 0.28571429rem;
38
+ -webkit-box-shadow: 0px 1px 3px 0px #D4D4D5, 0px 0px 0px 1px #D4D4D5;
39
+ box-shadow: 0px 1px 3px 0px #D4D4D5, 0px 0px 0px 1px #D4D4D5;
40
+ -webkit-transition: -webkit-box-shadow 0.1s ease, -webkit-transform 0.1s ease;
41
+ transition: -webkit-box-shadow 0.1s ease, -webkit-transform 0.1s ease;
42
+ transition: box-shadow 0.1s ease, transform 0.1s ease;
43
+ transition: box-shadow 0.1s ease, transform 0.1s ease, -webkit-box-shadow 0.1s ease, -webkit-transform 0.1s ease;
44
+ z-index: '';
45
+ }
46
+ .ui.card {
47
+ margin: 1em 0em;
48
+ }
49
+ .ui.cards > .card a,
50
+ .ui.card a {
51
+ cursor: pointer;
52
+ }
53
+ .ui.card:first-child {
54
+ margin-top: 0em;
55
+ }
56
+ .ui.card:last-child {
57
+ margin-bottom: 0em;
58
+ }
59
+
60
+ /*--------------
61
+ Cards
62
+ ---------------*/
63
+
64
+ .ui.cards {
65
+ display: -webkit-box;
66
+ display: -ms-flexbox;
67
+ display: flex;
68
+ margin: -0.875em -0.5em;
69
+ -ms-flex-wrap: wrap;
70
+ flex-wrap: wrap;
71
+ }
72
+ .ui.cards > .card {
73
+ display: -webkit-box;
74
+ display: -ms-flexbox;
75
+ display: flex;
76
+ margin: 0.875em 0.5em;
77
+ float: none;
78
+ }
79
+
80
+ /* Clearing */
81
+ .ui.cards:after,
82
+ .ui.card:after {
83
+ display: block;
84
+ content: ' ';
85
+ height: 0px;
86
+ clear: both;
87
+ overflow: hidden;
88
+ visibility: hidden;
89
+ }
90
+
91
+ /* Consecutive Card Groups Preserve Row Spacing */
92
+ .ui.cards ~ .ui.cards {
93
+ margin-top: 0.875em;
94
+ }
95
+
96
+ /*--------------
97
+ Rounded Edges
98
+ ---------------*/
99
+
100
+ .ui.cards > .card > :first-child,
101
+ .ui.card > :first-child {
102
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em !important;
103
+ border-top: none !important;
104
+ }
105
+ .ui.cards > .card > :last-child,
106
+ .ui.card > :last-child {
107
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem !important;
108
+ }
109
+ .ui.cards > .card > :only-child,
110
+ .ui.card > :only-child {
111
+ border-radius: 0.28571429rem !important;
112
+ }
113
+
114
+ /*--------------
115
+ Images
116
+ ---------------*/
117
+
118
+ .ui.cards > .card > .image,
119
+ .ui.card > .image {
120
+ position: relative;
121
+ display: block;
122
+ -webkit-box-flex: 0;
123
+ -ms-flex: 0 0 auto;
124
+ flex: 0 0 auto;
125
+ padding: 0em;
126
+ background: rgba(0, 0, 0, 0.05);
127
+ }
128
+ .ui.cards > .card > .image > img,
129
+ .ui.card > .image > img {
130
+ display: block;
131
+ width: 100%;
132
+ height: auto;
133
+ border-radius: inherit;
134
+ }
135
+ .ui.cards > .card > .image:not(.ui) > img,
136
+ .ui.card > .image:not(.ui) > img {
137
+ border: none;
138
+ }
139
+
140
+ /*--------------
141
+ Content
142
+ ---------------*/
143
+
144
+ .ui.cards > .card > .content,
145
+ .ui.card > .content {
146
+ -webkit-box-flex: 1;
147
+ -ms-flex-positive: 1;
148
+ flex-grow: 1;
149
+ border: none;
150
+ border-top: 1px solid rgba(34, 36, 38, 0.1);
151
+ background: none;
152
+ margin: 0em;
153
+ padding: 1em 1em;
154
+ -webkit-box-shadow: none;
155
+ box-shadow: none;
156
+ font-size: 1em;
157
+ border-radius: 0em;
158
+ }
159
+ .ui.cards > .card > .content:after,
160
+ .ui.card > .content:after {
161
+ display: block;
162
+ content: ' ';
163
+ height: 0px;
164
+ clear: both;
165
+ overflow: hidden;
166
+ visibility: hidden;
167
+ }
168
+ .ui.cards > .card > .content > .header,
169
+ .ui.card > .content > .header {
170
+ display: block;
171
+ margin: '';
172
+ font-family: $font-family;
173
+ color: rgba(0, 0, 0, 0.85);
174
+ }
175
+
176
+ /* Default Header Size */
177
+ .ui.cards > .card > .content > .header:not(.ui),
178
+ .ui.card > .content > .header:not(.ui) {
179
+ font-weight: bold;
180
+ font-size: 1.28571429em;
181
+ margin-top: -0.21425em;
182
+ line-height: 1.28571429em;
183
+ }
184
+ .ui.cards > .card > .content > .meta + .description,
185
+ .ui.cards > .card > .content > .header + .description,
186
+ .ui.card > .content > .meta + .description,
187
+ .ui.card > .content > .header + .description {
188
+ margin-top: 0.5em;
189
+ }
190
+
191
+ /*----------------
192
+ Floated Content
193
+ -----------------*/
194
+
195
+ .ui.cards > .card [class*="left floated"],
196
+ .ui.card [class*="left floated"] {
197
+ float: left;
198
+ }
199
+ .ui.cards > .card [class*="right floated"],
200
+ .ui.card [class*="right floated"] {
201
+ float: right;
202
+ }
203
+
204
+ /*--------------
205
+ Aligned
206
+ ---------------*/
207
+
208
+ .ui.cards > .card [class*="left aligned"],
209
+ .ui.card [class*="left aligned"] {
210
+ text-align: left;
211
+ }
212
+ .ui.cards > .card [class*="center aligned"],
213
+ .ui.card [class*="center aligned"] {
214
+ text-align: center;
215
+ }
216
+ .ui.cards > .card [class*="right aligned"],
217
+ .ui.card [class*="right aligned"] {
218
+ text-align: right;
219
+ }
220
+
221
+ /*--------------
222
+ Content Image
223
+ ---------------*/
224
+
225
+ .ui.cards > .card .content img,
226
+ .ui.card .content img {
227
+ display: inline-block;
228
+ vertical-align: middle;
229
+ width: '';
230
+ }
231
+ .ui.cards > .card img.avatar,
232
+ .ui.cards > .card .avatar img,
233
+ .ui.card img.avatar,
234
+ .ui.card .avatar img {
235
+ width: 2em;
236
+ height: 2em;
237
+ border-radius: 500rem;
238
+ }
239
+
240
+ /*--------------
241
+ Description
242
+ ---------------*/
243
+
244
+ .ui.cards > .card > .content > .description,
245
+ .ui.card > .content > .description {
246
+ clear: both;
247
+ color: rgba(0, 0, 0, 0.68);
248
+ }
249
+
250
+ /*--------------
251
+ Paragraph
252
+ ---------------*/
253
+
254
+ .ui.cards > .card > .content p,
255
+ .ui.card > .content p {
256
+ margin: 0em 0em 0.5em;
257
+ }
258
+ .ui.cards > .card > .content p:last-child,
259
+ .ui.card > .content p:last-child {
260
+ margin-bottom: 0em;
261
+ }
262
+
263
+ /*--------------
264
+ Meta
265
+ ---------------*/
266
+
267
+ .ui.cards > .card .meta,
268
+ .ui.card .meta {
269
+ font-size: 1em;
270
+ color: rgba(0, 0, 0, 0.4);
271
+ }
272
+ .ui.cards > .card .meta *,
273
+ .ui.card .meta * {
274
+ margin-right: 0.3em;
275
+ }
276
+ .ui.cards > .card .meta :last-child,
277
+ .ui.card .meta :last-child {
278
+ margin-right: 0em;
279
+ }
280
+ .ui.cards > .card .meta [class*="right floated"],
281
+ .ui.card .meta [class*="right floated"] {
282
+ margin-right: 0em;
283
+ margin-left: 0.3em;
284
+ }
285
+
286
+ /*--------------
287
+ Links
288
+ ---------------*/
289
+
290
+
291
+ /* Generic */
292
+ .ui.cards > .card > .content a:not(.ui),
293
+ .ui.card > .content a:not(.ui) {
294
+ color: '';
295
+ -webkit-transition: color 0.1s ease;
296
+ transition: color 0.1s ease;
297
+ }
298
+ .ui.cards > .card > .content a:not(.ui):hover,
299
+ .ui.card > .content a:not(.ui):hover {
300
+ color: '';
301
+ }
302
+
303
+ /* Header */
304
+ .ui.cards > .card > .content > a.header,
305
+ .ui.card > .content > a.header {
306
+ color: rgba(0, 0, 0, 0.85);
307
+ }
308
+ .ui.cards > .card > .content > a.header:hover,
309
+ .ui.card > .content > a.header:hover {
310
+ color: #1e70bf;
311
+ }
312
+
313
+ /* Meta */
314
+ .ui.cards > .card .meta > a:not(.ui),
315
+ .ui.card .meta > a:not(.ui) {
316
+ color: rgba(0, 0, 0, 0.4);
317
+ }
318
+ .ui.cards > .card .meta > a:not(.ui):hover,
319
+ .ui.card .meta > a:not(.ui):hover {
320
+ color: rgba(0, 0, 0, 0.87);
321
+ }
322
+
323
+ /*--------------
324
+ Buttons
325
+ ---------------*/
326
+
327
+ .ui.cards > .card > .buttons,
328
+ .ui.card > .buttons,
329
+ .ui.cards > .card > .button,
330
+ .ui.card > .button {
331
+ margin: 0px -1px;
332
+ width: calc(100% + 2px);
333
+ }
334
+
335
+ /*--------------
336
+ Dimmer
337
+ ---------------*/
338
+
339
+ .ui.cards > .card .dimmer,
340
+ .ui.card .dimmer {
341
+ background-color: '';
342
+ z-index: 10;
343
+ }
344
+
345
+ /*--------------
346
+ Labels
347
+ ---------------*/
348
+
349
+
350
+ /*-----Star----- */
351
+
352
+
353
+ /* Icon */
354
+ .ui.cards > .card > .content .star.icon,
355
+ .ui.card > .content .star.icon {
356
+ cursor: pointer;
357
+ opacity: 0.75;
358
+ -webkit-transition: color 0.1s ease;
359
+ transition: color 0.1s ease;
360
+ }
361
+ .ui.cards > .card > .content .star.icon:hover,
362
+ .ui.card > .content .star.icon:hover {
363
+ opacity: 1;
364
+ color: #FFB70A;
365
+ }
366
+ .ui.cards > .card > .content .active.star.icon,
367
+ .ui.card > .content .active.star.icon {
368
+ color: #FFE623;
369
+ }
370
+
371
+ /*-----Like----- */
372
+
373
+
374
+ /* Icon */
375
+ .ui.cards > .card > .content .like.icon,
376
+ .ui.card > .content .like.icon {
377
+ cursor: pointer;
378
+ opacity: 0.75;
379
+ -webkit-transition: color 0.1s ease;
380
+ transition: color 0.1s ease;
381
+ }
382
+ .ui.cards > .card > .content .like.icon:hover,
383
+ .ui.card > .content .like.icon:hover {
384
+ opacity: 1;
385
+ color: #FF2733;
386
+ }
387
+ .ui.cards > .card > .content .active.like.icon,
388
+ .ui.card > .content .active.like.icon {
389
+ color: #FF2733;
390
+ }
391
+
392
+ /*----------------
393
+ Extra Content
394
+ -----------------*/
395
+
396
+ .ui.cards > .card > .extra,
397
+ .ui.card > .extra {
398
+ max-width: 100%;
399
+ min-height: 0em !important;
400
+ -webkit-box-flex: 0;
401
+ -ms-flex-positive: 0;
402
+ flex-grow: 0;
403
+ border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
404
+ position: static;
405
+ background: none;
406
+ width: auto;
407
+ margin: 0em 0em;
408
+ padding: 0.75em 1em;
409
+ top: 0em;
410
+ left: 0em;
411
+ color: rgba(0, 0, 0, 0.4);
412
+ -webkit-box-shadow: none;
413
+ box-shadow: none;
414
+ -webkit-transition: color 0.1s ease;
415
+ transition: color 0.1s ease;
416
+ }
417
+ .ui.cards > .card > .extra a:not(.ui),
418
+ .ui.card > .extra a:not(.ui) {
419
+ color: rgba(0, 0, 0, 0.4);
420
+ }
421
+ .ui.cards > .card > .extra a:not(.ui):hover,
422
+ .ui.card > .extra a:not(.ui):hover {
423
+ color: #1e70bf;
424
+ }
425
+
426
+
427
+ /*******************************
428
+ Variations
429
+ *******************************/
430
+
431
+
432
+ /*-------------------
433
+ Horizontal
434
+ --------------------*/
435
+
436
+ .ui.horizontal.cards > .card,
437
+ .ui.card.horizontal {
438
+ -webkit-box-orient: horizontal;
439
+ -webkit-box-direction: normal;
440
+ -ms-flex-direction: row;
441
+ flex-direction: row;
442
+ min-width: 400px;
443
+ width: 400px;
444
+ max-width: 100%;
445
+ }
446
+ .ui.horizontal.cards > .card > .image,
447
+ .ui.card.horizontal > .image {
448
+ border-radius: 0.28571429rem 0 0 0.28571429rem;
449
+ width: 150px;
450
+ }
451
+ .ui.horizontal.cards > .card > .image > img,
452
+ .ui.card.horizontal > .image > img {
453
+ background-size: cover;
454
+ background-repeat: no-repeat;
455
+ background-position: center;
456
+ -webkit-box-pack: center;
457
+ -ms-flex-pack: center;
458
+ justify-content: center;
459
+ -webkit-box-align: center;
460
+ -ms-flex-align: center;
461
+ align-items: center;
462
+ display: -webkit-box;
463
+ display: -ms-flexbox;
464
+ display: flex;
465
+ width: 100%;
466
+ height: 100%;
467
+ border-radius: 0.28571429rem 0 0 0.28571429rem;
468
+ }
469
+
470
+ /*-------------------
471
+ Raised
472
+ --------------------*/
473
+
474
+ .ui.raised.cards > .card,
475
+ .ui.raised.card {
476
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
477
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
478
+ }
479
+ .ui.raised.cards a.card:hover,
480
+ .ui.link.cards .raised.card:hover,
481
+ a.ui.raised.card:hover,
482
+ .ui.link.raised.card:hover {
483
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 4px 0px rgba(34, 36, 38, 0.15), 0px 2px 10px 0px rgba(34, 36, 38, 0.25);
484
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 4px 0px rgba(34, 36, 38, 0.15), 0px 2px 10px 0px rgba(34, 36, 38, 0.25);
485
+ }
486
+
487
+ /*-------------------
488
+ Centered
489
+ --------------------*/
490
+
491
+ .ui.centered.cards {
492
+ -webkit-box-pack: center;
493
+ -ms-flex-pack: center;
494
+ justify-content: center;
495
+ }
496
+ .ui.centered.card {
497
+ margin-left: auto;
498
+ margin-right: auto;
499
+ }
500
+
501
+ /*-------------------
502
+ Fluid
503
+ --------------------*/
504
+
505
+ .ui.fluid.card {
506
+ width: 100%;
507
+ max-width: 9999px;
508
+ }
509
+
510
+ /*-------------------
511
+ Link
512
+ --------------------*/
513
+
514
+ .ui.cards a.card,
515
+ .ui.link.cards .card,
516
+ a.ui.card,
517
+ .ui.link.card {
518
+ -webkit-transform: none;
519
+ transform: none;
520
+ }
521
+ .ui.cards a.card:hover,
522
+ .ui.link.cards .card:not(.icon):hover,
523
+ a.ui.card:hover,
524
+ .ui.link.card:hover {
525
+ cursor: pointer;
526
+ z-index: 5;
527
+ background: #FFFFFF;
528
+ border: none;
529
+ -webkit-box-shadow: 0px 1px 3px 0px #BCBDBD, 0px 0px 0px 1px #D4D4D5;
530
+ box-shadow: 0px 1px 3px 0px #BCBDBD, 0px 0px 0px 1px #D4D4D5;
531
+ -webkit-transform: translateY(-3px);
532
+ transform: translateY(-3px);
533
+ }
534
+
535
+ /*-------------------
536
+ Colors
537
+ --------------------*/
538
+
539
+
540
+ /* Primary */
541
+ .ui.primary.cards > .card,
542
+ .ui.cards > .primary.card,
543
+ .ui.primary.card {
544
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #2185D0, 0px 1px 3px 0px #D4D4D5;
545
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #2185D0, 0px 1px 3px 0px #D4D4D5;
546
+ }
547
+ .ui.primary.cards > .card:hover,
548
+ .ui.cards > .primary.card:hover,
549
+ .ui.primary.card:hover {
550
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1678c2, 0px 1px 3px 0px #BCBDBD;
551
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1678c2, 0px 1px 3px 0px #BCBDBD;
552
+ }
553
+
554
+ /* Secondary */
555
+ .ui.secondary.cards > .card,
556
+ .ui.cards > .secondary.card,
557
+ .ui.secondary.card {
558
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1B1C1D, 0px 1px 3px 0px #D4D4D5;
559
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1B1C1D, 0px 1px 3px 0px #D4D4D5;
560
+ }
561
+ .ui.secondary.cards > .card:hover,
562
+ .ui.cards > .secondary.card:hover,
563
+ .ui.secondary.card:hover {
564
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #27292a, 0px 1px 3px 0px #BCBDBD;
565
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #27292a, 0px 1px 3px 0px #BCBDBD;
566
+ }
567
+
568
+ /* Red */
569
+ .ui.red.cards > .card,
570
+ .ui.cards > .red.card,
571
+ .ui.red.card {
572
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #DB2828, 0px 1px 3px 0px #D4D4D5;
573
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #DB2828, 0px 1px 3px 0px #D4D4D5;
574
+ }
575
+ .ui.red.cards > .card:hover,
576
+ .ui.cards > .red.card:hover,
577
+ .ui.red.card:hover {
578
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #d01919, 0px 1px 3px 0px #BCBDBD;
579
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #d01919, 0px 1px 3px 0px #BCBDBD;
580
+ }
581
+
582
+ /* Orange */
583
+ .ui.orange.cards > .card,
584
+ .ui.cards > .orange.card,
585
+ .ui.orange.card {
586
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #F2711C, 0px 1px 3px 0px #D4D4D5;
587
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #F2711C, 0px 1px 3px 0px #D4D4D5;
588
+ }
589
+ .ui.orange.cards > .card:hover,
590
+ .ui.cards > .orange.card:hover,
591
+ .ui.orange.card:hover {
592
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #f26202, 0px 1px 3px 0px #BCBDBD;
593
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #f26202, 0px 1px 3px 0px #BCBDBD;
594
+ }
595
+
596
+ /* Yellow */
597
+ .ui.yellow.cards > .card,
598
+ .ui.cards > .yellow.card,
599
+ .ui.yellow.card {
600
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #FBBD08, 0px 1px 3px 0px #D4D4D5;
601
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #FBBD08, 0px 1px 3px 0px #D4D4D5;
602
+ }
603
+ .ui.yellow.cards > .card:hover,
604
+ .ui.cards > .yellow.card:hover,
605
+ .ui.yellow.card:hover {
606
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #eaae00, 0px 1px 3px 0px #BCBDBD;
607
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #eaae00, 0px 1px 3px 0px #BCBDBD;
608
+ }
609
+
610
+ /* Olive */
611
+ .ui.olive.cards > .card,
612
+ .ui.cards > .olive.card,
613
+ .ui.olive.card {
614
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #B5CC18, 0px 1px 3px 0px #D4D4D5;
615
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #B5CC18, 0px 1px 3px 0px #D4D4D5;
616
+ }
617
+ .ui.olive.cards > .card:hover,
618
+ .ui.cards > .olive.card:hover,
619
+ .ui.olive.card:hover {
620
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #a7bd0d, 0px 1px 3px 0px #BCBDBD;
621
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #a7bd0d, 0px 1px 3px 0px #BCBDBD;
622
+ }
623
+
624
+ /* Green */
625
+ .ui.green.cards > .card,
626
+ .ui.cards > .green.card,
627
+ .ui.green.card {
628
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #21BA45, 0px 1px 3px 0px #D4D4D5;
629
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #21BA45, 0px 1px 3px 0px #D4D4D5;
630
+ }
631
+ .ui.green.cards > .card:hover,
632
+ .ui.cards > .green.card:hover,
633
+ .ui.green.card:hover {
634
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #16ab39, 0px 1px 3px 0px #BCBDBD;
635
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #16ab39, 0px 1px 3px 0px #BCBDBD;
636
+ }
637
+
638
+ /* Teal */
639
+ .ui.teal.cards > .card,
640
+ .ui.cards > .teal.card,
641
+ .ui.teal.card {
642
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #00B5AD, 0px 1px 3px 0px #D4D4D5;
643
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #00B5AD, 0px 1px 3px 0px #D4D4D5;
644
+ }
645
+ .ui.teal.cards > .card:hover,
646
+ .ui.cards > .teal.card:hover,
647
+ .ui.teal.card:hover {
648
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #009c95, 0px 1px 3px 0px #BCBDBD;
649
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #009c95, 0px 1px 3px 0px #BCBDBD;
650
+ }
651
+
652
+ /* Blue */
653
+ .ui.blue.cards > .card,
654
+ .ui.cards > .blue.card,
655
+ .ui.blue.card {
656
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #2185D0, 0px 1px 3px 0px #D4D4D5;
657
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #2185D0, 0px 1px 3px 0px #D4D4D5;
658
+ }
659
+ .ui.blue.cards > .card:hover,
660
+ .ui.cards > .blue.card:hover,
661
+ .ui.blue.card:hover {
662
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1678c2, 0px 1px 3px 0px #BCBDBD;
663
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1678c2, 0px 1px 3px 0px #BCBDBD;
664
+ }
665
+
666
+ /* Violet */
667
+ .ui.violet.cards > .card,
668
+ .ui.cards > .violet.card,
669
+ .ui.violet.card {
670
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #6435C9, 0px 1px 3px 0px #D4D4D5;
671
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #6435C9, 0px 1px 3px 0px #D4D4D5;
672
+ }
673
+ .ui.violet.cards > .card:hover,
674
+ .ui.cards > .violet.card:hover,
675
+ .ui.violet.card:hover {
676
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #5829bb, 0px 1px 3px 0px #BCBDBD;
677
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #5829bb, 0px 1px 3px 0px #BCBDBD;
678
+ }
679
+
680
+ /* Purple */
681
+ .ui.purple.cards > .card,
682
+ .ui.cards > .purple.card,
683
+ .ui.purple.card {
684
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #A333C8, 0px 1px 3px 0px #D4D4D5;
685
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #A333C8, 0px 1px 3px 0px #D4D4D5;
686
+ }
687
+ .ui.purple.cards > .card:hover,
688
+ .ui.cards > .purple.card:hover,
689
+ .ui.purple.card:hover {
690
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #9627ba, 0px 1px 3px 0px #BCBDBD;
691
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #9627ba, 0px 1px 3px 0px #BCBDBD;
692
+ }
693
+
694
+ /* Pink */
695
+ .ui.pink.cards > .card,
696
+ .ui.cards > .pink.card,
697
+ .ui.pink.card {
698
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #E03997, 0px 1px 3px 0px #D4D4D5;
699
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #E03997, 0px 1px 3px 0px #D4D4D5;
700
+ }
701
+ .ui.pink.cards > .card:hover,
702
+ .ui.cards > .pink.card:hover,
703
+ .ui.pink.card:hover {
704
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #e61a8d, 0px 1px 3px 0px #BCBDBD;
705
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #e61a8d, 0px 1px 3px 0px #BCBDBD;
706
+ }
707
+
708
+ /* Brown */
709
+ .ui.brown.cards > .card,
710
+ .ui.cards > .brown.card,
711
+ .ui.brown.card {
712
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #A5673F, 0px 1px 3px 0px #D4D4D5;
713
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #A5673F, 0px 1px 3px 0px #D4D4D5;
714
+ }
715
+ .ui.brown.cards > .card:hover,
716
+ .ui.cards > .brown.card:hover,
717
+ .ui.brown.card:hover {
718
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #975b33, 0px 1px 3px 0px #BCBDBD;
719
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #975b33, 0px 1px 3px 0px #BCBDBD;
720
+ }
721
+
722
+ /* Grey */
723
+ .ui.grey.cards > .card,
724
+ .ui.cards > .grey.card,
725
+ .ui.grey.card {
726
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #767676, 0px 1px 3px 0px #D4D4D5;
727
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #767676, 0px 1px 3px 0px #D4D4D5;
728
+ }
729
+ .ui.grey.cards > .card:hover,
730
+ .ui.cards > .grey.card:hover,
731
+ .ui.grey.card:hover {
732
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #838383, 0px 1px 3px 0px #BCBDBD;
733
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #838383, 0px 1px 3px 0px #BCBDBD;
734
+ }
735
+
736
+ /* Black */
737
+ .ui.black.cards > .card,
738
+ .ui.cards > .black.card,
739
+ .ui.black.card {
740
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1B1C1D, 0px 1px 3px 0px #D4D4D5;
741
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #1B1C1D, 0px 1px 3px 0px #D4D4D5;
742
+ }
743
+ .ui.black.cards > .card:hover,
744
+ .ui.cards > .black.card:hover,
745
+ .ui.black.card:hover {
746
+ -webkit-box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #27292a, 0px 1px 3px 0px #BCBDBD;
747
+ box-shadow: 0px 0px 0px 1px #D4D4D5, 0px 2px 0px 0px #27292a, 0px 1px 3px 0px #BCBDBD;
748
+ }
749
+
750
+ /*--------------
751
+ Card Count
752
+ ---------------*/
753
+
754
+ .ui.one.cards {
755
+ margin-left: 0em;
756
+ margin-right: 0em;
757
+ }
758
+ .ui.one.cards > .card {
759
+ width: 100%;
760
+ }
761
+ .ui.two.cards {
762
+ margin-left: -1em;
763
+ margin-right: -1em;
764
+ }
765
+ .ui.two.cards > .card {
766
+ width: calc(50% - 2em);
767
+ margin-left: 1em;
768
+ margin-right: 1em;
769
+ }
770
+ .ui.three.cards {
771
+ margin-left: -1em;
772
+ margin-right: -1em;
773
+ }
774
+ .ui.three.cards > .card {
775
+ width: calc(33.33333333333333% - 2em);
776
+ margin-left: 1em;
777
+ margin-right: 1em;
778
+ }
779
+ .ui.four.cards {
780
+ margin-left: -0.75em;
781
+ margin-right: -0.75em;
782
+ }
783
+ .ui.four.cards > .card {
784
+ width: calc(25% - 1.5em);
785
+ margin-left: 0.75em;
786
+ margin-right: 0.75em;
787
+ }
788
+ .ui.five.cards {
789
+ margin-left: -0.75em;
790
+ margin-right: -0.75em;
791
+ }
792
+ .ui.five.cards > .card {
793
+ width: calc(20% - 1.5em);
794
+ margin-left: 0.75em;
795
+ margin-right: 0.75em;
796
+ }
797
+ .ui.six.cards {
798
+ margin-left: -0.75em;
799
+ margin-right: -0.75em;
800
+ }
801
+ .ui.six.cards > .card {
802
+ width: calc(16.666666666666664% - 1.5em);
803
+ margin-left: 0.75em;
804
+ margin-right: 0.75em;
805
+ }
806
+ .ui.seven.cards {
807
+ margin-left: -0.5em;
808
+ margin-right: -0.5em;
809
+ }
810
+ .ui.seven.cards > .card {
811
+ width: calc(14.285714285714285% - 1em);
812
+ margin-left: 0.5em;
813
+ margin-right: 0.5em;
814
+ }
815
+ .ui.eight.cards {
816
+ margin-left: -0.5em;
817
+ margin-right: -0.5em;
818
+ }
819
+ .ui.eight.cards > .card {
820
+ width: calc(12.5% - 1em);
821
+ margin-left: 0.5em;
822
+ margin-right: 0.5em;
823
+ font-size: 11px;
824
+ }
825
+ .ui.nine.cards {
826
+ margin-left: -0.5em;
827
+ margin-right: -0.5em;
828
+ }
829
+ .ui.nine.cards > .card {
830
+ width: calc(11.11111111111111% - 1em);
831
+ margin-left: 0.5em;
832
+ margin-right: 0.5em;
833
+ font-size: 10px;
834
+ }
835
+ .ui.ten.cards {
836
+ margin-left: -0.5em;
837
+ margin-right: -0.5em;
838
+ }
839
+ .ui.ten.cards > .card {
840
+ width: calc(10% - 1em);
841
+ margin-left: 0.5em;
842
+ margin-right: 0.5em;
843
+ }
844
+
845
+ /*-------------------
846
+ Doubling
847
+ --------------------*/
848
+
849
+
850
+ /* Mobile Only */
851
+ @media only screen and (max-width: 767px) {
852
+ .ui.two.doubling.cards {
853
+ margin-left: 0em;
854
+ margin-right: 0em;
855
+ }
856
+ .ui.two.doubling.cards > .card {
857
+ width: 100%;
858
+ margin-left: 0em;
859
+ margin-right: 0em;
860
+ }
861
+ .ui.three.doubling.cards {
862
+ margin-left: -1em;
863
+ margin-right: -1em;
864
+ }
865
+ .ui.three.doubling.cards > .card {
866
+ width: calc(50% - 2em);
867
+ margin-left: 1em;
868
+ margin-right: 1em;
869
+ }
870
+ .ui.four.doubling.cards {
871
+ margin-left: -1em;
872
+ margin-right: -1em;
873
+ }
874
+ .ui.four.doubling.cards > .card {
875
+ width: calc(50% - 2em);
876
+ margin-left: 1em;
877
+ margin-right: 1em;
878
+ }
879
+ .ui.five.doubling.cards {
880
+ margin-left: -1em;
881
+ margin-right: -1em;
882
+ }
883
+ .ui.five.doubling.cards > .card {
884
+ width: calc(50% - 2em);
885
+ margin-left: 1em;
886
+ margin-right: 1em;
887
+ }
888
+ .ui.six.doubling.cards {
889
+ margin-left: -1em;
890
+ margin-right: -1em;
891
+ }
892
+ .ui.six.doubling.cards > .card {
893
+ width: calc(50% - 2em);
894
+ margin-left: 1em;
895
+ margin-right: 1em;
896
+ }
897
+ .ui.seven.doubling.cards {
898
+ margin-left: -1em;
899
+ margin-right: -1em;
900
+ }
901
+ .ui.seven.doubling.cards > .card {
902
+ width: calc(33.33333333333333% - 2em);
903
+ margin-left: 1em;
904
+ margin-right: 1em;
905
+ }
906
+ .ui.eight.doubling.cards {
907
+ margin-left: -1em;
908
+ margin-right: -1em;
909
+ }
910
+ .ui.eight.doubling.cards > .card {
911
+ width: calc(33.33333333333333% - 2em);
912
+ margin-left: 1em;
913
+ margin-right: 1em;
914
+ }
915
+ .ui.nine.doubling.cards {
916
+ margin-left: -1em;
917
+ margin-right: -1em;
918
+ }
919
+ .ui.nine.doubling.cards > .card {
920
+ width: calc(33.33333333333333% - 2em);
921
+ margin-left: 1em;
922
+ margin-right: 1em;
923
+ }
924
+ .ui.ten.doubling.cards {
925
+ margin-left: -1em;
926
+ margin-right: -1em;
927
+ }
928
+ .ui.ten.doubling.cards > .card {
929
+ width: calc(33.33333333333333% - 2em);
930
+ margin-left: 1em;
931
+ margin-right: 1em;
932
+ }
933
+ }
934
+
935
+ /* Tablet Only */
936
+ @media only screen and (min-width: 768px) and (max-width: 991px) {
937
+ .ui.two.doubling.cards {
938
+ margin-left: 0em;
939
+ margin-right: 0em;
940
+ }
941
+ .ui.two.doubling.cards > .card {
942
+ width: 100%;
943
+ margin-left: 0em;
944
+ margin-right: 0em;
945
+ }
946
+ .ui.three.doubling.cards {
947
+ margin-left: -1em;
948
+ margin-right: -1em;
949
+ }
950
+ .ui.three.doubling.cards > .card {
951
+ width: calc(50% - 2em);
952
+ margin-left: 1em;
953
+ margin-right: 1em;
954
+ }
955
+ .ui.four.doubling.cards {
956
+ margin-left: -1em;
957
+ margin-right: -1em;
958
+ }
959
+ .ui.four.doubling.cards > .card {
960
+ width: calc(50% - 2em);
961
+ margin-left: 1em;
962
+ margin-right: 1em;
963
+ }
964
+ .ui.five.doubling.cards {
965
+ margin-left: -1em;
966
+ margin-right: -1em;
967
+ }
968
+ .ui.five.doubling.cards > .card {
969
+ width: calc(33.33333333333333% - 2em);
970
+ margin-left: 1em;
971
+ margin-right: 1em;
972
+ }
973
+ .ui.six.doubling.cards {
974
+ margin-left: -1em;
975
+ margin-right: -1em;
976
+ }
977
+ .ui.six.doubling.cards > .card {
978
+ width: calc(33.33333333333333% - 2em);
979
+ margin-left: 1em;
980
+ margin-right: 1em;
981
+ }
982
+ .ui.eight.doubling.cards {
983
+ margin-left: -1em;
984
+ margin-right: -1em;
985
+ }
986
+ .ui.eight.doubling.cards > .card {
987
+ width: calc(33.33333333333333% - 2em);
988
+ margin-left: 1em;
989
+ margin-right: 1em;
990
+ }
991
+ .ui.eight.doubling.cards {
992
+ margin-left: -0.75em;
993
+ margin-right: -0.75em;
994
+ }
995
+ .ui.eight.doubling.cards > .card {
996
+ width: calc(25% - 1.5em);
997
+ margin-left: 0.75em;
998
+ margin-right: 0.75em;
999
+ }
1000
+ .ui.nine.doubling.cards {
1001
+ margin-left: -0.75em;
1002
+ margin-right: -0.75em;
1003
+ }
1004
+ .ui.nine.doubling.cards > .card {
1005
+ width: calc(25% - 1.5em);
1006
+ margin-left: 0.75em;
1007
+ margin-right: 0.75em;
1008
+ }
1009
+ .ui.ten.doubling.cards {
1010
+ margin-left: -0.75em;
1011
+ margin-right: -0.75em;
1012
+ }
1013
+ .ui.ten.doubling.cards > .card {
1014
+ width: calc(20% - 1.5em);
1015
+ margin-left: 0.75em;
1016
+ margin-right: 0.75em;
1017
+ }
1018
+ }
1019
+
1020
+ /*-------------------
1021
+ Stackable
1022
+ --------------------*/
1023
+
1024
+ @media only screen and (max-width: 767px) {
1025
+ .ui.stackable.cards {
1026
+ display: block !important;
1027
+ }
1028
+ .ui.stackable.cards .card:first-child {
1029
+ margin-top: 0em !important;
1030
+ }
1031
+ .ui.stackable.cards > .card {
1032
+ display: block !important;
1033
+ height: auto !important;
1034
+ margin: 1em 1em;
1035
+ padding: 0 !important;
1036
+ width: calc(100% - 2em) !important;
1037
+ }
1038
+ }
1039
+
1040
+ /*--------------
1041
+ Size
1042
+ ---------------*/
1043
+
1044
+ .ui.cards > .card {
1045
+ font-size: 1em;
1046
+ }
1047
+
1048
+ /*-----------------
1049
+ Inverted
1050
+ ------------------*/
1051
+
1052
+ .ui.inverted.cards > .card,
1053
+ .ui.inverted.card {
1054
+ background: #1B1C1D;
1055
+ -webkit-box-shadow: 0px 1px 3px 0px #555555, 0px 0px 0px 1px #555555;
1056
+ box-shadow: 0px 1px 3px 0px #555555, 0px 0px 0px 1px #555555;
1057
+ }
1058
+
1059
+ /* Content */
1060
+ .ui.inverted.cards > .card > .content,
1061
+ .ui.inverted.card > .content {
1062
+ border-top: 1px solid rgba(255, 255, 255, 0.15);
1063
+ }
1064
+
1065
+ /* Header */
1066
+ .ui.inverted.cards > .card > .content > .header,
1067
+ .ui.inverted.card > .content > .header {
1068
+ color: rgba(255, 255, 255, 0.9);
1069
+ }
1070
+
1071
+ /* Description */
1072
+ .ui.inverted.cards > .card > .content > .description,
1073
+ .ui.inverted.card > .content > .description {
1074
+ color: rgba(255, 255, 255, 0.8);
1075
+ }
1076
+
1077
+ /* Meta */
1078
+ .ui.inverted.cards > .card .meta,
1079
+ .ui.inverted.card .meta {
1080
+ color: rgba(255, 255, 255, 0.7);
1081
+ }
1082
+ .ui.inverted.cards > .card .meta > a:not(.ui),
1083
+ .ui.inverted.card .meta > a:not(.ui) {
1084
+ color: rgba(255, 255, 255, 0.7);
1085
+ }
1086
+ .ui.inverted.cards > .card .meta > a:not(.ui):hover,
1087
+ .ui.inverted.card .meta > a:not(.ui):hover {
1088
+ color: #ffffff;
1089
+ }
1090
+
1091
+ /* Extra */
1092
+ .ui.inverted.cards > .card > .extra,
1093
+ .ui.inverted.card > .extra {
1094
+ border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
1095
+ color: rgba(255, 255, 255, 0.7);
1096
+ }
1097
+ .ui.inverted.cards > .card > .extra a:not(.ui),
1098
+ .ui.inverted.card > .extra a:not(.ui) {
1099
+ color: rgba(255, 255, 255, 0.5);
1100
+ }
1101
+ .ui.inverted.cards > .card > .extra a:not(.ui):hover,
1102
+ .ui.inverted.card > .extra a:not(.ui):hover {
1103
+ color: #1e70bf;
1104
+ }
1105
+
1106
+ /* Link card(s) */
1107
+ .ui.inverted.cards a.card:hover,
1108
+ .ui.inverted.link.cards .card:not(.icon):hover,
1109
+ a.inverted.ui.card:hover,
1110
+ .ui.inverted.link.card:hover {
1111
+ background: #1B1C1D;
1112
+ }
1113
+
1114
+
1115
+ /*******************************
1116
+ Theme Overrides
1117
+ *******************************/
1118
+
1119
+
1120
+
1121
+ /*******************************
1122
+ User Variable Overrides
1123
+ *******************************/
1124
+