Mercurial

comparison mrjunejune/src/tools/file_converter/index.html @ 97:3bdfffaad162

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[MrJuneJune] Updated so it is mobile friendly and fixed few font sizes.
author June Park <parkjune1995@gmail.com>
date Fri, 02 Jan 2026 20:21:58 -0800
parents be91a73d801a
children
comparison
equal deleted inserted replaced
96:70401cf61e97 97:3bdfffaad162
33 margin-bottom: 0.5rem; 33 margin-bottom: 0.5rem;
34 font-weight: 600; 34 font-weight: 600;
35 } 35 }
36 36
37 input[type="file"] { 37 input[type="file"] {
38 width: 50%; 38 padding: 0.75rem;
39 padding: 0.5rem;
40 border: 2px dashed #ccc; 39 border: 2px dashed #ccc;
41 border-radius: 4px; 40 border-radius: 4px;
42 background: white; 41 background: white;
42 font-size: 16px;
43 } 43 }
44 44
45 button { 45 button {
46 background: var(--purple); 46 background: var(--purple);
47 font-family: "More Thin", sans-serif; 47 font-family: "More Thin", sans-serif;
50 padding: 0.75rem 1.5rem; 50 padding: 0.75rem 1.5rem;
51 border-radius: 4px; 51 border-radius: 4px;
52 cursor: pointer; 52 cursor: pointer;
53 font-size: 1rem; 53 font-size: 1rem;
54 margin-top: 1rem; 54 margin-top: 1rem;
55 min-height: 44px;
55 } 56 }
56 57
57 button:hover { 58 button:hover {
58 background: var(--orange); 59 background: var(--orange);
59 } 60 }
99 margin-top: 1rem; 100 margin-top: 1rem;
100 } 101 }
101 102
102 .loading.show { 103 .loading.show {
103 display: block; 104 display: block;
105 }
106
107 /* Mobile responsive */
108 @media (max-width: 720px) {
109 .container {
110 padding: 1rem;
111 margin: 1rem auto;
112 }
113
114 .converter-section {
115 padding: 1.5rem 1rem;
116 }
117
118 .converter-section h2 {
119 font-size: 1.5rem;
120 }
121
122 .file-input-wrapper label {
123 font-size: 1rem;
124 }
125
126 button {
127 font-size: 1.1rem;
128 padding: 1rem 1.5rem;
129 }
130
131 .result {
132 padding: 1rem;
133 font-size: 1rem;
134 }
104 } 135 }
105 </style> 136 </style>
106 </head> 137 </head>
107 <body> 138 <body>
108 {{/parts/header.html}} 139 {{/parts/header.html}}