PluginProbe
Easy Elements for Elementor – Addons & Website Templates / 1.3.4
Easy Elements for Elementor – Addons & Website Templates v1.3.4
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.scss

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

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