PluginProbe
WP Directory Kit / 1.2.7
WP Directory Kit v1.2.7
1.5.6 1.5.5 1.5.4 1.5.3 trunk 1.1.0 1.1.6 1.1.8 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 1.3.8 1.4.0 1.4.1 All 35 releases
wpdirectorykit / elementor-elements / assets / css / widgets / wdk-field-files-list.css

wdk-field-files-list.css in WP Directory Kit 1.2.7, at elementor-elements/assets/css/widgets/wdk-field-files-list.css

131 lines 3.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .wdk-field-files-list .wdk-listing-image {
2 object-fit: cover;
3 object-position: center center;
4 width: 100%;
5 height: 200px;
6 max-width: 100%;
7 display: block;
8 overflow: hidden;
9 }
10
11 .wdk-field-files-list .wdk-listing-image.auto_height {
12 object-fit: initial !important;
13 height: auto !important;
14 }
15
16 .wdk-field-files-list figure figcaption {
17 text-align: center;
18 color: #232425;
19 }
20
21 .wdk-field-files-list figure figcaption a {
22 color: inherit;
23 text-decoration: none;
24 }
25
26 .wdk-field-files-list figure figcaption:hover {
27 color: #0074E4;
28 }
29
30 .wdk-field-files-list .files-row ul.files,
31 .wdk-field-files-list .files-row ul.files li {
32 padding: 0;
33 margin: 0;
34 list-style: none;
35 }
36
37 .wdk-field-files-list .files-row ul.files li:not(:last-child) {
38 margin-bottom: 5px;
39 }
40
41 .wdk-field-files-list .files-row .list-item a {
42 display: inline-flex;
43 align-items: center;
44 text-decoration: none;
45 color: #232425;
46 }
47
48 .wdk-field-files-list .files-row .list-item a .wdk-listing-file-icon {
49 max-height: 25px;
50 max-width: 25px;
51 display: inline-block;
52 margin-right: 5px;
53 }
54
55 .wdk-field-files-list .files-row .list-item a:hover {
56 color: #0074E4;
57 }
58
59 .wdk-field-files-list.wdk_js_gallery {
60 /* animation */
61 }
62
63 .wdk-field-files-list.wdk_js_gallery .wdk-listing-image-card {
64 position: relative;
65 cursor: pointer;
66 display: block;
67 }
68
69 .wdk-field-files-list.wdk_js_gallery .wdk-listing-image-card .file.wdk-listing-image {
70 object-fit: contain !important;
71 }
72
73 .wdk-field-files-list.wdk_js_gallery .wdk-listing-image-card:before {
74 content: '';
75 opacity: 0;
76 left: 0;
77 width: 100%;
78 height: 100%;
79 top: 0;
80 position: absolute;
81 background: rgba(0, 0, 0, 0.65);
82 -webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
83 transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
84 -o-transition: transform .3s ease-out, opacity .3s ease-out;
85 transition: transform .3s ease-out, opacity .3s ease-out;
86 transition: transform .3s ease-out, opacity .3s ease-out, -webkit-transform .3s ease-out;
87 will-change: auto;
88 z-index: 1;
89 }
90
91 .wdk-field-files-list.wdk_js_gallery .wdk-listing-image-card:hover:before {
92 opacity: 1;
93 -webkit-transition: opacity .3s ease-in, -webkit-transform .3s ease-in;
94 transition: opacity .3s ease-in, -webkit-transform .3s ease-in;
95 -o-transition: transform .3s ease-in, opacity .3s ease-in;
96 transition: transform .3s ease-in, opacity .3s ease-in;
97 transition: transform .3s ease-in, opacity .3s ease-in, -webkit-transform .3s ease-in;
98 }
99
100 .wdk-field-files-list.wdk_js_gallery .wdk-listing-image-card:after {
101 content: '';
102 opacity: 0;
103 left: 0;
104 width: 100%;
105 height: 100%;
106 top: 0;
107 position: absolute;
108 background: url(../../../../public/img/plus.png) center center no-repeat;
109 -webkit-background-size: 50px 50px;
110 background-size: 50px 50px;
111 -webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
112 transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
113 -o-transition: transform .3s ease-out, opacity .3s ease-out;
114 transition: transform .3s ease-out, opacity .3s ease-out;
115 transition: transform .3s ease-out, opacity .3s ease-out, -webkit-transform .3s ease-out;
116 will-change: auto;
117 z-index: 2;
118 }
119
120 .wdk-field-files-list.wdk_js_gallery .wdk-listing-image-card:hover:after {
121 opacity: 1;
122 -webkit-transform: rotate(90deg);
123 -ms-transform: rotate(90deg);
124 transform: rotate(90deg);
125 -webkit-transition: opacity .3s ease-in, -webkit-transform .3s ease-in;
126 transition: opacity .3s ease-in, -webkit-transform .3s ease-in;
127 -o-transition: transform .3s ease-in, opacity .3s ease-in;
128 transition: transform .3s ease-in, opacity .3s ease-in;
129 transition: transform .3s ease-in, opacity .3s ease-in, -webkit-transform .3s ease-in;
130 }
131