PluginProbe
Easy Elements for Elementor – Addons & Website Templates / 1.5.0
Easy Elements for Elementor – Addons & Website Templates v1.5.0
1.5.3 1.5.2 1.5.1 1.5.0 1.4.9 1.4.6 1.4.7 1.4.8 1.4.5 1.4.4 1.4.3 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.7 1.3.8 1.3.9 1.4.0 All 47 releases
easy-elements / widgets / archive-post / css / archive-post.css

archive-post.css in Easy Elements for Elementor – Addons & Website Templates 1.5.0, at widgets/archive-post/css/archive-post.css

340 lines 5.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 :root {
2 --e-global-color-primary: #FFD012;
3 --e-global-color-secondary: #0B3665;
4 }
5
6 .eel-post-grid-wrap {
7 display: grid;
8 flex-wrap: wrap;
9 gap: 30px;
10 }
11
12 .eel-post-grid-wrap .grid-item {
13 box-sizing: border-box;
14 }
15
16 .eel-post-grid-wrap .eel-blog-img {
17 max-width: 100%;
18 height: auto;
19 display: block;
20 margin: 0 auto;
21 }
22
23 .eel--blog-img img {
24 display: block;
25 -o-object-fit: cover;
26 object-fit: cover;
27 width: 100%;
28 }
29
30 .elementor-widget-eel-archive-post .eel--blog-img {
31 overflow: hidden;
32 }
33
34 .eel-post-grid-wrap .grid-item img {
35 max-width: 100%;
36 height: auto;
37 display: block;
38 -o-object-fit: cover;
39 object-fit: cover;
40 transition: transform 0.5s ease;
41 }
42
43 .eel-post-grid-wrap .grid-item-inner {
44 overflow: hidden;
45 position: relative;
46 }
47
48 .eel--blog-date-top {
49 position: absolute;
50 top: 0;
51 right: 0;
52 background: var(--e-global-color-primary);
53 display: inline-block;
54 padding: 20px;
55 padding-bottom: 6px;
56 text-align: center;
57 border-radius: 4px;
58 color: #fff;
59 margin: 25px;
60 z-index: 2;
61 }
62 .eel--blog-date-top h4 {
63 margin: 0;
64 color: #fff;
65 font-size: 36px;
66 line-height: 1;
67 }
68
69 .eel--blog-category-badge {
70 position: absolute;
71 top: 0;
72 left: 0;
73 display: grid;
74 padding: 6px 14px;
75 margin: 15px;
76 border-radius: 4px;
77 background: var(--e-global-color-primary);
78 z-index: 2;
79 }
80 .eel--blog-category-badge a {
81 color: #fff;
82 text-decoration: none;
83 font-size: 13px;
84 font-weight: 500;
85 line-height: 1.4;
86 }
87
88 .eel-post-grid-wrap .post-title {
89 font-weight: bold;
90 margin: 10px 0 5px;
91 font-size: 1.2em;
92 }
93
94 .elementor-widget-eel-archive-post .eel--blog-meta li + li {
95 padding-left: 10px;
96 margin-left: 10px;
97 }
98
99 .eel-post-grid-wrap .eel--blog-meta {
100 margin: 20px 0 5px;
101 padding: 0;
102 list-style: none;
103 display: inline-flex;
104 flex-wrap: wrap;
105 font-size: 14px;
106 line-height: 120%;
107 align-items: center;
108 }
109 .eel-post-grid-wrap .eel--blog-meta a {
110 color: currentColor;
111 }
112 .eel-post-grid-wrap .eel--blog-meta a:hover {
113 color: var(--e-global-color-primary);
114 }
115 .eel-post-grid-wrap .eel--blog-meta li {
116 position: relative;
117 }
118 .eel-post-grid-wrap .eel--blog-meta .eel--has-avatar {
119 display: inline-flex;
120 align-items: center;
121 }
122 .eel-post-grid-wrap .eel--blog-meta .eel--has-avatar .eel--author-avatar {
123 width: 28px;
124 height: 28px;
125 border-radius: 50%;
126 -o-object-fit: cover;
127 object-fit: cover;
128 margin-right: 6px;
129 }
130
131 .eel--separator--line li + li {
132 padding-left: 10px;
133 }
134 .eel--separator--line li + li::before {
135 content: "";
136 position: absolute;
137 left: 0;
138 top: 3px;
139 background: #000;
140 width: 1px;
141 height: 10px;
142 }
143
144 .eel--separator--circle li + li {
145 padding-left: 14px;
146 }
147 .eel--separator--circle li + li::before {
148 content: "";
149 position: absolute;
150 left: 0;
151 top: 8px;
152 background: #000;
153 width: 5px;
154 height: 5px;
155 border-radius: 100%;
156 }
157
158 .eel-post-grid-wrap .read-more {
159 display: inline-block;
160 margin-top: 10px;
161 text-decoration: none;
162 }
163
164 .eel--blog-excerpt {
165 margin-bottom: 20px;
166 }
167 .eel--blog-excerpt a {
168 color: currentColor;
169 }
170
171 .ee--blog-title a {
172 color: currentColor;
173 }
174 .ee--blog-title a:hover {
175 color: var(--e-global-color-primary);
176 }
177
178 .eel-post-grid-wrap .read-more:hover {
179 text-decoration: underline;
180 }
181
182 .eel--read-more a {
183 display: inline-flex;
184 align-items: center;
185 color: currentColor;
186 }
187 .eel--read-more a:hover {
188 color: var(--e-global-color-primary);
189 }
190
191 .eel--read-more-icon.after {
192 margin-left: 6px;
193 top: 1px;
194 }
195
196 .eel--read-more-icon.before {
197 margin-right: 6px;
198 top: 1px;
199 }
200
201 .eel-post-grid-wrap svg,
202 .eel-post-grid-wrap i {
203 font-size: 16px;
204 height: 1em;
205 margin-right: 5px;
206 position: relative;
207 top: 2px;
208 }
209
210 .eel--button-icon {
211 display: inline-grid;
212 width: 40px;
213 height: 40px;
214 border-radius: 100%;
215 place-content: center;
216 transition: all 0.5s ease;
217 background: var(--e-global-color-primary);
218 align-items: center;
219 cursor: pointer;
220 }
221 .eel--button-icon svg,
222 .eel--button-icon i {
223 margin: 0;
224 top: 0;
225 color: #fff;
226 fill: #fff;
227 }
228
229 .eel-blog-pagination {
230 text-align: center;
231 margin-top: 40px;
232 }
233
234 .eel-blog-pagination ul {
235 display: inline-flex;
236 gap: 8px;
237 padding-left: 0;
238 list-style: none;
239 margin: 0;
240 }
241
242 .eel-blog-pagination ul li {
243 display: inline-block;
244 }
245
246 .eel-blog-pagination ul li a,
247 .eel-blog-pagination ul li span {
248 display: inline-flex;
249 justify-content: center;
250 align-items: center;
251 width: 40px;
252 height: 40px;
253 font-size: 14px;
254 color: #333;
255 background-color: #f3f3f3;
256 border-radius: 8px;
257 text-decoration: none;
258 transition: all 0.3s ease;
259 box-shadow: 0 5px 10px rgba(14, 13, 13, 0.1019607843);
260 }
261
262 .eel-blog-pagination ul li a:hover {
263 background-color: var(--e-global-color-primary);
264 color: var(--e-global-color-secondary);
265 border-color: var(--e-global-color-primary);
266 }
267
268 .eel-blog-pagination ul li span.current {
269 background-color: var(--e-global-color-primary);
270 color: var(--e-global-color-secondary);
271 border-color: var(--e-global-color-primary);
272 cursor: default;
273 }
274
275 .eel-no-posts-found {
276 text-align: center;
277 max-width: 700px;
278 margin: 0 auto;
279 }
280
281 .eel-no-posts-found p {
282 margin-bottom: 20px;
283 line-height: 1.6;
284 }
285
286 .eel-no-posts-found p:first-child {
287 font-size: 45px;
288 color: var(--e-global-color-secondary);
289 margin-bottom: 10px;
290 margin-top: 0;
291 }
292
293 .eel-search-form {
294 margin-top: 30px;
295 }
296
297 .eel-search-form form {
298 display: flex;
299 margin: 0 auto;
300 border-radius: 8px;
301 overflow: hidden;
302 transition: all 0.3s ease;
303 border: 1px solid rgba(0, 0, 0, 0.1490196078);
304 }
305
306 .eel-search-field {
307 flex: 1;
308 padding: 17px 20px;
309 border: none;
310 outline: none;
311 font-size: 16px;
312 background: #fff;
313 }
314
315 .eel-search-field::-moz-placeholder {
316 color: #999;
317 }
318
319 .eel-search-field::placeholder {
320 color: #999;
321 }
322
323 .eel-search-submit {
324 padding: 17px 20px;
325 background: none;
326 border: none;
327 color: var(--e-global-color-secondary);
328 cursor: pointer;
329 transition: all 0.3s ease;
330 display: flex;
331 align-items: center;
332 justify-content: center;
333 min-width: 50px;
334 }
335
336 .eel-search-submit i {
337 font-size: 22px;
338 margin: 0;
339 top: 0;
340 }