appscms-tools-theme 2.2.9 → 2.3.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/_data/feature/en/compress-pdf.json +27 -25
- data/_data/feature/en/theframe.json +2 -2
- data/_data/footer/en/data.json +93 -1
- data/_data/header/en/data.json +47 -9
- data/_data/home/en/photoeffects.json +24 -0
- data/_data/home-1/en/en.json +58 -0
- data/_data/photo-categories.json +0 -117
- data/_data/photoeffects.json +117 -0
- data/_includes/batch-conversion.html +42 -13
- data/_includes/custom-head.html +7 -2
- data/_includes/footer/index.html +263 -2
- data/_includes/head/index.html +13 -0
- data/_includes/header/index.html +124 -5
- data/_includes/script.html +11 -0
- data/_layouts/batch.html +19 -13
- data/_layouts/blog-1.html +100 -0
- data/_layouts/feature-1.html +283 -0
- data/_layouts/feature-download.html +309 -0
- data/_layouts/feature.html +1 -1
- data/_layouts/frame.html +54 -44
- data/_layouts/home-1.html +267 -0
- data/_layouts/home.html +4 -4
- data/_layouts/photo-effects-home.html +84 -0
- data/assets/css/batch.css +32 -17
- data/assets/css/blog-1.css +66 -0
- data/assets/css/common-page.css +180 -0
- data/assets/css/feature-1.css +426 -0
- data/assets/css/frame.css +207 -31
- data/assets/css/home-1.css +225 -0
- data/assets/images/add.png +0 -0
- data/assets/images/add.svg +1 -0
- data/assets/images/bulb.png +0 -0
- data/assets/images/bulb.svg +1 -0
- data/assets/images/convert.png +0 -0
- data/assets/images/convert.svg +9 -0
- data/assets/images/loader.gif +0 -0
- data/assets/js/batch.js +3 -1
- data/assets/js/frame.js +8 -3
- data/assets/js/testing-batch.js +12 -4
- metadata +19 -2
|
@@ -0,0 +1,309 @@
|
|
|
1
|
+
{% assign file = page.fileName %}
|
|
2
|
+
{% assign lang = page.lang %}
|
|
3
|
+
{% assign folder = page.folderName %}
|
|
4
|
+
{% assign downloadData= site.data[folder][lang][file] %}
|
|
5
|
+
<!DOCTYPE html>
|
|
6
|
+
<html lang="{{homeData.htmlLangAtt}}">
|
|
7
|
+
{% include head/index.html %}
|
|
8
|
+
|
|
9
|
+
<body>
|
|
10
|
+
{% include header/index.html %}
|
|
11
|
+
<div class="container">
|
|
12
|
+
{%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
|
|
13
|
+
|
|
14
|
+
<div class="row">
|
|
15
|
+
<div class="col-md-9 mx-auto">
|
|
16
|
+
{%- endif -%}
|
|
17
|
+
<div class="download-section">
|
|
18
|
+
<div class="row">
|
|
19
|
+
<div class="col-md-12 px-0">
|
|
20
|
+
<div class="success-msg-cont mb-0 ">
|
|
21
|
+
<?xml version="1.0" encoding="iso-8859-1"?>
|
|
22
|
+
<div class="success-greeting">
|
|
23
|
+
<svg height='22px' width='22px' version="1.1" id="Layer_1"
|
|
24
|
+
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
25
|
+
x="0px" y="0px" viewBox="0 0 496.158 496.158"
|
|
26
|
+
style="enable-background:new 0 0 496.158 496.158;" xml:space="preserve">
|
|
27
|
+
<path style="fill:#fff;" d="M496.158,248.085c0-137.021-111.07-248.082-248.076-248.082C111.07,0.003,0,111.063,0,248.085
|
|
28
|
+
c0,137.002,111.07,248.07,248.082,248.07C385.088,496.155,496.158,385.087,496.158,248.085z" />
|
|
29
|
+
<path style="fill:#57bd91;" d="M384.673,164.968c-5.84-15.059-17.74-12.682-30.635-10.127c-7.701,1.605-41.953,11.631-96.148,68.777
|
|
30
|
+
c-22.49,23.717-37.326,42.625-47.094,57.045c-5.967-7.326-12.803-15.164-19.982-22.346c-22.078-22.072-46.699-37.23-47.734-37.867
|
|
31
|
+
c-10.332-6.316-23.82-3.066-30.154,7.258c-6.326,10.324-3.086,23.834,7.23,30.174c0.211,0.133,21.354,13.205,39.619,31.475
|
|
32
|
+
c18.627,18.629,35.504,43.822,35.67,44.066c4.109,6.178,11.008,9.783,18.266,9.783c1.246,0,2.504-0.105,3.756-0.322
|
|
33
|
+
c8.566-1.488,15.447-7.893,17.545-16.332c0.053-0.203,8.756-24.256,54.73-72.727c37.029-39.053,61.723-51.465,70.279-54.908
|
|
34
|
+
c0.082-0.014,0.141-0.02,0.252-0.043c-0.041,0.01,0.277-0.137,0.793-0.369c1.469-0.551,2.256-0.762,2.301-0.773
|
|
35
|
+
c-0.422,0.105-0.641,0.131-0.641,0.131l-0.014-0.076c3.959-1.727,11.371-4.916,11.533-4.984
|
|
36
|
+
C385.405,188.218,389.034,176.214,384.673,164.968z" />
|
|
37
|
+
<g>
|
|
38
|
+
</g>
|
|
39
|
+
<g>
|
|
40
|
+
</g>
|
|
41
|
+
<g>
|
|
42
|
+
</g>
|
|
43
|
+
<g>
|
|
44
|
+
</g>
|
|
45
|
+
<g>
|
|
46
|
+
</g>
|
|
47
|
+
<g>
|
|
48
|
+
</g>
|
|
49
|
+
<g>
|
|
50
|
+
</g>
|
|
51
|
+
<g>
|
|
52
|
+
</g>
|
|
53
|
+
<g>
|
|
54
|
+
</g>
|
|
55
|
+
<g>
|
|
56
|
+
</g>
|
|
57
|
+
<g>
|
|
58
|
+
</g>
|
|
59
|
+
<g>
|
|
60
|
+
</g>
|
|
61
|
+
<g>
|
|
62
|
+
</g>
|
|
63
|
+
<g>
|
|
64
|
+
</g>
|
|
65
|
+
<g>
|
|
66
|
+
</g>
|
|
67
|
+
</svg>
|
|
68
|
+
<p class="success-msg"> {{downloadData.successmessage | default: 'Hurray! your
|
|
69
|
+
operation was
|
|
70
|
+
completed'
|
|
71
|
+
}}
|
|
72
|
+
</p>
|
|
73
|
+
</div>
|
|
74
|
+
<button onclick="history.back()"> <i class="fas fa-redo"></i> Try processing another
|
|
75
|
+
file</button>
|
|
76
|
+
</div>
|
|
77
|
+
<div class="try-more-features">
|
|
78
|
+
<h2 class="msg_headings border-bottom-none"> {{downloadData.tryfeatureheading |
|
|
79
|
+
default:
|
|
80
|
+
'You can also
|
|
81
|
+
try
|
|
82
|
+
These features'
|
|
83
|
+
}} </h2>
|
|
84
|
+
<div class="row feature-showcase ">
|
|
85
|
+
{%- if downloadData.recommendedfeatures -%}
|
|
86
|
+
{%- for item in downloadData.recommendedfeatures -%}
|
|
87
|
+
<div class="col-md-6 pb-3">
|
|
88
|
+
|
|
89
|
+
<a class="px-2 feature-showcase-div w-100 d-flex justify-content-between "
|
|
90
|
+
href="{{item.url}}">
|
|
91
|
+
<span><img src="{{item.logo}}" alt="feature-logo" {%- if site.crossorigin
|
|
92
|
+
-%} crossorigin="anonymous" {%- endif -%}> <span class="ml-3 ">
|
|
93
|
+
{{item.name}}</span></span> <span class='d-inline-block ml-auto'><i
|
|
94
|
+
class="fas fa-chevron-right"></i></span> </a>
|
|
95
|
+
</div>
|
|
96
|
+
{%- endfor -%}
|
|
97
|
+
{%- else -%}
|
|
98
|
+
code2
|
|
99
|
+
{%- endif -%}
|
|
100
|
+
|
|
101
|
+
</div>
|
|
102
|
+
</div>
|
|
103
|
+
</div>
|
|
104
|
+
<div class="row w-100 mx-auto">
|
|
105
|
+
<div class="col-12 try-more-features">
|
|
106
|
+
{%- if downloadData.recommendedsitesheading -%}
|
|
107
|
+
<p class="msg_headings">{{downloadData.recommendedsitesheading}}</p>
|
|
108
|
+
{%- else -%}
|
|
109
|
+
<p class="msg_headings">Try our other sites for safe processing of you files ! </p>
|
|
110
|
+
{%- endif -%}
|
|
111
|
+
</div>
|
|
112
|
+
|
|
113
|
+
{%- if downloadData.recommendedsites -%}
|
|
114
|
+
{%- assign recommendedsitesData = downloadData.recommendedsites -%}
|
|
115
|
+
{%- for item in recommendedsitesData -%}
|
|
116
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap ">
|
|
117
|
+
<img loading='lazy' class="website-img" src="{{item.logo}}" alt="{{item.name}} logo" {%-
|
|
118
|
+
if site.crossorigin -%} crossorigin="anonymous" {%- endif -%}> <a target="_blank"
|
|
119
|
+
href="{{item.url}}">{{item.name}}</a>
|
|
120
|
+
</div>
|
|
121
|
+
{%- endfor -%}
|
|
122
|
+
{%- else -%}
|
|
123
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap">
|
|
124
|
+
<img loading='lazy' class="website-img"
|
|
125
|
+
src="https://d33wubrfki0l68.cloudfront.net/0623ca017395ac8b757b16b645ff38a89963b01b/a43c6/assets/logo.svg"
|
|
126
|
+
alt="safepdfkitlogo" {%- if site.crossorigin -%} crossorigin="anonymous" {%- endif
|
|
127
|
+
-%}> <a target="_blank" href="https://safepdfkit.com">Safepdfkit.com</a>
|
|
128
|
+
</div>
|
|
129
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap">
|
|
130
|
+
<img class="website-img" loading='lazy'
|
|
131
|
+
src="https://d33wubrfki0l68.cloudfront.net/796c1a01dae9c2d10224fd72a820156974b26ab1/3b885/assets/images/logo.png"
|
|
132
|
+
alt="Safeaudiokit-logo" {%- if site.crossorigin -%} crossorigin="anonymous" {%-
|
|
133
|
+
endif -%}> <a target="_blank" href="https://safeaudiokit.com">safeaudiokit.com</a>
|
|
134
|
+
</div>
|
|
135
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap">
|
|
136
|
+
<img class="website-img"
|
|
137
|
+
src="https://d33wubrfki0l68.cloudfront.net/ab0207d780c019c54db62b002396bc8c3fddddaf/9abb9/assets/safevideokit.svg"
|
|
138
|
+
alt="Safevideokitlogo" {%- if site.crossorigin -%} crossorigin="anonymous" {%- endif
|
|
139
|
+
-%}> <a target="_blank" href="https://safevideokit.com">safevideokit.com</a>
|
|
140
|
+
</div>
|
|
141
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap ">
|
|
142
|
+
<img loading='lazy' class="website-img"
|
|
143
|
+
src="https://d33wubrfki0l68.cloudfront.net/2e37a1020563aa528471da7425b8e58343e2baf7/a186c/picture.png"
|
|
144
|
+
alt="Safeimagekitlogo" {%- if site.crossorigin -%} crossorigin="anonymous" {%- endif
|
|
145
|
+
-%}> <a target="_blank" href="https://safeimagekit.com/">safeimagekit.com</a>
|
|
146
|
+
</div>
|
|
147
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap">
|
|
148
|
+
<img loading='lazy' class="website-img"
|
|
149
|
+
src="https://d33wubrfki0l68.cloudfront.net/74bf3f3836d56b30d16137169cd4c28bf15494ed/11962/js/pt.png"
|
|
150
|
+
alt="safezipkitlogo" {%- if site.crossorigin -%} crossorigin="anonymous" {%- endif
|
|
151
|
+
-%}> <a target="_blank" href="https://safezipkit.com/">safezipkit.com</a>
|
|
152
|
+
</div>
|
|
153
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap">
|
|
154
|
+
<img loading='lazy' class="website-img"
|
|
155
|
+
src="https://d33wubrfki0l68.cloudfront.net/325cdfad7de6cae4a03aecfadc70b38af754cbd0/d87f9/assets/images/logo.png"
|
|
156
|
+
alt="Safeimageconverter logo" {%- if site.crossorigin -%} crossorigin="anonymous"
|
|
157
|
+
{%- endif -%}> <a target="_blank" href="https://safeaudioconverter.com/">
|
|
158
|
+
safeaudioconverter.com
|
|
159
|
+
|
|
160
|
+
</a>
|
|
161
|
+
</div>
|
|
162
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap">
|
|
163
|
+
<img loading='lazy' class="website-img" src="/assets//images/safevideoconverter.svg"
|
|
164
|
+
alt="safevideoconverter logo" {%- if site.crossorigin -%} crossorigin="anonymous"
|
|
165
|
+
{%- endif -%}> <a target="_blank"
|
|
166
|
+
href="https://safevideoconverter.com/">safevideoconverter.com</a>
|
|
167
|
+
</div>
|
|
168
|
+
<div class="col-md-4 col-sm-6 mb-4 col-lg-3 website-wrap">
|
|
169
|
+
<img loading='lazy' class="website-img"
|
|
170
|
+
src="https://d33wubrfki0l68.cloudfront.net/c8fef6be5192b9fa57b8503c6ad93befa361926d/a66d0/picture.svg"
|
|
171
|
+
alt="safeimageconverter logo" {%- if site.crossorigin -%} crossorigin="anonymous"
|
|
172
|
+
{%- endif -%}> <a target="_blank"
|
|
173
|
+
href="https://safeimageconverter.com/">safeimageconverter</a>
|
|
174
|
+
</div>
|
|
175
|
+
{%- endif -%}
|
|
176
|
+
|
|
177
|
+
</div>
|
|
178
|
+
<div class="col-md-12 download-page-rate-us sites-config py-0">
|
|
179
|
+
<div class="rating-tool" style="border: none;">
|
|
180
|
+
<div class="rating-text">{{downloadData.rateus | default: 'Rate us'}}</div>
|
|
181
|
+
<div class="rating-stars">
|
|
182
|
+
<i class="fas fa-star rating-star"></i><i class="fas fa-star rating-star"></i><i
|
|
183
|
+
class="fas fa-star rating-star"></i><i class="fas fa-star rating-star"></i><i
|
|
184
|
+
class="fas fa-star rating-star"></i>
|
|
185
|
+
</div>
|
|
186
|
+
<div class="rating-value ml-2">
|
|
187
|
+
{%- for item in data -%}
|
|
188
|
+
{%- if item.name ==tool -%}
|
|
189
|
+
{%- assign rating = item.rating -%}
|
|
190
|
+
{%- assign votes = item.votes -%}
|
|
191
|
+
{%- endif -%}
|
|
192
|
+
{%- endfor -%}
|
|
193
|
+
<span class="rating"> <strong id='rating'>0</strong><span>/5</span> </span>
|
|
194
|
+
<span class="total-ratings" id='count'>0 </span>{{downloadData.votes |
|
|
195
|
+
default: 'votes'}}
|
|
196
|
+
</div>
|
|
197
|
+
</div>
|
|
198
|
+
<script>
|
|
199
|
+
const ratingValue = document.getElementById('rating')
|
|
200
|
+
const count = document.getElementById('count')
|
|
201
|
+
const setRating = async (rating) => {
|
|
202
|
+
const name = '{{site.name}}'
|
|
203
|
+
const urlParams = new URLSearchParams(window.location.search)
|
|
204
|
+
let tool = urlParams.get('tool')
|
|
205
|
+
const data = { website: name, feature: tool, rating: rating };
|
|
206
|
+
fetch('https://ratingapi-main.netlify.app/.netlify/functions/api/v1/rating/add', {
|
|
207
|
+
method: 'POST',
|
|
208
|
+
headers: {
|
|
209
|
+
'Content-Type': 'application/json',
|
|
210
|
+
},
|
|
211
|
+
body: JSON.stringify(data),
|
|
212
|
+
})
|
|
213
|
+
.then(response => response.json())
|
|
214
|
+
.then(data => {
|
|
215
|
+
ratingValue.innerText = data.rating
|
|
216
|
+
count.innerText = data.count
|
|
217
|
+
})
|
|
218
|
+
.catch((error) => {
|
|
219
|
+
console.error('Error:', error);
|
|
220
|
+
});
|
|
221
|
+
}
|
|
222
|
+
const urlParams = new URLSearchParams(window.location.search)
|
|
223
|
+
let tool = urlParams.get('tool')
|
|
224
|
+
const fetchRating = async () => {
|
|
225
|
+
|
|
226
|
+
const data = await fetch(`https://ratingapi-main.netlify.app/.netlify/functions/api/v1/${tool}/rating`).then(res => res.json())
|
|
227
|
+
ratingValue.innerText = data.rating
|
|
228
|
+
count.innerText = data.votes
|
|
229
|
+
}
|
|
230
|
+
window.addEventListener('DOMContentLoaded', () => {
|
|
231
|
+
fetchRating()
|
|
232
|
+
});
|
|
233
|
+
const ratingNode = document.getElementsByClassName('rating-star')
|
|
234
|
+
let ratedValue = localStorage.getItem(`${tool}rating`)
|
|
235
|
+
if (ratedValue) {
|
|
236
|
+
Array.from(ratingNode).slice(0, ratedValue).map(item => {
|
|
237
|
+
item.style.color = '#FDD300'
|
|
238
|
+
})
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
Array.from(ratingNode).map(item => item.addEventListener('click', () => {
|
|
242
|
+
const urlParams = new URLSearchParams(window.location.search)
|
|
243
|
+
let tool = urlParams.get('tool')
|
|
244
|
+
if (!localStorage.getItem(`${tool}rating`)) {
|
|
245
|
+
function indexInClass(node) {
|
|
246
|
+
var className = node.className;
|
|
247
|
+
var num = 0;
|
|
248
|
+
for (var i = 0; i < ratingNode.length; i++) {
|
|
249
|
+
if (ratingNode[i] === node) {
|
|
250
|
+
return num;
|
|
251
|
+
}
|
|
252
|
+
num++;
|
|
253
|
+
}
|
|
254
|
+
return -1;
|
|
255
|
+
}
|
|
256
|
+
const index = indexInClass(item)
|
|
257
|
+
Array.from(ratingNode).slice(0, index + 1).map(item => {
|
|
258
|
+
item.style.color = '#FDD300'
|
|
259
|
+
})
|
|
260
|
+
setRating(index + 1)
|
|
261
|
+
localStorage.setItem(`${tool}rating`, index + 1)
|
|
262
|
+
}
|
|
263
|
+
}))
|
|
264
|
+
</script>
|
|
265
|
+
</div>
|
|
266
|
+
<div class="col-12">
|
|
267
|
+
<div class="download-social-share">
|
|
268
|
+
{%- if site.data.blog.share.platforms -%}
|
|
269
|
+
<div class="d-flex align-items-center flex-column justify-content-center" " >
|
|
270
|
+
<p class=" share-heading mb-0 " >
|
|
271
|
+
{%- if downloadData.socialshareheading -%}
|
|
272
|
+
{{downloadData.socialshareheading}}
|
|
273
|
+
{%- else -%}
|
|
274
|
+
we are a free to use platform for safe processing of your files. We need to your support to grow. Help us by sharing us on social media. Thanks !
|
|
275
|
+
{%- endif -%}
|
|
276
|
+
</p>
|
|
277
|
+
<div>
|
|
278
|
+
{% assign url = site.url %}
|
|
279
|
+
{% for share in site.data.blog.share.platforms %}
|
|
280
|
+
{% assign link = share.link | replace: 'URL', url %}
|
|
281
|
+
{{page.title}}
|
|
282
|
+
<a id=" {{share.type}}" href="{{ link }}" data-toggle="tooltip"
|
|
283
|
+
onclick="window.open(this.href, 'pop-up', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;"
|
|
284
|
+
data-placement="top" title="{{ share.type }}" aria-label="{{ share.type }}">
|
|
285
|
+
<i class="fa-fw {{ share.icon }} mb-0 py-3"></i>
|
|
286
|
+
</a>
|
|
287
|
+
{% endfor %}
|
|
288
|
+
</div>
|
|
289
|
+
</ul>
|
|
290
|
+
</ul>
|
|
291
|
+
</div>
|
|
292
|
+
{%- endif -%}</p>
|
|
293
|
+
</div>
|
|
294
|
+
</div>
|
|
295
|
+
|
|
296
|
+
</div>
|
|
297
|
+
</div>
|
|
298
|
+
{%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
|
|
299
|
+
|
|
300
|
+
</div>
|
|
301
|
+
</div>
|
|
302
|
+
</div>
|
|
303
|
+
{%- endif -%}
|
|
304
|
+
{% include footer/index.html %}
|
|
305
|
+
{% include script.html %}
|
|
306
|
+
|
|
307
|
+
</body>
|
|
308
|
+
|
|
309
|
+
</html>
|
data/_layouts/feature.html
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
</div>
|
|
28
28
|
</div>
|
|
29
29
|
{%- endif -%}
|
|
30
|
-
{%- if page.layout != "frame" -%}
|
|
30
|
+
{%- if page.layout != "frame" and page.layout != "photo-effects-home" -%}
|
|
31
31
|
<div class="flex-container pb-3">
|
|
32
32
|
<div class="flex-class py-4 mt-4 mt-md-0 ">
|
|
33
33
|
<div class="d-flex justify-content-center align-items-center"><span class="fHhdVc">
|
data/_layouts/frame.html
CHANGED
|
@@ -12,22 +12,20 @@ layout: feature
|
|
|
12
12
|
<div class="categories-list">
|
|
13
13
|
<div class="accordion" id="accordionExample">
|
|
14
14
|
{%- for item in site.data.photo-categories -%}
|
|
15
|
-
<div class="card">
|
|
15
|
+
<div class="card card-hover">
|
|
16
16
|
<div class="card-header" id="heading-{{forloop.index}}">
|
|
17
|
-
<
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
</button>
|
|
23
|
-
</h3>
|
|
17
|
+
<button class="btn btn-block text-left p-0" type="button" data-toggle="collapse"
|
|
18
|
+
data-target="#collapse-{{forloop.index}}" aria-expanded="true"
|
|
19
|
+
aria-controls="collapse-{{forloop.index}}">
|
|
20
|
+
{{item.category}} <i class="fas fa-angle-down"></i>
|
|
21
|
+
</button>
|
|
24
22
|
</div>
|
|
25
23
|
|
|
26
24
|
<div id="collapse-{{forloop.index}}" class="collapse"
|
|
27
25
|
aria-labelledby="heading-{{forloop.index}}" data-parent="#accordionExample">
|
|
28
26
|
<div class="card-body">
|
|
29
27
|
{%- for i in item.features -%}
|
|
30
|
-
<a href="{{i.link}}">{{i.name}}</a>
|
|
28
|
+
<a href="{{i.link}}">{{i.name}} </a>
|
|
31
29
|
{%- endfor -%}
|
|
32
30
|
</div>
|
|
33
31
|
</div>
|
|
@@ -38,7 +36,7 @@ layout: feature
|
|
|
38
36
|
|
|
39
37
|
</div>
|
|
40
38
|
<div class="col-md-9">
|
|
41
|
-
<div class="row">
|
|
39
|
+
<div class="row" id="upper-panel">
|
|
42
40
|
<div class="col-md-8">
|
|
43
41
|
<div>
|
|
44
42
|
<div>
|
|
@@ -80,23 +78,63 @@ layout: feature
|
|
|
80
78
|
{%- for item in fileData.elements -%}
|
|
81
79
|
{%- if item.type == "image" -%}
|
|
82
80
|
<label for="{{item.id}}">{{item.label}}</label>
|
|
83
|
-
<
|
|
84
|
-
|
|
85
|
-
|
|
81
|
+
<div class="d-flex mb-15">
|
|
82
|
+
<button class="choose-image" type="button" id="{{item.id}}"
|
|
83
|
+
data-index="{{forloop.index}}" onclick="clickInput(this)">Choose
|
|
84
|
+
image</button>
|
|
85
|
+
<button class="cam-image" id="cam-{{forloop.index}}"><i
|
|
86
|
+
class="fas fa-camera"></i></button>
|
|
87
|
+
<img class="small-image-preview" style="display: none;"
|
|
88
|
+
id="image-pre-{{forloop.index}}"></img>
|
|
89
|
+
</div>
|
|
86
90
|
<input class="d-none" id="file-{{forloop.index}}" type="file" onchange="fileOnChange(this)"
|
|
87
91
|
data-index="{{forloop.index}}" accept=".webp,.png,.jpg,.jpeg" required />
|
|
88
92
|
{%- endif -%}
|
|
89
93
|
{%- if item.type == "text" -%}
|
|
90
94
|
<label for="{{item.id}}">{{item.label}}</label>
|
|
91
|
-
<input type="text" id="{{item.id}}">
|
|
95
|
+
<input class="mb-15" type="text" placeholder="Your Text" id="{{item.id}}">
|
|
92
96
|
{%- endif -%}
|
|
93
97
|
{%- endfor -%}
|
|
94
|
-
<div>
|
|
95
|
-
<button type="submit">Go</button>
|
|
98
|
+
<div class="d-flex">
|
|
99
|
+
<button class="submit-btn" type="submit">Go</button>
|
|
96
100
|
</div>
|
|
97
101
|
</form>
|
|
98
102
|
</div>
|
|
99
103
|
</div>
|
|
104
|
+
<div class="row">
|
|
105
|
+
<div id="workspace" data-name="together_forever" style="display: none;">
|
|
106
|
+
<div class="row">
|
|
107
|
+
<div class="col-12 mb-4">
|
|
108
|
+
<div class="d-flex justify-content-between">
|
|
109
|
+
<div class="result-info">
|
|
110
|
+
<a href="{{page.permalink}}" target="_blank">{{page.featureName}}</a>
|
|
111
|
+
<i class="fas fa-chevron-right"></i>
|
|
112
|
+
<div>result</div>
|
|
113
|
+
</div>
|
|
114
|
+
<button id="download-button" style="background-color: {{fileData.color}};"><svg
|
|
115
|
+
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
|
116
|
+
<path
|
|
117
|
+
d="M256 0C114.6 0 0 114.6 0 256c0 141.4 114.6 256 256 256s256-114.6 256-256C512 114.6 397.4 0 256 0zM382.6 302.6l-103.1 103.1C270.7 414.6 260.9 416 256 416c-4.881 0-14.65-1.391-22.65-9.398L129.4 302.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 306.8V128c0-17.69 14.33-32 32-32s32 14.31 32 32v178.8l49.38-49.38c12.5-12.5 32.75-12.5 45.25 0S395.1 290.1 382.6 302.6z" />
|
|
118
|
+
</svg>Download</button>
|
|
119
|
+
</div>
|
|
120
|
+
|
|
121
|
+
</div>
|
|
122
|
+
<div class="col-md-12 mx-auto">
|
|
123
|
+
<div class="select-img-panel">
|
|
124
|
+
<div id="saving-data" style="display: block;">
|
|
125
|
+
<img loading="lazy" src="/assets/images/loader.gif" alt="saving"> <span
|
|
126
|
+
class="ml-2">Saving
|
|
127
|
+
your
|
|
128
|
+
images...</span>
|
|
129
|
+
</div>
|
|
130
|
+
<div id="canvas-panel">
|
|
131
|
+
</div>
|
|
132
|
+
</div>
|
|
133
|
+
</div>
|
|
134
|
+
|
|
135
|
+
</div>
|
|
136
|
+
</div>
|
|
137
|
+
</div>
|
|
100
138
|
|
|
101
139
|
<div class="crop-image-modal-container">
|
|
102
140
|
<div class="row w-100">
|
|
@@ -160,35 +198,7 @@ layout: feature
|
|
|
160
198
|
</div>
|
|
161
199
|
</div>
|
|
162
200
|
</div>
|
|
163
|
-
<div id="workspace" data-name="together_forever" style="display: none;">
|
|
164
|
-
<div class="row">
|
|
165
|
-
<div class="col-md-8 mx-auto">
|
|
166
|
-
<div class="select-img-panel">
|
|
167
|
-
<div id="saving-data" style="display: none;">
|
|
168
|
-
<img loading="lazy" src="/img/save.gif" alt="saving"> <span class="ml-2">Saving your
|
|
169
|
-
images...</span>
|
|
170
|
-
</div>
|
|
171
|
-
<div id="canvas-panel">
|
|
172
|
-
</div>
|
|
173
|
-
</div>
|
|
174
|
-
</div>
|
|
175
|
-
<div class="col-md-4">
|
|
176
|
-
<div class="options-panel">
|
|
177
|
-
<div class="title">
|
|
178
201
|
|
|
179
|
-
</div>
|
|
180
|
-
<div class="download-wrapper">
|
|
181
|
-
<button id="download-button" style="background-color: {{fileData.color}};"><svg
|
|
182
|
-
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
|
183
|
-
<path
|
|
184
|
-
d="M256 0C114.6 0 0 114.6 0 256c0 141.4 114.6 256 256 256s256-114.6 256-256C512 114.6 397.4 0 256 0zM382.6 302.6l-103.1 103.1C270.7 414.6 260.9 416 256 416c-4.881 0-14.65-1.391-22.65-9.398L129.4 302.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 306.8V128c0-17.69 14.33-32 32-32s32 14.31 32 32v178.8l49.38-49.38c12.5-12.5 32.75-12.5 45.25 0S395.1 290.1 382.6 302.6z" />
|
|
185
|
-
</svg>Download</button>
|
|
186
|
-
</div>
|
|
187
|
-
</div>
|
|
188
|
-
|
|
189
|
-
</div>
|
|
190
|
-
</div>
|
|
191
|
-
</div>
|
|
192
202
|
</div>
|
|
193
203
|
</div>
|
|
194
204
|
</div>
|