feat: enhance input fields for numeric entry

- Added `inputMode="numeric"` and `pattern="[0-9]*"` attributes to number input fields in WithdrawModalContent, SetModalContent, and ListCreationModalContent components. - These changes improve user experience by ensuring that numeric keyboards are displayed on mobile devices, facilitating easier input of numerical values. Signed-off-by: Innei <tukon479@gmail.com>
RSSNext · Jan 15, 2025 · 00a0764 · 00a0764
1 parent f17446d
commit 00a0764
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/apps/renderer/src/modules/power/my-wallet-section/withdraw.tsx b/apps/renderer/src/modules/power/my-wallet-section/withdraw.tsx
@@ -148,6 +148,8 @@ const WithdrawModalContent = ({ dismiss }: { dismiss: () => void }) => {
                   <Input
                     {...field}
                     type="number"
+                    inputMode="numeric"
+                    pattern="[0-9]*"
                     onChange={(value) => field.onChange(value.target.valueAsNumber)}
                   />
                 </FormControl>

diff --git a/apps/renderer/src/modules/rsshub/set-modal-content.tsx b/apps/renderer/src/modules/rsshub/set-modal-content.tsx
@@ -122,7 +122,14 @@ export function SetModalContent({
                   <FormControl className="!mt-0">
                     <div className="flex items-center gap-10">
                       <div className="space-x-2">
-                        <Input className="w-24" type="number" max={12} {...field} />
+                        <Input
+                          className="w-24"
+                          type="number"
+                          inputMode="numeric"
+                          pattern="[0-9]*"
+                          max={12}
+                          {...field}
+                        />
                         <span className="text-sm text-muted-foreground">
                           {t("rsshub.useModal.month")}
                         </span>

diff --git a/apps/renderer/src/modules/settings/tabs/lists/modals.tsx b/apps/renderer/src/modules/settings/tabs/lists/modals.tsx
@@ -189,6 +189,8 @@ export const ListCreationModalContent = ({ id }: { id?: string }) => {
                   <Input
                     {...field}
                     type="number"
+                    inputMode="numeric"
+                    pattern="[0-9]*"
                     min={0}
                     onChange={(value) => field.onChange(value.target.valueAsNumber)}
                   />