PluginProbe
Ultimate Store Kit – Store Builder Addons for Elementor, WooCommerce Store Builder, EDD Store Builder / 1.5.2
Ultimate Store Kit – Store Builder Addons for Elementor, WooCommerce Store Builder, EDD Store Builder v1.5.2
3.1.4 3.0.8 3.0.9 3.1.0 3.1.2 3.1.3 3.0.7 3.0.5 3.0.4 3.0.3 3.0.2 trunk 1.5.0 1.5.1 1.5.2 1.6.1 1.6.2 1.6.3 1.6.4 2.0.0 2.0.1 2.0.2 2.0.3 2.0.4 2.0.5 All 93 releases
ultimate-store-kit / assets / css / usk-edd-category-carousel.css

usk-edd-category-carousel.css in Ultimate Store Kit – Store Builder Addons for Elementor, WooCommerce Store Builder, EDD Store Builder 1.5.2, at assets/css/usk-edd-category-carousel.css

253 lines 9.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .usk-edd-category-carousel .category-link {
2 text-decoration: none; }
3
4 .usk-edd-category-carousel .edd-item {
5 position: relative;
6 transition: all 0.3s ease;
7 overflow: hidden;
8 border: 1px solid #ece8e8;
9 border-radius: 10px; }
10
11 .usk-edd-category-carousel .edd-content {
12 position: absolute; }
13
14 .usk-edd-category-carousel .usk-edd-category-carousel-image img {
15 width: 100%;
16 height: 100%;
17 object-fit: cover; }
18
19 .usk-edd-category-carousel .title {
20 color: #2b2d42;
21 font-size: 18px;
22 font-weight: 700;
23 line-height: 22px;
24 margin: 0;
25 text-transform: uppercase;
26 text-decoration: none;
27 transition: all 0.3s ease;
28 margin-bottom: 6px; }
29 .usk-edd-category-carousel .title:hover {
30 color: #d90429; }
31
32 .usk-edd-category-carousel .edd-category-count {
33 color: #ef233c;
34 font-size: 13px;
35 text-transform: uppercase;
36 margin: 0;
37 transition: all 0.3s ease; }
38 .usk-edd-category-carousel .edd-category-count .edd-count-text {
39 padding-left: 5px; }
40
41 .usk-edd-category-carousel .edd-item-overlay {
42 position: absolute;
43 top: 0;
44 left: 0;
45 height: 100%;
46 width: 100%;
47 background: transparent; }
48
49 .usk-edd-category-carousel.style-1 .edd-item:hover {
50 transition: all 0.3s ease; }
51
52 .usk-edd-category-carousel.style-1 .usk-edd-category-carousel-image {
53 object-fit: cover;
54 min-height: 240px;
55 height: 100%;
56 width: 100%; }
57
58 .usk-edd-category-carousel.style-1 .edd-content {
59 text-align: center;
60 padding: 20px;
61 width: 200px;
62 background: rgba(255, 255, 255, 0.582);
63 border-radius: 5px;
64 top: 50%;
65 left: 50%;
66 transform: translate(-50%, -50%);
67 z-index: 1; }
68
69 .usk-edd-category-carousel.style-2 .edd-item {
70 height: 100px;
71 overflow: hidden; }
72 .usk-edd-category-carousel.style-2 .edd-item:hover .usk-edd-category-carousel-image img {
73 transform: scale(1.1); }
74
75 .usk-edd-category-carousel.style-2 .usk-edd-category-carousel-image {
76 width: 100%;
77 height: 100%; }
78 .usk-edd-category-carousel.style-2 .usk-edd-category-carousel-image img {
79 transition: all 0.3s ease; }
80
81 .usk-edd-category-carousel.style-2 .edd-content {
82 top: 50%;
83 transform: translateY(-50%);
84 display: flex;
85 align-items: center;
86 width: 100%;
87 padding: 20px;
88 z-index: 1; }
89
90 .usk-edd-category-carousel.style-2 .title {
91 color: #fff;
92 margin: 0; }
93 .usk-edd-category-carousel.style-2 .title:hover {
94 color: #d90429; }
95
96 .usk-edd-category-carousel.style-2 .edd-category-count {
97 margin-left: auto; }
98
99 .usk-edd-category-carousel.style-2 .edd-count-text {
100 display: none; }
101
102 .usk-edd-category-carousel.style-2 .edd-count-number {
103 background: #fff;
104 color: #2b2d42;
105 width: 30px;
106 height: 30px;
107 line-height: 30px;
108 text-align: center;
109 display: inherit;
110 border-radius: 100px; }
111 .usk-edd-category-carousel.style-2 .edd-count-number:hover {
112 color: #fff;
113 background: #d90429; }
114
115 .usk-edd-category-carousel.style-3 .edd-item {
116 background: #fff; }
117
118 .usk-edd-category-carousel.style-3 .edd-content {
119 position: static;
120 padding: 20px;
121 z-index: 1; }
122
123 .usk-edd-category-carousel.style-3 .usk-edd-category-carousel-image {
124 object-fit: cover;
125 height: 240px;
126 width: 100%; }
127
128 .usk-edd-category-carousel.style-4 .edd-item:hover .usk-edd-category-carousel-image img {
129 transform: scale(1.1); }
130
131 .usk-edd-category-carousel.style-4 .edd-item:hover .title {
132 transform: translateY(0); }
133
134 .usk-edd-category-carousel.style-4 .edd-item:hover .edd-category-count {
135 opacity: 1;
136 transform: translateY(0); }
137
138 .usk-edd-category-carousel.style-4 .usk-edd-category-carousel-image {
139 object-fit: cover;
140 height: 220px;
141 width: 100%; }
142 .usk-edd-category-carousel.style-4 .usk-edd-category-carousel-image img {
143 transition: all 0.3s ease; }
144
145 .usk-edd-category-carousel.style-4 .edd-content {
146 bottom: 0;
147 padding: 20px;
148 overflow: hidden;
149 z-index: 1; }
150
151 .usk-edd-category-carousel.style-4 .title {
152 color: #fff;
153 transform: translateY(30px);
154 transition: transform 0.3s cubic-bezier(0.17, 0.73, 0.66, 0.99) 0s, z-index 0.3s step-end, opacity 0.3s ease; }
155 .usk-edd-category-carousel.style-4 .title:hover {
156 color: #d90429; }
157
158 .usk-edd-category-carousel.style-4 .edd-category-count {
159 color: #d4d7ea;
160 opacity: 0;
161 transform: translateY(25px);
162 overflow: hidden;
163 transition: transform 0.4s cubic-bezier(0.17, 0.73, 0.66, 0.99) 0s, z-index 0.4s step-end, opacity 0.4s ease; }
164
165 .usk-edd-category-carousel.style-5 .edd-item {
166 display: flex;
167 align-items: center;
168 justify-content: center; }
169 .usk-edd-category-carousel.style-5 .edd-item .usk-edd-category-carousel-image {
170 height: 220px; }
171 .usk-edd-category-carousel.style-5 .edd-item:hover .usk-edd-category-carousel-image img {
172 transform: scale(1.1); }
173 .usk-edd-category-carousel.style-5 .edd-item:hover .title {
174 opacity: 0; }
175 .usk-edd-category-carousel.style-5 .edd-item:hover .edd-category-count {
176 opacity: 1;
177 transform: scale(1.1) translateY(-10px); }
178
179 .usk-edd-category-carousel.style-5 .usk-edd-category-carousel-image {
180 height: 100%;
181 width: 100%;
182 object-fit: cover; }
183 .usk-edd-category-carousel.style-5 .usk-edd-category-carousel-image img {
184 transition: all 0.3s ease; }
185
186 .usk-edd-category-carousel.style-5 .edd-content {
187 top: 50%;
188 transform: translateY(-50%);
189 text-align: center;
190 z-index: 1; }
191
192 .usk-edd-category-carousel.style-5 .title {
193 background-color: #2b2d42;
194 padding: 8px 20px;
195 border-radius: 2px;
196 color: #fff;
197 font-size: 14px;
198 line-height: 1;
199 transform: translateY(20px);
200 opacity: 1;
201 transition: transform 0.3s cubic-bezier(0.17, 0.73, 0.66, 0.99) 0s, z-index 0.3s step-end, opacity 0.3s ease; }
202 .usk-edd-category-carousel.style-5 .title:hover {
203 color: #d90429; }
204
205 .usk-edd-category-carousel.style-5 .edd-category-count {
206 color: #fff;
207 transform: translateY(-10px);
208 opacity: 0;
209 transition: transform 0.3s cubic-bezier(0.17, 0.73, 0.66, 0.99) 0s, z-index 0.3s step-end, opacity 0.3s ease;
210 line-height: 1; }
211
212 .usk-edd-category-carousel .edd-item-overlay {
213 transition: all .3s ease; }
214
215 .edd-item-match-height--yes .usk-edd-category-carousel .swiper-slide {
216 height: initial; }
217
218 .elementor-widget-usk-edd-category-carousel .usk-arrows-container {
219 -webkit-transform: translate(var(--usk-edd-category-carousel-arrows-ncx, 0), var(--usk-edd-category-carousel-arrows-ncy, 40));
220 transform: translate(var(--usk-edd-category-carousel-arrows-ncx, 0), var(--usk-edd-category-carousel-arrows-ncy, 40)); }
221
222 .elementor-widget-usk-edd-category-carousel .usk-dots-container {
223 -webkit-transform: translate(var(--usk-edd-category-carousel-dots-nnx, 0), var(--usk-edd-category-carousel-dots-nny, 30));
224 transform: translate(var(--usk-edd-category-carousel-dots-nnx, 0), var(--usk-edd-category-carousel-dots-nny, 30)); }
225
226 .elementor-widget-usk-edd-category-carousel .usk-arrows-dots-container {
227 -webkit-transform: translate(var(--usk-edd-category-carousel-both-ncx, 0), var(--usk-edd-category-carousel-both-ncy, 40));
228 transform: translate(var(--usk-edd-category-carousel-both-ncx, 0), var(--usk-edd-category-carousel-both-ncy, 40)); }
229
230 .elementor-widget-usk-edd-category-carousel .usk-arrows-fraction-container {
231 -webkit-transform: translate(var(--usk-edd-category-carousel-arrows-fraction-ncx, 0), var(--usk-edd-category-carousel-arrows-fraction-ncy, 40));
232 transform: translate(var(--usk-edd-category-carousel-arrows-fraction-ncx, 0), var(--usk-edd-category-carousel-arrows-fraction-ncy, 40)); }
233
234 .elementor-widget-usk-edd-category-carousel .usk-position-center-left .usk-arrows-container,
235 .elementor-widget-usk-edd-category-carousel .usk-position-center-right .usk-arrows-container {
236 -webkit-transform: translate(var(--usk-edd-category-carousel-arrows-ncx, 0), var(--usk-edd-category-carousel-arrows-ncy, 0)) rotate(90deg);
237 transform: translate(var(--usk-edd-category-carousel-arrows-ncx, 0), var(--usk-edd-category-carousel-arrows-ncy, 0)) rotate(90deg); }
238
239 .elementor-widget-usk-edd-category-carousel .usk-position-center-left .usk-dots-container,
240 .elementor-widget-usk-edd-category-carousel .usk-position-center-right .usk-dots-container {
241 -webkit-transform: translate(var(--usk-edd-category-carousel-dots-nnx, 0), var(--usk-edd-category-carousel-dots-nny, 0)) rotate(90deg);
242 transform: translate(var(--usk-edd-category-carousel-dots-nnx, 0), var(--usk-edd-category-carousel-dots-nny, 0)) rotate(90deg); }
243
244 .elementor-widget-usk-edd-category-carousel .usk-position-center-left .usk-arrows-dots-container,
245 .elementor-widget-usk-edd-category-carousel .usk-position-center-right .usk-arrows-dots-container {
246 -webkit-transform: translate(var(--usk-edd-category-carousel-both-ncx, 0), var(--usk-edd-category-carousel-both-ncy, 0)) rotate(90deg);
247 transform: translate(var(--usk-edd-category-carousel-both-ncx, 0), var(--usk-edd-category-carousel-both-ncy, 0)) rotate(90deg); }
248
249 .elementor-widget-usk-edd-category-carousel .usk-position-center-left .usk-arrows-fraction-container,
250 .elementor-widget-usk-edd-category-carousel .usk-position-center-right .usk-arrows-fraction-container {
251 -webkit-transform: translate(var(--usk-edd-category-carousel-arrows-fraction-ncx, 0), var(--usk-edd-category-carousel-arrows-fraction-ncy, 0)) rotate(90deg);
252 transform: translate(var(--usk-edd-category-carousel-arrows-fraction-ncx, 0), var(--usk-edd-category-carousel-arrows-fraction-ncy, 0)) rotate(90deg); }
253