annotate mrjunejune/src/tools/file_converter/index.html @ 216:e82b80b24012 default tip

[MrJuneJune] Make webp translate background job.
author June Park <parkjune1995@gmail.com>
date Sat, 28 Feb 2026 21:04:43 -0800
parents 3bdfffaad162
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
92
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
1 <!DOCTYPE html>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
2 <html lang="en">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
3 <head>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
4 <meta charset="UTF-8">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
6 <title>File Format Converter</title>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
7 {{/parts/base_head.html}}
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
8 <style>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
9 .container {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
10 max-width: 800px;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
11 margin: 2rem auto;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
12 padding: 2rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
13 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
14
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
15 .converter-section {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
16 border-radius: 8px;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
17 border: 2px solid var(--lightgray);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
18 padding: 2rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
19 margin-bottom: 2rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
20 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
21
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
22 .converter-section h2 {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
23 margin-top: 0;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
24 color: var(--black);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
25 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
26
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
27 .file-input-wrapper {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
28 margin: 1rem 0;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
29 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
30
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
31 .file-input-wrapper label {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
32 display: block;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
33 margin-bottom: 0.5rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
34 font-weight: 600;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
35 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
36
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
37 input[type="file"] {
97
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
38 padding: 0.75rem;
92
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
39 border: 2px dashed #ccc;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
40 border-radius: 4px;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
41 background: white;
97
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
42 font-size: 16px;
92
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
43 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
44
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
45 button {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
46 background: var(--purple);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
47 font-family: "More Thin", sans-serif;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
48 color: var(--gray-gradient);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
49 border: none;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
50 padding: 0.75rem 1.5rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
51 border-radius: 4px;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
52 cursor: pointer;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
53 font-size: 1rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
54 margin-top: 1rem;
97
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
55 min-height: 44px;
92
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
56 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
57
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
58 button:hover {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
59 background: var(--orange);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
60 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
61
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
62 button:disabled {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
63 background: var(--gray);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
64 cursor: not-allowed;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
65 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
66
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
67 .result {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
68 margin-top: 1rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
69 padding: 1rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
70 background: white;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
71 border-radius: 4px;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
72 display: none;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
73 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
74
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
75 .result.show {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
76 display: block;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
77 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
78
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
79 .result.success {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
80 border-left: 4px solid var(--blue);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
81 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
82
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
83 .result.error {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
84 border-left: 4px solid var(--red);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
85 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
86
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
87 .download-link {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
88 display: inline-block;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
89 margin-top: 0.5rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
90 color: var(--awesome);
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
91 text-decoration: none;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
92 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
93
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
94 .download-link:hover {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
95 text-decoration: underline;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
96 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
97
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
98 .loading {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
99 display: none;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
100 margin-top: 1rem;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
101 }
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
102
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
103 .loading.show {
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
104 display: block;
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
105 }
97
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
106
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
107 /* Mobile responsive */
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
108 @media (max-width: 720px) {
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
109 .container {
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
110 padding: 1rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
111 margin: 1rem auto;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
112 }
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
113
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
114 .converter-section {
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
115 padding: 1.5rem 1rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
116 }
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
117
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
118 .converter-section h2 {
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
119 font-size: 1.5rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
120 }
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
121
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
122 .file-input-wrapper label {
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
123 font-size: 1rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
124 }
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
125
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
126 button {
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
127 font-size: 1.1rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
128 padding: 1rem 1.5rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
129 }
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
130
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
131 .result {
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
132 padding: 1rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
133 font-size: 1rem;
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
134 }
3bdfffaad162 [MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
June Park <parkjune1995@gmail.com>
parents: 93
diff changeset
135 }
92
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
136 </style>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
137 </head>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
138 <body>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
139 {{/parts/header.html}}
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
140
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
141 <div class="container">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
142 <h1>File Format Converter</h1>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
143 <p>Convert your images and videos to different formats using FFmpeg</p>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
144
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
145 <div class="converter-section">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
146 <h2>Image to WebP Converter</h2>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
147 <p>Upload an image file (PNG, JPG, GIF, etc.) to convert it to WebP format</p>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
148
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
149 <div class="file-input-wrapper">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
150 <label for="imageInput">Choose an image file:</label>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
151 <input type="file" id="imageInput" accept="image/*">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
152 </div>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
153
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
154 <button id="convertImageBtn" onclick="convertImageToWebP()">Convert to WebP</button>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
155
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
156 <div class="loading" id="imageLoading">Converting... Please wait.</div>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
157
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
158 <div class="result" id="imageResult">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
159 <p id="imageMessage"></p>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
160 <a id="imageDownload" class="download-link" style="display: none;">Download WebP Image</a>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
161 </div>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
162 </div>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
163
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
164 <div class="converter-section">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
165 <h2>Video to MP4 Converter</h2>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
166 <p>Upload a video file (AVI, MOV, MKV, etc.) to convert it to MP4 format</p>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
167
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
168 <div class="file-input-wrapper">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
169 <label for="videoInput">Choose a video file:</label>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
170 <input type="file" id="videoInput" accept="video/*">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
171 </div>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
172
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
173 <button id="convertVideoBtn" onclick="convertVideoToMP4()">Convert to MP4</button>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
174
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
175 <div class="loading" id="videoLoading">Converting... Please wait.</div>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
176
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
177 <div class="result" id="videoResult">
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
178 <p id="videoMessage"></p>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
179 <a id="videoDownload" class="download-link" style="display: none;">Download MP4 Video</a>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
180 </div>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
181 </div>
93
be91a73d801a [MrJuneJune] Updated my website.
June Park <parkjune1995@gmail.com>
parents: 92
diff changeset
182 {{/parts/footer.html}}
92
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
183 </div>
93
be91a73d801a [MrJuneJune] Updated my website.
June Park <parkjune1995@gmail.com>
parents: 92
diff changeset
184 <script src="/tools/file_converter/index.js"></script>
92
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
185 </body>
655ea0b661fd [Seobeo] Added few endpoints for handling files. [Dowa] Added few functions for random number and generating uuids
June Park <parkjune1995@gmail.com>
parents:
diff changeset
186 </html>