appscms-tools-theme 5.7.1 → 5.7.2
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.
- checksums.yaml +4 -4
- data/_data/.DS_Store +0 -0
- data/_data/home/.DS_Store +0 -0
- data/_data/home/en/latest-tools.json +110 -6
- data/_includes/.DS_Store +0 -0
- data/_includes/appscms/.DS_Store +0 -0
- data/_includes/appscms/home/latest-features-display.html +41 -274
- data/assets/.DS_Store +0 -0
- data/assets/css/appscms-theme.css +215 -0
- metadata +1 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 9f69fe9a242e8e061790dd366ab4d1cc79165364d34e23684fd478f2a457a1db
|
|
4
|
+
data.tar.gz: 48ecaa4c9a86a79f94fedc2ae283a77c1d0b80526cb0c6fce795f5124fb91c1e
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: b5b1ecb1776df88507c7346a6dfbb067cfbb9cca416da039de61b3c54b1894f7b5c3b0e24b2dd9c4ff9cff88adfbd61fd667e8414529532f4940309fec23e960
|
|
7
|
+
data.tar.gz: 7413ff5af957e3ca376bec58eccf3193f2d450730de95f3d43211bc57c91f624bcce62bdfb8a0325fc4537c91de7f77f445ad0c8153aba6c9774d73ea6ddd5dd
|
data/_data/.DS_Store
CHANGED
|
Binary file
|
data/_data/home/.DS_Store
CHANGED
|
Binary file
|
|
@@ -6,37 +6,141 @@
|
|
|
6
6
|
"name": "PDF Creator",
|
|
7
7
|
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
8
8
|
"url": "/pdf-creator",
|
|
9
|
-
"icon": "/assets/images/convert.svg"
|
|
9
|
+
"icon": "/assets/images/convert.svg",
|
|
10
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
10
11
|
},
|
|
11
12
|
{
|
|
12
13
|
"name": "Background Remover",
|
|
13
14
|
"description": "Remove or change the background on any photo instantly",
|
|
14
15
|
"url": "/background-remover",
|
|
15
|
-
"icon": "/assets/images/digipaint.svg"
|
|
16
|
+
"icon": "/assets/images/digipaint.svg",
|
|
17
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"name": "PDF Creator",
|
|
21
|
+
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
22
|
+
"url": "/pdf-creator",
|
|
23
|
+
"icon": "/assets/images/convert.svg",
|
|
24
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
"name": "Background Remover",
|
|
28
|
+
"description": "Remove or change the background on any photo instantly",
|
|
29
|
+
"url": "/background-remover",
|
|
30
|
+
"icon": "/assets/images/digipaint.svg",
|
|
31
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
32
|
+
},
|
|
33
|
+
{
|
|
34
|
+
"name": "PDF Creator",
|
|
35
|
+
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
36
|
+
"url": "/pdf-creator",
|
|
37
|
+
"icon": "/assets/images/convert.svg",
|
|
38
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"name": "Background Remover",
|
|
42
|
+
"description": "Remove or change the background on any photo instantly",
|
|
43
|
+
"url": "/background-remover",
|
|
44
|
+
"icon": "/assets/images/digipaint.svg",
|
|
45
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
46
|
+
},
|
|
47
|
+
{
|
|
48
|
+
"name": "PDF Creator",
|
|
49
|
+
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
50
|
+
"url": "/pdf-creator",
|
|
51
|
+
"icon": "/assets/images/convert.svg",
|
|
52
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
"name": "Background Remover",
|
|
56
|
+
"description": "Remove or change the background on any photo instantly",
|
|
57
|
+
"url": "/background-remover",
|
|
58
|
+
"icon": "/assets/images/digipaint.svg",
|
|
59
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
"name": "PDF Creator",
|
|
63
|
+
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
64
|
+
"url": "/pdf-creator",
|
|
65
|
+
"icon": "/assets/images/convert.svg",
|
|
66
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
67
|
+
},
|
|
68
|
+
{
|
|
69
|
+
"name": "Background Remover",
|
|
70
|
+
"description": "Remove or change the background on any photo instantly",
|
|
71
|
+
"url": "/background-remover",
|
|
72
|
+
"icon": "/assets/images/digipaint.svg",
|
|
73
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
74
|
+
},
|
|
75
|
+
{
|
|
76
|
+
"name": "PDF Creator",
|
|
77
|
+
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
78
|
+
"url": "/pdf-creator",
|
|
79
|
+
"icon": "/assets/images/convert.svg",
|
|
80
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
"name": "Background Remover",
|
|
84
|
+
"description": "Remove or change the background on any photo instantly",
|
|
85
|
+
"url": "/background-remover",
|
|
86
|
+
"icon": "/assets/images/digipaint.svg",
|
|
87
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
88
|
+
},
|
|
89
|
+
{
|
|
90
|
+
"name": "PDF Creator",
|
|
91
|
+
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
92
|
+
"url": "/pdf-creator",
|
|
93
|
+
"icon": "/assets/images/convert.svg",
|
|
94
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
95
|
+
},
|
|
96
|
+
{
|
|
97
|
+
"name": "Background Remover",
|
|
98
|
+
"description": "Remove or change the background on any photo instantly",
|
|
99
|
+
"url": "/background-remover",
|
|
100
|
+
"icon": "/assets/images/digipaint.svg",
|
|
101
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
102
|
+
},
|
|
103
|
+
{
|
|
104
|
+
"name": "PDF Creator",
|
|
105
|
+
"description": "Create a PDF quickly and easily with our free online PDF creator",
|
|
106
|
+
"url": "/pdf-creator",
|
|
107
|
+
"icon": "/assets/images/convert.svg",
|
|
108
|
+
"bg": "linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%)"
|
|
109
|
+
},
|
|
110
|
+
{
|
|
111
|
+
"name": "Background Remover",
|
|
112
|
+
"description": "Remove or change the background on any photo instantly",
|
|
113
|
+
"url": "/background-remover",
|
|
114
|
+
"icon": "/assets/images/digipaint.svg",
|
|
115
|
+
"bg": "linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%)"
|
|
16
116
|
},
|
|
17
117
|
{
|
|
18
118
|
"name": "Photo Cleanup",
|
|
19
119
|
"description": "Use AI to remove unwanted objects, items, or people from an image",
|
|
20
120
|
"url": "/photo-cleanup",
|
|
21
|
-
"icon": "/assets/images/vectorpaint.svg"
|
|
121
|
+
"icon": "/assets/images/vectorpaint.svg",
|
|
122
|
+
"bg": "linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%)"
|
|
22
123
|
},
|
|
23
124
|
{
|
|
24
125
|
"name": "Image Converter",
|
|
25
126
|
"description": "Convert images between JPG, PNG, WEBP and more formats in seconds",
|
|
26
127
|
"url": "/image-converter",
|
|
27
|
-
"icon": "/assets/images/addimg.svg"
|
|
128
|
+
"icon": "/assets/images/addimg.svg",
|
|
129
|
+
"bg": "linear-gradient(135deg, #fef9c3 0%, #fef08a 100%)"
|
|
28
130
|
},
|
|
29
131
|
{
|
|
30
132
|
"name": "Audio Converter",
|
|
31
133
|
"description": "Convert audio files to MP3, WAV, AAC and other formats with ease",
|
|
32
134
|
"url": "/audio-converter",
|
|
33
|
-
"icon": "/assets/images/audio-upload.svg"
|
|
135
|
+
"icon": "/assets/images/audio-upload.svg",
|
|
136
|
+
"bg": "linear-gradient(135deg, #ffe4e6 0%, #fecdd3 100%)"
|
|
34
137
|
},
|
|
35
138
|
{
|
|
36
139
|
"name": "Speed Test",
|
|
37
140
|
"description": "Check your internet connection speed quickly and accurately",
|
|
38
141
|
"url": "/speed-test",
|
|
39
|
-
"icon": "/assets/images/speed.svg"
|
|
142
|
+
"icon": "/assets/images/speed.svg",
|
|
143
|
+
"bg": "linear-gradient(135deg, #ecfdf5 0%, #a7f3d0 100%)"
|
|
40
144
|
}
|
|
41
145
|
]
|
|
42
146
|
}
|
data/_includes/.DS_Store
CHANGED
|
Binary file
|
data/_includes/appscms/.DS_Store
CHANGED
|
Binary file
|
|
@@ -4,284 +4,51 @@
|
|
|
4
4
|
{% if lfd_tools.size > 0 %}
|
|
5
5
|
<section class="lfd-section" aria-label="Latest Featured Tools">
|
|
6
6
|
<div class="container">
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
<div class="row">
|
|
17
|
-
{% for item in lfd_tools %}
|
|
18
|
-
<div class="col-12 col-sm-6 col-md-4 mb-4 lfd-col">
|
|
19
|
-
<a href="{{ item.url }}" class="lfd-card lfd-bg-{{ forloop.index }}">
|
|
20
|
-
<div class="lfd-preview">
|
|
21
|
-
<div class="lfd-browser-bar">
|
|
22
|
-
<span class="lfd-dot"></span>
|
|
23
|
-
<span class="lfd-dot"></span>
|
|
24
|
-
<span class="lfd-dot"></span>
|
|
25
|
-
<span class="lfd-url-bar"></span>
|
|
26
|
-
</div>
|
|
27
|
-
<div class="lfd-icon-wrap">
|
|
28
|
-
<img
|
|
29
|
-
src="{{ item.icon }}"
|
|
30
|
-
alt="{{ item.name }}"
|
|
31
|
-
class="lfd-icon"
|
|
32
|
-
crossorigin="anonymous"
|
|
33
|
-
loading="lazy"
|
|
34
|
-
/>
|
|
35
|
-
</div>
|
|
36
|
-
<span class="lfd-new-badge">NEW</span>
|
|
7
|
+
<div class="row justify-content-center">
|
|
8
|
+
<div class="col-12 col-md-9 col-xl-10">
|
|
9
|
+
|
|
10
|
+
<div class="row mb-4">
|
|
11
|
+
<div class="col">
|
|
12
|
+
<span class="lfd-eyebrow">What's New</span>
|
|
13
|
+
<p class="lfd-heading">{{ lfd.heading }}</p>
|
|
14
|
+
<p class="lfd-sub">{{ lfd.subtext }}</p>
|
|
37
15
|
</div>
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
16
|
+
</div>
|
|
17
|
+
|
|
18
|
+
<div class="row">
|
|
19
|
+
{% for item in lfd_tools %}
|
|
20
|
+
<div class="col-12 col-sm-6 col-md-4 mb-4 lfd-col" style="--lfd-i: {{ forloop.index0 }};">
|
|
21
|
+
<a href="{{ item.url }}" class="lfd-card">
|
|
22
|
+
<div class="lfd-preview" style="background: {{ item.bg }};">
|
|
23
|
+
<div class="lfd-browser-bar">
|
|
24
|
+
<span class="lfd-dot"></span>
|
|
25
|
+
<span class="lfd-dot"></span>
|
|
26
|
+
<span class="lfd-dot"></span>
|
|
27
|
+
<span class="lfd-url-bar"></span>
|
|
28
|
+
</div>
|
|
29
|
+
<div class="lfd-icon-wrap">
|
|
30
|
+
<img
|
|
31
|
+
src="{{ item.icon }}"
|
|
32
|
+
alt="{{ item.name }}"
|
|
33
|
+
class="lfd-icon"
|
|
34
|
+
crossorigin="anonymous"
|
|
35
|
+
loading="lazy"
|
|
36
|
+
/>
|
|
37
|
+
</div>
|
|
38
|
+
<span class="lfd-new-badge">NEW</span>
|
|
39
|
+
</div>
|
|
40
|
+
<div class="lfd-info">
|
|
41
|
+
<p class="lfd-title">{{ item.name | truncate: 36, ".." }}</p>
|
|
42
|
+
<p class="lfd-desc">{{ item.description | truncate: 90, ".." }}</p>
|
|
43
|
+
<span class="lfd-cta">Try it free →</span>
|
|
44
|
+
</div>
|
|
45
|
+
</a>
|
|
42
46
|
</div>
|
|
43
|
-
|
|
47
|
+
{% endfor %}
|
|
48
|
+
</div>
|
|
49
|
+
|
|
44
50
|
</div>
|
|
45
|
-
{% endfor %}
|
|
46
51
|
</div>
|
|
47
|
-
|
|
48
52
|
</div>
|
|
49
53
|
</section>
|
|
50
|
-
|
|
51
|
-
<style>
|
|
52
|
-
.lfd-section {
|
|
53
|
-
padding: 3.5rem 0 4.5rem;
|
|
54
|
-
background: #f5f7fb;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
.lfd-eyebrow {
|
|
58
|
-
display: inline-block;
|
|
59
|
-
font-size: .72rem;
|
|
60
|
-
font-weight: 700;
|
|
61
|
-
letter-spacing: .12em;
|
|
62
|
-
text-transform: uppercase;
|
|
63
|
-
color: #2563eb;
|
|
64
|
-
background: #dbeafe;
|
|
65
|
-
border-radius: 999px;
|
|
66
|
-
padding: .2rem .8rem;
|
|
67
|
-
margin-bottom: .65rem;
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
.lfd-heading {
|
|
71
|
-
font-size: clamp(1.4rem, 3vw, 2rem);
|
|
72
|
-
font-weight: 800;
|
|
73
|
-
color: #0f172a;
|
|
74
|
-
margin-bottom: .3rem;
|
|
75
|
-
line-height: 1.2;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
.lfd-sub {
|
|
79
|
-
color: #64748b;
|
|
80
|
-
font-size: .95rem;
|
|
81
|
-
margin-bottom: 0;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
/* card */
|
|
85
|
-
.lfd-card {
|
|
86
|
-
display: block;
|
|
87
|
-
background: #fff;
|
|
88
|
-
border-radius: 1rem;
|
|
89
|
-
overflow: hidden;
|
|
90
|
-
text-decoration: none;
|
|
91
|
-
height: 100%;
|
|
92
|
-
box-shadow: 0 1px 4px rgba(0,0,0,.07);
|
|
93
|
-
transition: box-shadow .25s, transform .25s;
|
|
94
|
-
animation: lfd-rise .7s cubic-bezier(.22,.68,0,1.2) both, lfd-ring 2.8s ease-in-out 1.2s infinite;
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
.lfd-card:hover {
|
|
98
|
-
box-shadow: 0 14px 36px rgba(37,99,235,.22);
|
|
99
|
-
transform: translateY(-8px);
|
|
100
|
-
text-decoration: none;
|
|
101
|
-
animation-play-state: paused, paused;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
@keyframes lfd-ring {
|
|
105
|
-
0%, 100% { box-shadow: 0 1px 4px rgba(0,0,0,.07); }
|
|
106
|
-
50% { box-shadow: 0 0 0 4px rgba(37,99,235,.35), 0 8px 28px rgba(37,99,235,.18); }
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
/* staggered entry animation */
|
|
110
|
-
.lfd-col:nth-child(1) .lfd-card { animation-delay: 0ms; }
|
|
111
|
-
.lfd-col:nth-child(2) .lfd-card { animation-delay: 90ms; }
|
|
112
|
-
.lfd-col:nth-child(3) .lfd-card { animation-delay: 180ms; }
|
|
113
|
-
.lfd-col:nth-child(4) .lfd-card { animation-delay: 270ms; }
|
|
114
|
-
.lfd-col:nth-child(5) .lfd-card { animation-delay: 360ms; }
|
|
115
|
-
.lfd-col:nth-child(6) .lfd-card { animation-delay: 450ms; }
|
|
116
|
-
|
|
117
|
-
@keyframes lfd-rise {
|
|
118
|
-
from { opacity: 0; transform: translateY(40px) scale(.92); }
|
|
119
|
-
to { opacity: 1; transform: translateY(0) scale(1); }
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
/* preview background colours — match order in latest-tools.json */
|
|
123
|
-
.lfd-bg-1 .lfd-preview { background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%); }
|
|
124
|
-
.lfd-bg-2 .lfd-preview { background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%); }
|
|
125
|
-
.lfd-bg-3 .lfd-preview { background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%); }
|
|
126
|
-
.lfd-bg-4 .lfd-preview { background: linear-gradient(135deg, #fef9c3 0%, #fef08a 100%); }
|
|
127
|
-
.lfd-bg-5 .lfd-preview { background: linear-gradient(135deg, #ffe4e6 0%, #fecdd3 100%); }
|
|
128
|
-
.lfd-bg-6 .lfd-preview { background: linear-gradient(135deg, #ecfdf5 0%, #a7f3d0 100%); }
|
|
129
|
-
|
|
130
|
-
/* preview area */
|
|
131
|
-
.lfd-preview {
|
|
132
|
-
position: relative;
|
|
133
|
-
height: 190px;
|
|
134
|
-
display: flex;
|
|
135
|
-
align-items: center;
|
|
136
|
-
justify-content: center;
|
|
137
|
-
overflow: hidden;
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
/* shine sweep across preview */
|
|
141
|
-
.lfd-preview::after {
|
|
142
|
-
content: '';
|
|
143
|
-
position: absolute;
|
|
144
|
-
top: 0; bottom: 0;
|
|
145
|
-
left: -60%;
|
|
146
|
-
width: 40%;
|
|
147
|
-
background: linear-gradient(
|
|
148
|
-
105deg,
|
|
149
|
-
transparent 0%,
|
|
150
|
-
rgba(255,255,255,.85) 50%,
|
|
151
|
-
transparent 100%
|
|
152
|
-
);
|
|
153
|
-
transform: skewX(-15deg);
|
|
154
|
-
animation: lfd-shine 2.8s ease-in-out infinite;
|
|
155
|
-
pointer-events: none;
|
|
156
|
-
}
|
|
157
|
-
|
|
158
|
-
.lfd-col:nth-child(1) .lfd-preview::after { animation-delay: 0s; }
|
|
159
|
-
.lfd-col:nth-child(2) .lfd-preview::after { animation-delay: .45s; }
|
|
160
|
-
.lfd-col:nth-child(3) .lfd-preview::after { animation-delay: .9s; }
|
|
161
|
-
.lfd-col:nth-child(4) .lfd-preview::after { animation-delay: 1.35s; }
|
|
162
|
-
.lfd-col:nth-child(5) .lfd-preview::after { animation-delay: 1.8s; }
|
|
163
|
-
.lfd-col:nth-child(6) .lfd-preview::after { animation-delay: 2.25s; }
|
|
164
|
-
|
|
165
|
-
@keyframes lfd-shine {
|
|
166
|
-
0% { left: -60%; opacity: 0; }
|
|
167
|
-
10% { opacity: 1; }
|
|
168
|
-
60% { left: 130%; opacity: 1; }
|
|
169
|
-
61%, 100% { left: 130%; opacity: 0; }
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
.lfd-browser-bar {
|
|
173
|
-
position: absolute;
|
|
174
|
-
top: 10px;
|
|
175
|
-
left: 10px;
|
|
176
|
-
right: 10px;
|
|
177
|
-
height: 20px;
|
|
178
|
-
background: rgba(255,255,255,.6);
|
|
179
|
-
border-radius: 5px;
|
|
180
|
-
display: flex;
|
|
181
|
-
align-items: center;
|
|
182
|
-
padding: 0 7px;
|
|
183
|
-
gap: 5px;
|
|
184
|
-
backdrop-filter: blur(4px);
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
.lfd-dot {
|
|
188
|
-
width: 7px;
|
|
189
|
-
height: 7px;
|
|
190
|
-
border-radius: 50%;
|
|
191
|
-
background: rgba(0,0,0,.18);
|
|
192
|
-
flex-shrink: 0;
|
|
193
|
-
}
|
|
194
|
-
|
|
195
|
-
.lfd-url-bar {
|
|
196
|
-
flex: 1;
|
|
197
|
-
height: 7px;
|
|
198
|
-
background: rgba(0,0,0,.1);
|
|
199
|
-
border-radius: 4px;
|
|
200
|
-
margin-left: 5px;
|
|
201
|
-
}
|
|
202
|
-
|
|
203
|
-
.lfd-icon-wrap {
|
|
204
|
-
display: flex;
|
|
205
|
-
align-items: center;
|
|
206
|
-
justify-content: center;
|
|
207
|
-
padding-top: 8px;
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
.lfd-icon {
|
|
211
|
-
width: 72px;
|
|
212
|
-
height: 72px;
|
|
213
|
-
object-fit: contain;
|
|
214
|
-
filter: drop-shadow(0 6px 18px rgba(0,0,0,.22));
|
|
215
|
-
animation: lfd-float 2.4s ease-in-out infinite;
|
|
216
|
-
}
|
|
217
|
-
|
|
218
|
-
@keyframes lfd-float {
|
|
219
|
-
0%, 100% { transform: translateY(0) scale(1); }
|
|
220
|
-
50% { transform: translateY(-16px) scale(1.08); }
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
/* NEW badge */
|
|
224
|
-
.lfd-new-badge {
|
|
225
|
-
position: absolute;
|
|
226
|
-
top: 36px;
|
|
227
|
-
right: 10px;
|
|
228
|
-
background: #2563eb;
|
|
229
|
-
color: #fff;
|
|
230
|
-
font-size: .65rem;
|
|
231
|
-
font-weight: 800;
|
|
232
|
-
letter-spacing: .12em;
|
|
233
|
-
padding: .2rem .55rem;
|
|
234
|
-
border-radius: 5px;
|
|
235
|
-
box-shadow: 0 0 0 0 rgba(37,99,235,.7);
|
|
236
|
-
animation: lfd-badge-pop 1.6s ease-out infinite;
|
|
237
|
-
}
|
|
238
|
-
|
|
239
|
-
@keyframes lfd-badge-pop {
|
|
240
|
-
0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37,99,235,.7); }
|
|
241
|
-
50% { transform: scale(1.18); box-shadow: 0 0 0 10px rgba(37,99,235,0); }
|
|
242
|
-
100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37,99,235,0); }
|
|
243
|
-
}
|
|
244
|
-
|
|
245
|
-
/* card body */
|
|
246
|
-
.lfd-info {
|
|
247
|
-
padding: 1.1rem 1.2rem 1.3rem;
|
|
248
|
-
}
|
|
249
|
-
|
|
250
|
-
.lfd-title {
|
|
251
|
-
font-size: 1rem;
|
|
252
|
-
font-weight: 700;
|
|
253
|
-
color: #0f172a;
|
|
254
|
-
margin-bottom: .3rem;
|
|
255
|
-
}
|
|
256
|
-
|
|
257
|
-
.lfd-desc {
|
|
258
|
-
font-size: .84rem;
|
|
259
|
-
color: #475569;
|
|
260
|
-
line-height: 1.55;
|
|
261
|
-
margin-bottom: .75rem;
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
.lfd-cta {
|
|
265
|
-
font-size: .9rem;
|
|
266
|
-
font-weight: 700;
|
|
267
|
-
color: #fff;
|
|
268
|
-
background: #2563eb;
|
|
269
|
-
display: inline-block;
|
|
270
|
-
padding: .4rem 1rem;
|
|
271
|
-
border-radius: 999px;
|
|
272
|
-
animation: lfd-nudge 1.4s ease-in-out infinite;
|
|
273
|
-
}
|
|
274
|
-
|
|
275
|
-
@keyframes lfd-nudge {
|
|
276
|
-
0%, 100% { transform: translateX(0) scale(1); }
|
|
277
|
-
40% { transform: translateX(8px) scale(1.05); }
|
|
278
|
-
60% { transform: translateX(4px) scale(1.02); }
|
|
279
|
-
}
|
|
280
|
-
|
|
281
|
-
.lfd-card:hover .lfd-cta {
|
|
282
|
-
animation-play-state: paused;
|
|
283
|
-
background: #1d4ed8;
|
|
284
|
-
transform: translateX(8px) scale(1.05);
|
|
285
|
-
}
|
|
286
|
-
</style>
|
|
287
54
|
{% endif %}
|
data/assets/.DS_Store
CHANGED
|
Binary file
|
|
@@ -3945,4 +3945,219 @@ textarea {
|
|
|
3945
3945
|
.trustpilot-h2{
|
|
3946
3946
|
padding: 1rem;
|
|
3947
3947
|
}
|
|
3948
|
+
}
|
|
3949
|
+
|
|
3950
|
+
/* ==========================================================================
|
|
3951
|
+
Latest Featured Tools (LFD)
|
|
3952
|
+
Colors per card come from _data/home/en/latest-tools.json (item.bg).
|
|
3953
|
+
Stagger index --lfd-i is set on .lfd-col so it scales to any N items.
|
|
3954
|
+
========================================================================== */
|
|
3955
|
+
.lfd-section {
|
|
3956
|
+
padding: 3.5rem 0 4.5rem;
|
|
3957
|
+
background: #f5f7fb;
|
|
3958
|
+
}
|
|
3959
|
+
|
|
3960
|
+
.lfd-eyebrow {
|
|
3961
|
+
display: inline-block;
|
|
3962
|
+
font-size: .72rem;
|
|
3963
|
+
font-weight: 700;
|
|
3964
|
+
letter-spacing: .12em;
|
|
3965
|
+
text-transform: uppercase;
|
|
3966
|
+
color: #2563eb;
|
|
3967
|
+
background: #dbeafe;
|
|
3968
|
+
border-radius: 999px;
|
|
3969
|
+
padding: .2rem .8rem;
|
|
3970
|
+
margin-bottom: .65rem;
|
|
3971
|
+
}
|
|
3972
|
+
|
|
3973
|
+
.lfd-heading {
|
|
3974
|
+
font-size: clamp(1.4rem, 3vw, 2rem);
|
|
3975
|
+
font-weight: 800;
|
|
3976
|
+
color: #0f172a;
|
|
3977
|
+
margin-bottom: .3rem;
|
|
3978
|
+
line-height: 1.2;
|
|
3979
|
+
}
|
|
3980
|
+
|
|
3981
|
+
.lfd-sub {
|
|
3982
|
+
color: #64748b;
|
|
3983
|
+
font-size: .95rem;
|
|
3984
|
+
margin-bottom: 0;
|
|
3985
|
+
}
|
|
3986
|
+
|
|
3987
|
+
.lfd-card {
|
|
3988
|
+
display: block;
|
|
3989
|
+
background: #fff;
|
|
3990
|
+
border-radius: 1rem;
|
|
3991
|
+
overflow: hidden;
|
|
3992
|
+
text-decoration: none;
|
|
3993
|
+
height: 100%;
|
|
3994
|
+
box-shadow: 0 1px 4px rgba(0,0,0,.07);
|
|
3995
|
+
transition: box-shadow .25s, transform .25s;
|
|
3996
|
+
animation: lfd-rise .7s cubic-bezier(.22,.68,0,1.2) both,
|
|
3997
|
+
lfd-ring 2.8s ease-in-out 1.2s infinite;
|
|
3998
|
+
animation-delay: calc(var(--lfd-i, 0) * 90ms), 1.2s;
|
|
3999
|
+
}
|
|
4000
|
+
|
|
4001
|
+
.lfd-card:hover {
|
|
4002
|
+
box-shadow: 0 14px 36px rgba(37,99,235,.22);
|
|
4003
|
+
transform: translateY(-8px);
|
|
4004
|
+
text-decoration: none;
|
|
4005
|
+
animation-play-state: paused, paused;
|
|
4006
|
+
}
|
|
4007
|
+
|
|
4008
|
+
@keyframes lfd-ring {
|
|
4009
|
+
0%, 100% { box-shadow: 0 1px 4px rgba(0,0,0,.07); }
|
|
4010
|
+
50% { box-shadow: 0 0 0 4px rgba(37,99,235,.35), 0 8px 28px rgba(37,99,235,.18); }
|
|
4011
|
+
}
|
|
4012
|
+
|
|
4013
|
+
@keyframes lfd-rise {
|
|
4014
|
+
from { opacity: 0; transform: translateY(40px) scale(.92); }
|
|
4015
|
+
to { opacity: 1; transform: translateY(0) scale(1); }
|
|
4016
|
+
}
|
|
4017
|
+
|
|
4018
|
+
.lfd-preview {
|
|
4019
|
+
position: relative;
|
|
4020
|
+
height: 190px;
|
|
4021
|
+
display: flex;
|
|
4022
|
+
align-items: center;
|
|
4023
|
+
justify-content: center;
|
|
4024
|
+
overflow: hidden;
|
|
4025
|
+
}
|
|
4026
|
+
|
|
4027
|
+
.lfd-preview::after {
|
|
4028
|
+
content: '';
|
|
4029
|
+
position: absolute;
|
|
4030
|
+
top: 0; bottom: 0;
|
|
4031
|
+
left: -60%;
|
|
4032
|
+
width: 40%;
|
|
4033
|
+
background: linear-gradient(
|
|
4034
|
+
105deg,
|
|
4035
|
+
transparent 0%,
|
|
4036
|
+
rgba(255,255,255,.85) 50%,
|
|
4037
|
+
transparent 100%
|
|
4038
|
+
);
|
|
4039
|
+
transform: skewX(-15deg);
|
|
4040
|
+
animation: lfd-shine 2.8s ease-in-out infinite;
|
|
4041
|
+
animation-delay: calc(var(--lfd-i, 0) * .45s);
|
|
4042
|
+
pointer-events: none;
|
|
4043
|
+
}
|
|
4044
|
+
|
|
4045
|
+
@keyframes lfd-shine {
|
|
4046
|
+
0% { left: -60%; opacity: 0; }
|
|
4047
|
+
10% { opacity: 1; }
|
|
4048
|
+
60% { left: 130%; opacity: 1; }
|
|
4049
|
+
61%, 100% { left: 130%; opacity: 0; }
|
|
4050
|
+
}
|
|
4051
|
+
|
|
4052
|
+
.lfd-browser-bar {
|
|
4053
|
+
position: absolute;
|
|
4054
|
+
top: 10px;
|
|
4055
|
+
left: 10px;
|
|
4056
|
+
right: 10px;
|
|
4057
|
+
height: 20px;
|
|
4058
|
+
background: rgba(255,255,255,.6);
|
|
4059
|
+
border-radius: 5px;
|
|
4060
|
+
display: flex;
|
|
4061
|
+
align-items: center;
|
|
4062
|
+
padding: 0 7px;
|
|
4063
|
+
gap: 5px;
|
|
4064
|
+
backdrop-filter: blur(4px);
|
|
4065
|
+
}
|
|
4066
|
+
|
|
4067
|
+
.lfd-dot {
|
|
4068
|
+
width: 7px;
|
|
4069
|
+
height: 7px;
|
|
4070
|
+
border-radius: 50%;
|
|
4071
|
+
background: rgba(0,0,0,.18);
|
|
4072
|
+
flex-shrink: 0;
|
|
4073
|
+
}
|
|
4074
|
+
|
|
4075
|
+
.lfd-url-bar {
|
|
4076
|
+
flex: 1;
|
|
4077
|
+
height: 7px;
|
|
4078
|
+
background: rgba(0,0,0,.1);
|
|
4079
|
+
border-radius: 4px;
|
|
4080
|
+
margin-left: 5px;
|
|
4081
|
+
}
|
|
4082
|
+
|
|
4083
|
+
.lfd-icon-wrap {
|
|
4084
|
+
display: flex;
|
|
4085
|
+
align-items: center;
|
|
4086
|
+
justify-content: center;
|
|
4087
|
+
padding-top: 8px;
|
|
4088
|
+
}
|
|
4089
|
+
|
|
4090
|
+
.lfd-icon {
|
|
4091
|
+
width: 72px;
|
|
4092
|
+
height: 72px;
|
|
4093
|
+
object-fit: contain;
|
|
4094
|
+
filter: drop-shadow(0 6px 18px rgba(0,0,0,.22));
|
|
4095
|
+
animation: lfd-float 2.4s ease-in-out infinite;
|
|
4096
|
+
}
|
|
4097
|
+
|
|
4098
|
+
@keyframes lfd-float {
|
|
4099
|
+
0%, 100% { transform: translateY(0) scale(1); }
|
|
4100
|
+
50% { transform: translateY(-16px) scale(1.08); }
|
|
4101
|
+
}
|
|
4102
|
+
|
|
4103
|
+
.lfd-new-badge {
|
|
4104
|
+
position: absolute;
|
|
4105
|
+
top: 36px;
|
|
4106
|
+
right: 10px;
|
|
4107
|
+
background: #2563eb;
|
|
4108
|
+
color: #fff;
|
|
4109
|
+
font-size: .65rem;
|
|
4110
|
+
font-weight: 800;
|
|
4111
|
+
letter-spacing: .12em;
|
|
4112
|
+
padding: .2rem .55rem;
|
|
4113
|
+
border-radius: 5px;
|
|
4114
|
+
box-shadow: 0 0 0 0 rgba(37,99,235,.7);
|
|
4115
|
+
animation: lfd-badge-pop 1.6s ease-out infinite;
|
|
4116
|
+
}
|
|
4117
|
+
|
|
4118
|
+
@keyframes lfd-badge-pop {
|
|
4119
|
+
0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37,99,235,.7); }
|
|
4120
|
+
50% { transform: scale(1.18); box-shadow: 0 0 0 10px rgba(37,99,235,0); }
|
|
4121
|
+
100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37,99,235,0); }
|
|
4122
|
+
}
|
|
4123
|
+
|
|
4124
|
+
.lfd-info {
|
|
4125
|
+
padding: 1.1rem 1.2rem 1.3rem;
|
|
4126
|
+
}
|
|
4127
|
+
|
|
4128
|
+
.lfd-title {
|
|
4129
|
+
font-size: 1rem;
|
|
4130
|
+
font-weight: 700;
|
|
4131
|
+
color: #0f172a;
|
|
4132
|
+
margin-bottom: .3rem;
|
|
4133
|
+
}
|
|
4134
|
+
|
|
4135
|
+
.lfd-desc {
|
|
4136
|
+
font-size: .84rem;
|
|
4137
|
+
color: #475569;
|
|
4138
|
+
line-height: 1.55;
|
|
4139
|
+
margin-bottom: .75rem;
|
|
4140
|
+
}
|
|
4141
|
+
|
|
4142
|
+
.lfd-cta {
|
|
4143
|
+
font-size: .9rem;
|
|
4144
|
+
font-weight: 700;
|
|
4145
|
+
color: #fff;
|
|
4146
|
+
background: #2563eb;
|
|
4147
|
+
display: inline-block;
|
|
4148
|
+
padding: .4rem 1rem;
|
|
4149
|
+
border-radius: 999px;
|
|
4150
|
+
animation: lfd-nudge 1.4s ease-in-out infinite;
|
|
4151
|
+
}
|
|
4152
|
+
|
|
4153
|
+
@keyframes lfd-nudge {
|
|
4154
|
+
0%, 100% { transform: translateX(0) scale(1); }
|
|
4155
|
+
40% { transform: translateX(8px) scale(1.05); }
|
|
4156
|
+
60% { transform: translateX(4px) scale(1.02); }
|
|
4157
|
+
}
|
|
4158
|
+
|
|
4159
|
+
.lfd-card:hover .lfd-cta {
|
|
4160
|
+
animation-play-state: paused;
|
|
4161
|
+
background: #1d4ed8;
|
|
4162
|
+
transform: translateX(8px) scale(1.05);
|
|
3948
4163
|
}
|