appscms-tools-theme 5.6.6 → 5.6.8
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/feature/.DS_Store +0 -0
- data/_data/feature/en/compress-pdf.json +134 -185
- data/_layouts/appscms-contact.html +340 -115
- data/assets/.DS_Store +0 -0
- data/assets/css/appscms-theme.css +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: ca943fd285f7e627a7bbf888bb5d1326408b3227b827afc5e76c0378ed117462
|
|
4
|
+
data.tar.gz: c78366eaea5ddc9765ee095b7779ec33c1b8a4bd0af102197be83cfaf0be3129
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 1d898241ef6c7ade8d627cdcb6cc0eb26d9cf4a57771b1d4f771796eca5d36b23a40ee2c30be0b40b7cbf8b202d51a8d54fb9a126c2bfd5fe78c7e2b9d188b14
|
|
7
|
+
data.tar.gz: 72bdebdf9135755f9087e272c1b2a20d72931b6184d33b7432b6b5a686a9fc6ac0b45d659f52a92a96cd19bc5d73f68a41fff1b21b091b923a10db7178232290
|
data/_data/.DS_Store
CHANGED
|
Binary file
|
data/_data/feature/.DS_Store
CHANGED
|
Binary file
|
|
@@ -1,245 +1,194 @@
|
|
|
1
1
|
{
|
|
2
2
|
"Language": "English",
|
|
3
|
-
"feature": "compress-pdf",
|
|
4
3
|
"htmlLangAtt": "en",
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"META": "easiest way to set alarm for $variable minutes from now. Choose sound for alarm from multiple options.",
|
|
10
|
-
"keywords": "key1,key2,key3,key4",
|
|
4
|
+
"H1": "Free Video Flipper ",
|
|
5
|
+
"H2": "Flip videos horizontally or vertically in seconds",
|
|
6
|
+
"TITLE": "Flip Video Online - Mirror Videos in Seconds",
|
|
7
|
+
"META": "Correct mirrored videos or create unique visual effects by flipping your videos online. Preview, edit further, and export high-quality videos with ease.\n",
|
|
11
8
|
"LABEL": "DOCX to PDF",
|
|
12
|
-
"nofileupload": true,
|
|
13
|
-
"rate": "Rate this tool",
|
|
14
|
-
"votes": "votes",
|
|
15
9
|
"BREADCRUMB_LABEL": "DOCX TO PDF",
|
|
16
|
-
"color": "#
|
|
10
|
+
"color": "#E8601D",
|
|
17
11
|
"height": "300px",
|
|
18
|
-
"
|
|
19
|
-
"
|
|
12
|
+
"img": "/assets/FeatureIcons_featurePage/flip.svg",
|
|
13
|
+
"imgwidth": "30px",
|
|
14
|
+
"imgheight": "30px",
|
|
20
15
|
"imgalt": "altvalue",
|
|
21
|
-
|
|
22
|
-
"categories": [],
|
|
23
|
-
"primaryKeywords": [],
|
|
24
|
-
"secondaryKeywords": [],
|
|
25
16
|
"TEXTUAL_CONTENT": [
|
|
26
17
|
{
|
|
27
|
-
"priority": 1,
|
|
28
|
-
"logoUrl": "/assets/
|
|
29
|
-
"header": "
|
|
30
|
-
"content": "
|
|
18
|
+
"priority": "1",
|
|
19
|
+
"logoUrl": "/assets/lightbulb.svg",
|
|
20
|
+
"header": "Upload Videos Your Way\n",
|
|
21
|
+
"content": "You can click the Upload Video button to select a video from your device, simply drag and drop your file into the upload area, or import videos directly from Google Drive or Dropbox. These flexible upload methods let you access your videos from wherever they're stored, making it easy to begin editing without unnecessary steps\n"
|
|
31
22
|
},
|
|
32
23
|
{
|
|
33
|
-
"priority": 1,
|
|
34
|
-
"logoUrl": "/assets/
|
|
35
|
-
"header": "
|
|
36
|
-
"content": "
|
|
24
|
+
"priority": "1",
|
|
25
|
+
"logoUrl": "/assets/lightbulb.svg",
|
|
26
|
+
"header": "Flip Videos Horizontally or Vertically\n",
|
|
27
|
+
"content": "Flip your videos in either a horizontal or vertical direction with a single click. Whether you want to mirror the entire frame or reverse the top and bottom orientation, the tool makes it quick and easy to achieve the exact result you need.\n"
|
|
37
28
|
},
|
|
38
29
|
{
|
|
39
|
-
"priority": 1,
|
|
40
|
-
"logoUrl": "/assets/
|
|
41
|
-
"header": "
|
|
42
|
-
"content": "
|
|
30
|
+
"priority": "1",
|
|
31
|
+
"logoUrl": "/assets/lightbulb.svg",
|
|
32
|
+
"header": "Preview Every Change Before Exporting\n",
|
|
33
|
+
"content": "Before downloading your flipped video, preview the changes to ensure everything looks correct. This helps you verify the direction, framing, and overall appearance without repeatedly exporting different versions.\n"
|
|
43
34
|
},
|
|
44
35
|
{
|
|
45
|
-
"priority": 1,
|
|
46
|
-
"logoUrl": "/assets/
|
|
47
|
-
"header": "
|
|
48
|
-
"content": "
|
|
36
|
+
"priority": "1",
|
|
37
|
+
"logoUrl": "/assets/lightbulb.svg",
|
|
38
|
+
"header": "Continue Editing After Flipping\n",
|
|
39
|
+
"content": "Flipping your video doesn't have to be the final step. After changing the orientation, you can continue editing by trimming unnecessary footage, cropping unwanted areas, rotating the video, changing the dimensions, or compressing the file before exporting the finished result.\n"
|
|
49
40
|
},
|
|
50
41
|
{
|
|
51
|
-
"priority": 1,
|
|
52
|
-
"logoUrl": "/assets/
|
|
53
|
-
"header": "
|
|
54
|
-
"content": "
|
|
42
|
+
"priority": "1",
|
|
43
|
+
"logoUrl": "/assets/lightbulb.svg",
|
|
44
|
+
"header": "Browser-Based Video Editing\n",
|
|
45
|
+
"content": "Everything works directly in your web browser without requiring software installation or advanced editing skills. Upload your video, flip it in seconds, preview the changes, and download the finished version from almost any modern device.\n"
|
|
55
46
|
},
|
|
56
47
|
{
|
|
57
|
-
"priority": 1,
|
|
58
|
-
"logoUrl": "/assets/
|
|
59
|
-
"header": "
|
|
60
|
-
"content": "
|
|
48
|
+
"priority": "1",
|
|
49
|
+
"logoUrl": "/assets/lightbulb.svg",
|
|
50
|
+
"header": "Edit Videos Securely Without Registration\n",
|
|
51
|
+
"content": "There's no need to create an account, sign in, or install software before editing your videos. Simply upload your video, flip it in seconds, preview the result, and download the finished file. It's a quick, hassle-free way to edit videos directly from your browser."
|
|
61
52
|
}
|
|
62
53
|
],
|
|
63
54
|
"HOW_TO_CONTENT": {
|
|
64
|
-
"logoImageUrl": "/
|
|
65
|
-
"heading": "How to
|
|
55
|
+
"logoImageUrl": "/public/styles/VideoEditor/media/icons/idea.svg",
|
|
56
|
+
"heading": "How to Flip a Video",
|
|
66
57
|
"steps": [
|
|
67
|
-
"
|
|
68
|
-
"
|
|
69
|
-
"
|
|
70
|
-
"
|
|
58
|
+
"Choose the video you want to flip using the available options.\n",
|
|
59
|
+
"Select whether you want to flip the video horizontally or vertically.\n",
|
|
60
|
+
"You can preview the effect and decide which direction best suits your video.\n",
|
|
61
|
+
"You can make additional edits.\n",
|
|
62
|
+
"Export the flipped video and download it to your device."
|
|
71
63
|
]
|
|
72
64
|
},
|
|
73
65
|
"FAQ": [
|
|
74
66
|
{
|
|
75
|
-
"question":"
|
|
76
|
-
"answer": "
|
|
67
|
+
"question": "Why flip a video?\n",
|
|
68
|
+
"answer": "Sometimes a video appears reversed or doesn't look the way you intended. Flipping a video lets you mirror it horizontally or vertically to correct its appearance or achieve a different visual effect. Whether you're fixing a mirrored selfie, correcting footage from a front-facing camera, or creating a creative mirrored effect, flipping is a quick and effective solution without re-recording the video.\n"
|
|
77
69
|
},
|
|
78
70
|
{
|
|
79
|
-
"question": "
|
|
80
|
-
"answer": "
|
|
71
|
+
"question": "What does flipping a video do?\n",
|
|
72
|
+
"answer": "Flipping a video mirrors the entire frame either horizontally or vertically. Unlike rotating a video, flipping changes the direction of the content, making the left side appear on the right or the top appear at the bottom, depending on the option you choose.\n"
|
|
81
73
|
},
|
|
82
|
-
|
|
83
|
-
"question": "
|
|
84
|
-
"answer": "
|
|
85
|
-
},
|
|
86
|
-
{
|
|
87
|
-
"question": "Can I use this tool for Wordle Solver?",
|
|
88
|
-
"answer": "Visit our <a href=\"https://wordswithletters.org/wordle-solver\" target=\"_blank\" rel=\"noopener noreferrer\">https://wordswithletters.org/wordle-solver</a> for solving 5-letter Wordle."
|
|
89
|
-
},
|
|
90
|
-
{
|
|
91
|
-
"question": "Can I also find words using 3 blanks instead of 2?\n",
|
|
92
|
-
"answer": "Yes! You can use 3 blanks or simply visit <a href=\"<a href=\"https://wordswithletters.org/words-with-these-letters-and-3-blanks\" target=\"_blank\" rel=\"noopener noreferrer\">https://wordswithletters.org/words-with-these-letters-and-3-blanks</a>\" target=\"_blank\" rel=\"noopener noreferrer\"><a href=\"https://wordswithletters.org/words-with-these-letters-and-3-blanks\" target=\"_blank\" rel=\"noopener noreferrer\">https://wordswithletters.org/words-with-these-letters-and-3-blanks</a></a>. \n"
|
|
74
|
+
{
|
|
75
|
+
"question": "What's the difference between flipping and rotating a video?\n",
|
|
76
|
+
"answer": "Rotating changes the viewing angle of a video by turning it 90°, 180°, or 270°. Flipping mirrors the video instead, reversing the image from left to right or top to bottom without changing its angle.\n"
|
|
93
77
|
},
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
"
|
|
97
|
-
"answer": "Yes! You can use 3 blanks or simply visit <a href=\"<a href=\"https://wordswithletters.org/words-with-these-letters-and-3-blanks\" target=\"_blank\" rel=\"noopener noreferrer\">https://wordswithletters.org/words-with-these-letters-and-3-blanks</a>\" target=\"_blank\" rel=\"noopener noreferrer\"><a href=\"https://wordswithletters.org/words-with-these-letters-and-3-blanks\" target=\"_blank\" rel=\"noopener noreferrer\">https://wordswithletters.org/words-with-these-letters-and-3-blanks</a></a>. \n"
|
|
78
|
+
{
|
|
79
|
+
"question": "Will flipping affect my video's quality?\n",
|
|
80
|
+
"answer": "The tool is designed to maintain excellent visual quality while flipping the video. The finished result remains suitable for presentations, social media, websites, and personal use.\n"
|
|
98
81
|
},
|
|
99
82
|
{
|
|
100
|
-
"question": "
|
|
101
|
-
"answer": "
|
|
83
|
+
"question": "My selfie video looks mirrored. Can I fix it?\n",
|
|
84
|
+
"answer": "Yes. Some front-facing cameras record mirrored videos, causing text, signs, and logos to appear reversed. Flipping the video horizontally restores the natural orientation, making it look the way others expect to see it.\n"
|
|
102
85
|
},
|
|
103
86
|
{
|
|
104
|
-
"question": "
|
|
105
|
-
"answer": "
|
|
87
|
+
"question": "The text in my video appears backwards. What should I do?\n",
|
|
88
|
+
"answer": "If text or logos appear reversed, flipping the video horizontally usually corrects the issue. This is especially common with front-camera recordings or mirrored footage.\n"
|
|
106
89
|
},
|
|
107
|
-
|
|
108
|
-
],
|
|
109
|
-
|
|
110
|
-
"jscdns": [
|
|
111
|
-
"<script crossorigin='anonymous' src=\"/assets/js/googledrive.js\"></script>"
|
|
112
|
-
],
|
|
113
|
-
"infographics": [
|
|
114
90
|
{
|
|
115
|
-
"
|
|
116
|
-
"
|
|
117
|
-
"alt": "infographics 1"
|
|
91
|
+
"question": "I accidentally flipped my camera while recording. Can this tool help?\n",
|
|
92
|
+
"answer": "Yes. If your recording appears mirrored or inverted because of camera settings, simply choose the appropriate flip direction to correct the video before downloading.\n"
|
|
118
93
|
},
|
|
119
94
|
{
|
|
120
|
-
"
|
|
121
|
-
"
|
|
122
|
-
"alt": "infographics 2"
|
|
95
|
+
"question": "My video looks correct on my phone but reversed on another device. Why?\n",
|
|
96
|
+
"answer": "Different recording apps and devices may handle front-camera videos differently. If the video appears mirrored when viewed elsewhere, flipping it can help provide a more consistent viewing experience.\n"
|
|
123
97
|
},
|
|
124
98
|
{
|
|
125
|
-
"
|
|
126
|
-
"
|
|
127
|
-
|
|
128
|
-
}
|
|
129
|
-
],
|
|
130
|
-
"posts": [
|
|
131
|
-
{
|
|
132
|
-
"tags": ["ok"],
|
|
133
|
-
"categories": ["Scrabble", "history"],
|
|
134
|
-
"layout": "appscms-post",
|
|
135
|
-
"title": "Everything has beauty, but not everyone can see",
|
|
136
|
-
"image": "/uploads/output-1.png",
|
|
137
|
-
"image2": "/uploads/8-jan.PNG",
|
|
138
|
-
"author": "Balark",
|
|
139
|
-
"comments": true,
|
|
140
|
-
"url": "history-of-company-copy-10",
|
|
141
|
-
"path": "_posts/2021-01-08-history-of-company copy 10.md"
|
|
142
|
-
},
|
|
143
|
-
{
|
|
144
|
-
"tags": ["ok"],
|
|
145
|
-
"categories": ["Scrabble", "history"],
|
|
146
|
-
"layout": "appscms-post",
|
|
147
|
-
"title": "Everything has beauty, but not everyone can see",
|
|
148
|
-
"image": "/uploads/output-1.png",
|
|
149
|
-
"image2": "/uploads/8-jan.PNG",
|
|
150
|
-
"author": "Balark",
|
|
151
|
-
"comments": true,
|
|
152
|
-
"url": "history-of-company-copy-11",
|
|
153
|
-
"path": "_posts/2021-01-08-history-of-company copy 11.md"
|
|
154
|
-
},
|
|
155
|
-
{
|
|
156
|
-
"tags": ["ok"],
|
|
157
|
-
"categories": ["Scrabble", "history"],
|
|
158
|
-
"layout": "appscms-post",
|
|
159
|
-
"title": "Everything has beauty, but not everyone can see",
|
|
160
|
-
"image": "/uploads/output-1.png",
|
|
161
|
-
"image2": "/uploads/8-jan.PNG",
|
|
162
|
-
"author": "Balark",
|
|
163
|
-
"comments": true,
|
|
164
|
-
"url": "history-of-company-copy-12",
|
|
165
|
-
"path": "_posts/2021-01-08-history-of-company copy 12.md"
|
|
166
|
-
},
|
|
167
|
-
{
|
|
168
|
-
"tags": ["ok"],
|
|
169
|
-
"categories": ["Scrabble", "history"],
|
|
170
|
-
"layout": "appscms-post",
|
|
171
|
-
"title": "Everything has beauty, but not everyone can see",
|
|
172
|
-
"image": "/uploads/output-1.png",
|
|
173
|
-
"image2": "/uploads/8-jan.PNG",
|
|
174
|
-
"author": "Balark",
|
|
175
|
-
"comments": true,
|
|
176
|
-
"url": "history-of-company-copy-13",
|
|
177
|
-
"path": "_posts/2021-01-08-history-of-company copy 13.md"
|
|
178
|
-
},
|
|
179
|
-
{
|
|
180
|
-
"tags": ["ok"],
|
|
181
|
-
"categories": ["Scrabble", "history"],
|
|
182
|
-
"layout": "appscms-post",
|
|
183
|
-
"title": "Everything has beauty, but not everyone can see",
|
|
184
|
-
"image": "/uploads/output-1.png",
|
|
185
|
-
"image2": "/uploads/8-jan.PNG",
|
|
186
|
-
"author": "Balark",
|
|
187
|
-
"comments": true,
|
|
188
|
-
"url": "history-of-company-copy-14",
|
|
189
|
-
"path": "_posts/2021-01-08-history-of-company copy 14.md"
|
|
190
|
-
},
|
|
191
|
-
{
|
|
192
|
-
"tags": ["ok"],
|
|
193
|
-
"categories": ["Scrabble", "history"],
|
|
194
|
-
"layout": "appscms-post",
|
|
195
|
-
"title": "Everything has beauty, but not everyone can see",
|
|
196
|
-
"image": "/uploads/output-1.png",
|
|
197
|
-
"image2": "/uploads/8-jan.PNG",
|
|
198
|
-
"author": "Balark",
|
|
199
|
-
"comments": true,
|
|
200
|
-
"url": "history-of-company-copy-15",
|
|
201
|
-
"path": "_posts/2021-01-08-history-of-company copy 15.md"
|
|
202
|
-
}
|
|
203
|
-
],
|
|
204
|
-
"USP_Heading": "USP Heading",
|
|
205
|
-
"USPS": [
|
|
99
|
+
"question": "Why does my selfie video look different after I share it?\n",
|
|
100
|
+
"answer": "Some smartphones display front-camera recordings as mirrored while you're recording, but save or display them differently after sharing. This can make the video appear reversed on other devices or platforms. Flipping the video lets you correct its orientation so viewers see it the way you intended.\n"
|
|
101
|
+
},
|
|
206
102
|
{
|
|
207
|
-
"
|
|
208
|
-
"
|
|
103
|
+
"question": "Can I flip only one part of my video?\n",
|
|
104
|
+
"answer": "No. The flip option applies to the entire video frame from beginning to end. If only a specific section needs to be flipped, you can trim that portion first, flip it separately, and then combine it with the remaining clips using a video editor.\n"
|
|
209
105
|
},
|
|
210
106
|
{
|
|
211
|
-
"
|
|
212
|
-
"
|
|
107
|
+
"question": "Does flipping permanently change my original video?\n",
|
|
108
|
+
"answer": "No. The original video on your device remains unchanged. The tool creates a new flipped version that you can download, allowing you to keep your original recording if you ever need it again.\n"
|
|
213
109
|
},
|
|
214
110
|
{
|
|
215
|
-
"
|
|
216
|
-
"
|
|
111
|
+
"question": "Can I use this tool to create mirror-effect videos?\n",
|
|
112
|
+
"answer": "Yes. Besides correcting mirrored recordings, you can intentionally flip videos to create mirror-style visual effects for creative projects, social media content, marketing videos, or artistic edits.\n"
|
|
217
113
|
},
|
|
218
114
|
{
|
|
219
|
-
"
|
|
220
|
-
"
|
|
115
|
+
"question": "Will flipping change the audio in my video?\n",
|
|
116
|
+
"answer": "No. Flipping only changes the visual orientation of the video. The audio track remains unchanged unless you choose to edit it separately.\n"
|
|
221
117
|
},
|
|
222
118
|
{
|
|
223
|
-
"
|
|
224
|
-
"
|
|
225
|
-
}
|
|
226
|
-
],
|
|
227
|
-
"author": "lakshmi",
|
|
228
|
-
"contributors": [
|
|
119
|
+
"question": "Can I flip videos recorded with any camera?\n",
|
|
120
|
+
"answer": "Yes. Videos recorded using smartphones, tablets, webcams, action cameras, DSLRs, and other digital cameras can be flipped whenever the orientation needs to be corrected or mirrored.\n"
|
|
121
|
+
},
|
|
229
122
|
{
|
|
230
|
-
"
|
|
123
|
+
"question": "Can I flip a video without changing its size or duration?\n",
|
|
124
|
+
"answer": "Yes. Flipping only changes the orientation of the video frame. The video's duration remains the same, and the dimensions are not altered unless you choose to resize or crop the video separately.\n"
|
|
231
125
|
},
|
|
232
126
|
{
|
|
233
|
-
"
|
|
127
|
+
"question": "Is flipping a video the same as reversing a video?\n",
|
|
128
|
+
"answer": "No. These are two different editing functions. Flipping changes the video's visual orientation by mirroring the frame, while reversing plays the video backward from the last frame to the first. If you want both effects, you'll need to use each tool separately."
|
|
234
129
|
},
|
|
235
130
|
{
|
|
236
|
-
"
|
|
131
|
+
"question": "Can I convert my edited video into a looping animation?\n",
|
|
132
|
+
"answer": "Yes. Depending on your project, you can transform your video into a continuous animation using <a class=\"webcms-anchor\" href=\"https://safevideokit.com/loop-video\" target=\"_blank\" rel=\"noopener noreferrer\">Loop Video</a>.\n"
|
|
237
133
|
},
|
|
238
134
|
{
|
|
239
|
-
"
|
|
135
|
+
"question": "Can I create creative effects like reversing video after editing?\n",
|
|
136
|
+
"answer": "Absolutely. If you want a more engaging result, try our <a class=\"webcms-anchor\" href=\"https://safevideokit.com/video-reverse\" target=\"_blank\" rel=\"noopener noreferrer\">Reverse Video</a> to create unique visual effects without using advanced editing software.\n"
|
|
137
|
+
}
|
|
138
|
+
],
|
|
139
|
+
"csscdns": [
|
|
140
|
+
"<link rel=\"stylesheet\" href=\"/public/styles/VideoEditor/style.css\" crossorigin='anonymous' />"
|
|
141
|
+
],
|
|
142
|
+
"jsfilepaths": [
|
|
143
|
+
"/assets/js/googledrive.js",
|
|
144
|
+
"https://unpkg.com/@ffmpeg/ffmpeg@0.12.10/dist/umd/ffmpeg.js",
|
|
145
|
+
"https://unpkg.com/@ffmpeg/util@0.12.1/dist/umd/index.js",
|
|
146
|
+
"/js/enchanced-videoeditor.js"
|
|
147
|
+
],
|
|
148
|
+
"filelang": "en",
|
|
149
|
+
"display_formats": [
|
|
150
|
+
"mp4",
|
|
151
|
+
"mov",
|
|
152
|
+
"ogg",
|
|
153
|
+
"webm"
|
|
154
|
+
],
|
|
155
|
+
"compare_formats": [
|
|
156
|
+
"mp4",
|
|
157
|
+
"mov",
|
|
158
|
+
"ogg",
|
|
159
|
+
"webm"
|
|
160
|
+
],
|
|
161
|
+
"FD_1": "",
|
|
162
|
+
"FD_2": "",
|
|
163
|
+
"infographics": [
|
|
164
|
+
{
|
|
165
|
+
"image": "/uploads/8_6_2026_1786030343529.webp",
|
|
166
|
+
"description": "This infographic explains the comparison of flipping directions: Horizontal vs. Vertical",
|
|
167
|
+
"blobUrl": "blob:https://websitecms.netlify.app/475bcb8c-6583-4cf4-88f5-53d0bf68c469",
|
|
168
|
+
"alt": "Comparison of flipping directions"
|
|
169
|
+
},
|
|
170
|
+
{
|
|
171
|
+
"image": "/uploads/8_6_2026_1786030559985.webp",
|
|
172
|
+
"description": "This infographic presents the main features of Flip Video",
|
|
173
|
+
"blobUrl": "blob:https://websitecms.netlify.app/e60b12c4-2b6f-4861-a142-c6890e7d7993",
|
|
174
|
+
"alt": "Features of Flip Video"
|
|
240
175
|
},
|
|
241
176
|
{
|
|
242
|
-
"
|
|
177
|
+
"image": "/uploads/8_6_2026_1786030623784.webp",
|
|
178
|
+
"description": "This infographic depicts the step-by-step process of flipping a video",
|
|
179
|
+
"blobUrl": "blob:https://websitecms.netlify.app/5ab5483e-9e46-4ef2-a62e-4e39630ed7c8",
|
|
180
|
+
"alt": "How to flip a video"
|
|
243
181
|
}
|
|
244
|
-
]
|
|
245
|
-
|
|
182
|
+
],
|
|
183
|
+
"tags": [],
|
|
184
|
+
"contributors": [
|
|
185
|
+
{
|
|
186
|
+
"name": "RK Shree"
|
|
187
|
+
}
|
|
188
|
+
],
|
|
189
|
+
"categories": [],
|
|
190
|
+
"primaryKeywords": [],
|
|
191
|
+
"secondaryKeywords": [],
|
|
192
|
+
"author": "Lakshmi Badige",
|
|
193
|
+
"updatedFromCms": true
|
|
194
|
+
}
|
|
@@ -12,126 +12,351 @@ assign lang = page.lang %} {% assign contactData = site.data[folder][lang][file]
|
|
|
12
12
|
>
|
|
13
13
|
{%- include appscms/navbars/navbar.html -%} {%- include
|
|
14
14
|
appscms/navbars/toolbar.html -%}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
15
|
+
<!-- Style tags for contact page styling -->
|
|
16
|
+
<style>
|
|
17
|
+
.contact-layout-wrapper {
|
|
18
|
+
background-color: #f4f6f8;
|
|
19
|
+
padding-top: 5rem !important;
|
|
20
|
+
padding-bottom: 5rem !important;
|
|
21
|
+
}
|
|
22
|
+
.contact-container {
|
|
23
|
+
max-width: 1140px;
|
|
24
|
+
margin: 0 auto;
|
|
25
|
+
}
|
|
26
|
+
.contact-title {
|
|
27
|
+
font-size: 3.5rem;
|
|
28
|
+
font-weight: 700;
|
|
29
|
+
color: #212529;
|
|
30
|
+
margin-bottom: 1.5rem;
|
|
31
|
+
}
|
|
32
|
+
.contact-subtitle {
|
|
33
|
+
font-size: 1.3rem;
|
|
34
|
+
line-height: 1.6;
|
|
35
|
+
color: #495057;
|
|
36
|
+
font-weight: 400;
|
|
37
|
+
max-width: 90%;
|
|
38
|
+
}
|
|
39
|
+
.contact-card {
|
|
40
|
+
background: #ffffff;
|
|
41
|
+
border-radius: 12px;
|
|
42
|
+
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
|
|
43
|
+
padding: 2.5rem;
|
|
44
|
+
border: 1px solid #eef1f5;
|
|
45
|
+
}
|
|
46
|
+
.contact-card .form-label {
|
|
47
|
+
font-weight: 600;
|
|
48
|
+
font-size: 0.95rem;
|
|
49
|
+
color: #333333;
|
|
50
|
+
margin-bottom: 0.5rem;
|
|
51
|
+
}
|
|
52
|
+
.contact-input, .contact-textarea {
|
|
53
|
+
background-color: #ffffff;
|
|
54
|
+
border: 1px solid #ced4da;
|
|
55
|
+
border-radius: 6px;
|
|
56
|
+
padding: 0.75rem 1rem;
|
|
57
|
+
font-size: 0.95rem;
|
|
58
|
+
color: #495057;
|
|
59
|
+
width: 100%;
|
|
60
|
+
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
|
61
|
+
}
|
|
62
|
+
.contact-input:focus, .contact-textarea:focus {
|
|
63
|
+
border-color: #3b82f6;
|
|
64
|
+
outline: 0;
|
|
65
|
+
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
|
|
66
|
+
}
|
|
67
|
+
.contact-textarea {
|
|
68
|
+
resize: vertical;
|
|
69
|
+
min-height: 120px;
|
|
70
|
+
}
|
|
71
|
+
.contact-btn {
|
|
72
|
+
background-color: #1B2DE7;
|
|
73
|
+
color: #ffffff;
|
|
74
|
+
border: none;
|
|
75
|
+
border-radius: 6px;
|
|
76
|
+
padding: 0.75rem 2rem;
|
|
77
|
+
font-weight: 600;
|
|
78
|
+
font-size: 1rem;
|
|
79
|
+
transition: background-color 0.2s ease, transform 0.1s ease;
|
|
80
|
+
box-shadow: 0 4px 6px rgba(27, 45, 231, 0.15);
|
|
81
|
+
}
|
|
82
|
+
.contact-btn:hover {
|
|
83
|
+
background-color: #1522b8;
|
|
84
|
+
color: #ffffff;
|
|
85
|
+
box-shadow: 0 6px 12px rgba(27, 45, 231, 0.25);
|
|
86
|
+
}
|
|
87
|
+
.contact-btn:active {
|
|
88
|
+
transform: translateY(1px);
|
|
89
|
+
background-color: #0d1796;
|
|
90
|
+
}
|
|
91
|
+
@media (max-width: 991.98px) {
|
|
92
|
+
.contact-layout-wrapper {
|
|
93
|
+
padding-top: 3rem !important;
|
|
94
|
+
padding-bottom: 3rem !important;
|
|
95
|
+
}
|
|
96
|
+
.contact-title {
|
|
97
|
+
font-size: 2.75rem;
|
|
98
|
+
text-align: center;
|
|
99
|
+
}
|
|
100
|
+
.contact-subtitle {
|
|
101
|
+
font-size: 1.15rem;
|
|
102
|
+
text-align: center;
|
|
103
|
+
max-width: 100%;
|
|
104
|
+
margin-bottom: 2.5rem;
|
|
105
|
+
}
|
|
106
|
+
.contact-card {
|
|
107
|
+
padding: 1.75rem;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
/* Success Modal CSS */
|
|
112
|
+
.modal-overlay {
|
|
113
|
+
position: fixed;
|
|
114
|
+
top: 0;
|
|
115
|
+
left: 0;
|
|
116
|
+
width: 100%;
|
|
117
|
+
height: 100%;
|
|
118
|
+
background-color: rgba(15, 23, 42, 0.4);
|
|
119
|
+
backdrop-filter: blur(8px);
|
|
120
|
+
display: none;
|
|
121
|
+
align-items: center;
|
|
122
|
+
justify-content: center;
|
|
123
|
+
z-index: 9999;
|
|
124
|
+
opacity: 0;
|
|
125
|
+
transition: opacity 0.3s ease;
|
|
126
|
+
}
|
|
127
|
+
.modal-overlay.active {
|
|
128
|
+
opacity: 1;
|
|
129
|
+
}
|
|
130
|
+
.success-card {
|
|
131
|
+
background: #ffffff;
|
|
132
|
+
border-radius: 16px;
|
|
133
|
+
padding: 3rem 2.5rem;
|
|
134
|
+
text-align: center;
|
|
135
|
+
max-width: 420px;
|
|
136
|
+
width: 90%;
|
|
137
|
+
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
|
|
138
|
+
transform: scale(0.9);
|
|
139
|
+
transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
140
|
+
}
|
|
141
|
+
.modal-overlay.active .success-card {
|
|
142
|
+
transform: scale(1);
|
|
143
|
+
}
|
|
144
|
+
.success-icon-container {
|
|
145
|
+
width: 80px;
|
|
146
|
+
height: 80px;
|
|
147
|
+
margin: 0 auto 1.5rem;
|
|
148
|
+
}
|
|
149
|
+
.success-checkmark {
|
|
150
|
+
width: 80px;
|
|
151
|
+
height: 80px;
|
|
152
|
+
border-radius: 50%;
|
|
153
|
+
display: block;
|
|
154
|
+
stroke-width: 2;
|
|
155
|
+
stroke: #10b981;
|
|
156
|
+
stroke-miterlimit: 10;
|
|
157
|
+
box-shadow: inset 0px 0px 0px #10b981;
|
|
158
|
+
animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s forwards;
|
|
159
|
+
}
|
|
160
|
+
.success-checkmark-circle {
|
|
161
|
+
stroke-dasharray: 166;
|
|
162
|
+
stroke-dashoffset: 166;
|
|
163
|
+
stroke-width: 2;
|
|
164
|
+
stroke-miterlimit: 10;
|
|
165
|
+
stroke: #10b981;
|
|
166
|
+
fill: none;
|
|
167
|
+
animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
|
|
168
|
+
}
|
|
169
|
+
.success-checkmark-check {
|
|
170
|
+
transform-origin: 50% 50%;
|
|
171
|
+
stroke-dasharray: 48;
|
|
172
|
+
stroke-dashoffset: 48;
|
|
173
|
+
stroke-width: 3;
|
|
174
|
+
stroke: #ffffff;
|
|
175
|
+
animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
|
|
176
|
+
}
|
|
177
|
+
@keyframes stroke {
|
|
178
|
+
100% {
|
|
179
|
+
stroke-dashoffset: 0;
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
@keyframes scale {
|
|
183
|
+
0%, 100% {
|
|
184
|
+
transform: none;
|
|
185
|
+
}
|
|
186
|
+
50% {
|
|
187
|
+
transform: scale3d(1.1, 1.1, 1);
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
@keyframes fill {
|
|
191
|
+
100% {
|
|
192
|
+
box-shadow: inset 0px 0px 0px 40px #10b981;
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
.success-title {
|
|
196
|
+
font-size: 1.75rem;
|
|
197
|
+
font-weight: 700;
|
|
198
|
+
color: #1e293b;
|
|
199
|
+
margin-bottom: 0.75rem;
|
|
200
|
+
}
|
|
201
|
+
.success-text {
|
|
202
|
+
color: #64748b;
|
|
203
|
+
font-size: 1rem;
|
|
204
|
+
line-height: 1.5;
|
|
205
|
+
margin-bottom: 2rem;
|
|
206
|
+
}
|
|
207
|
+
.success-btn {
|
|
208
|
+
background-color: #1B2DE7;
|
|
209
|
+
color: #ffffff;
|
|
210
|
+
border: none;
|
|
211
|
+
border-radius: 8px;
|
|
212
|
+
padding: 0.75rem 2.5rem;
|
|
213
|
+
font-weight: 600;
|
|
214
|
+
font-size: 1rem;
|
|
215
|
+
cursor: pointer;
|
|
216
|
+
transition: background-color 0.2s ease, transform 0.1s ease;
|
|
217
|
+
width: 100%;
|
|
218
|
+
box-shadow: 0 4px 6px rgba(27, 45, 231, 0.15);
|
|
219
|
+
}
|
|
220
|
+
.success-btn:hover {
|
|
221
|
+
background-color: #1522b8;
|
|
222
|
+
box-shadow: 0 6px 12px rgba(27, 45, 231, 0.25);
|
|
223
|
+
}
|
|
224
|
+
.success-btn:active {
|
|
225
|
+
transform: translateY(1px);
|
|
226
|
+
}
|
|
227
|
+
</style>
|
|
228
|
+
|
|
229
|
+
<div class="contact-layout-wrapper">
|
|
230
|
+
<div class="container contact-container">
|
|
231
|
+
<div class="row align-items-center justify-content-between">
|
|
232
|
+
<!-- Left Side: Title and Subtitle -->
|
|
233
|
+
<div class="col-lg-5 col-md-12 mb-4 mb-lg-0">
|
|
234
|
+
<h1 class="contact-title">Contact</h1>
|
|
235
|
+
<p class="contact-subtitle">
|
|
236
|
+
Contact us to report a problem, clarify any doubts about {{ site.name | default: page.companyName | default: 'SafeImageKit' }}, or just find out more.
|
|
237
|
+
</p>
|
|
238
|
+
</div>
|
|
239
|
+
|
|
240
|
+
<!-- Right Side: Contact Form Card -->
|
|
241
|
+
<div class="col-lg-6 col-md-12">
|
|
242
|
+
<div class="contact-card">
|
|
243
|
+
<form id="contact-form" action="https://script.google.com/macros/s/AKfycbxlPF3hsBtZayt4KTJNge7XDHMmeZBNSvS3PaZpeAhY2LVvcCtHU8pD4i6xon2gYhmP/exec" method="POST" target="hidden_iframe">
|
|
244
|
+
<input type="hidden" name="formType" value="contact" />
|
|
245
|
+
<div class="row">
|
|
246
|
+
<div class="col-md-6 mb-3">
|
|
247
|
+
<label for="contact-name" class="form-label">Your name*</label>
|
|
248
|
+
<input type="text" id="contact-name" name="name" class="contact-input" placeholder="Your name" required />
|
|
249
|
+
</div>
|
|
250
|
+
<div class="col-md-6 mb-3">
|
|
251
|
+
<label for="contact-email" class="form-label">Your email*</label>
|
|
252
|
+
<input type="email" id="contact-email" name="email" class="contact-input" placeholder="Your email" required />
|
|
253
|
+
</div>
|
|
254
|
+
</div>
|
|
255
|
+
<div class="mb-4">
|
|
256
|
+
<label for="contact-help" class="form-label">What do you need help with?*</label>
|
|
257
|
+
<textarea id="contact-help" name="query" class="contact-textarea" rows="5" placeholder="Describe your query..." required></textarea>
|
|
258
|
+
</div>
|
|
259
|
+
<div class="d-flex justify-content-end">
|
|
260
|
+
<button type="submit" class="contact-btn">Reach out</button>
|
|
261
|
+
</div>
|
|
262
|
+
</form>
|
|
127
263
|
</div>
|
|
128
|
-
<div></div>
|
|
129
264
|
</div>
|
|
130
|
-
{%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
|
|
131
265
|
</div>
|
|
132
266
|
</div>
|
|
133
|
-
{%- endif -%}
|
|
134
267
|
</div>
|
|
268
|
+
|
|
269
|
+
<!-- Hidden iframe to submit form asynchronously -->
|
|
270
|
+
<iframe name="hidden_iframe" id="hidden_iframe" style="display:none;"></iframe>
|
|
271
|
+
|
|
272
|
+
<!-- Beautiful Success Popup Modal -->
|
|
273
|
+
<div id="success-modal" class="modal-overlay">
|
|
274
|
+
<div class="success-card">
|
|
275
|
+
<div class="success-icon-container">
|
|
276
|
+
<svg class="success-checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">
|
|
277
|
+
<circle class="success-checkmark-circle" cx="26" cy="26" r="25" fill="none"/>
|
|
278
|
+
<path class="success-checkmark-check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/>
|
|
279
|
+
</svg>
|
|
280
|
+
</div>
|
|
281
|
+
<h3 class="success-title">Thank You!</h3>
|
|
282
|
+
<p class="success-text">Your message has been sent successfully. We will contact you soon.</p>
|
|
283
|
+
<button id="close-success-modal" class="success-btn">Close</button>
|
|
284
|
+
</div>
|
|
285
|
+
</div>
|
|
286
|
+
|
|
287
|
+
<script>
|
|
288
|
+
document.addEventListener("DOMContentLoaded", function () {
|
|
289
|
+
const form = document.getElementById("contact-form");
|
|
290
|
+
const iframe = document.getElementById("hidden_iframe");
|
|
291
|
+
const submitBtn = form.querySelector(".contact-btn");
|
|
292
|
+
const successModal = document.getElementById("success-modal");
|
|
293
|
+
const closeModalBtn = document.getElementById("close-success-modal");
|
|
294
|
+
|
|
295
|
+
let isSubmitted = false;
|
|
296
|
+
|
|
297
|
+
form.addEventListener("submit", function (e) {
|
|
298
|
+
isSubmitted = true;
|
|
299
|
+
|
|
300
|
+
submitBtn.disabled = true;
|
|
301
|
+
submitBtn.textContent = "Sending...";
|
|
302
|
+
|
|
303
|
+
// Append extra context fields for the Google sheet columns
|
|
304
|
+
const domainField = document.createElement("input");
|
|
305
|
+
domainField.type = "hidden";
|
|
306
|
+
domainField.name = "domain";
|
|
307
|
+
domainField.value = window.location.hostname;
|
|
308
|
+
form.appendChild(domainField);
|
|
309
|
+
|
|
310
|
+
const urlField = document.createElement("input");
|
|
311
|
+
urlField.type = "hidden";
|
|
312
|
+
urlField.name = "url";
|
|
313
|
+
urlField.value = window.location.href;
|
|
314
|
+
form.appendChild(urlField);
|
|
315
|
+
|
|
316
|
+
const ratingField = document.createElement("input");
|
|
317
|
+
ratingField.type = "hidden";
|
|
318
|
+
ratingField.name = "rating";
|
|
319
|
+
ratingField.value = "contact-form-submission";
|
|
320
|
+
form.appendChild(ratingField);
|
|
321
|
+
});
|
|
322
|
+
|
|
323
|
+
iframe.addEventListener("load", function () {
|
|
324
|
+
if (isSubmitted) {
|
|
325
|
+
isSubmitted = false;
|
|
326
|
+
|
|
327
|
+
// Reset button
|
|
328
|
+
submitBtn.disabled = false;
|
|
329
|
+
submitBtn.textContent = "Reach out";
|
|
330
|
+
|
|
331
|
+
// Reset form
|
|
332
|
+
form.reset();
|
|
333
|
+
|
|
334
|
+
// Show Success Modal
|
|
335
|
+
successModal.style.display = "flex";
|
|
336
|
+
setTimeout(() => {
|
|
337
|
+
successModal.classList.add("active");
|
|
338
|
+
}, 10);
|
|
339
|
+
}
|
|
340
|
+
});
|
|
341
|
+
|
|
342
|
+
// Close Modal events
|
|
343
|
+
closeModalBtn.addEventListener("click", function () {
|
|
344
|
+
successModal.classList.remove("active");
|
|
345
|
+
setTimeout(() => {
|
|
346
|
+
successModal.style.display = "none";
|
|
347
|
+
}, 300);
|
|
348
|
+
});
|
|
349
|
+
|
|
350
|
+
successModal.addEventListener("click", function (e) {
|
|
351
|
+
if (e.target === successModal) {
|
|
352
|
+
successModal.classList.remove("active");
|
|
353
|
+
setTimeout(() => {
|
|
354
|
+
successModal.style.display = "none";
|
|
355
|
+
}, 300);
|
|
356
|
+
}
|
|
357
|
+
});
|
|
358
|
+
});
|
|
359
|
+
</script>
|
|
135
360
|
{% include appscms/footer/static-footer.html %} {% include script.html %}
|
|
136
361
|
</body>
|
|
137
362
|
</html>
|
data/assets/.DS_Store
CHANGED
|
Binary file
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: appscms-tools-theme
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 5.6.
|
|
4
|
+
version: 5.6.8
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- vivek-appscms
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2026-08-
|
|
11
|
+
date: 2026-08-11 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll
|