From 6e0d85c09a4d995c2bddcd58ae4b1155b6b6d726 Mon Sep 17 00:00:00 2001
From: fox <fox@vvfox.com>
Date: Sat, 21 Mar 2020 23:29:12 +0800
Subject: [PATCH] =?UTF-8?q?for=20small=20screen=20mobile=F0=9F=92=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../website/components/tool/TimeConverter.tsx | 33 ++++++++++++++-----
 1 file changed, 25 insertions(+), 8 deletions(-)

diff --git a/packages/website/components/tool/TimeConverter.tsx b/packages/website/components/tool/TimeConverter.tsx
index 4476dfd..bb3eaa3 100644
--- a/packages/website/components/tool/TimeConverter.tsx
+++ b/packages/website/components/tool/TimeConverter.tsx
@@ -16,6 +16,9 @@ import {
   Select,
   MenuItem,
   Hidden,
+  InputAdornment,
+  FormControl,
+  Input,
 } from '@material-ui/core';
 import BigNumber from 'bignumber.js';
 import { TranslationKey, InlineLocale } from '~/src/translations/types';
@@ -251,18 +254,32 @@ export const TimeConterter: React.FC = () => {
       </Box>
       <Box pt={2} pb={16} justifyContent="center" alignItems="center" textAlign="center">
         <form>
-          <Grid container spacing={4} justify="center">
+          <Grid container spacing={1} justify="center">
             {data.map((e, i) => {
               const [k, v, h] = e;
               return (
                 <Grid key={i} item xs={12} md={6}>
-                  <Box px={16}>
-                    <TextField label={t(k)} value={v} onChange={h}></TextField>
-                    {v && (
-                      <Button startIcon={<FileCopyIcon />} onClick={e => copyText(k, v)}>
-                        {t('copy')}
-                      </Button>
-                    )}
+                  <Box>
+                    <FormControl>
+                      <InputLabel htmlFor={k}>{t(k)}</InputLabel>
+                      <Input
+                        id={k}
+                        value={v}
+                        onChange={h}
+                        fullWidth
+                        type="number"
+                        multiline
+                        endAdornment={
+                          <InputAdornment position="end">
+                            {v && (
+                              <Button startIcon={<FileCopyIcon />} onClick={e => copyText(k, v)}>
+                                {t('copy')}
+                              </Button>
+                            )}
+                          </InputAdornment>
+                        }
+                      ></Input>
+                    </FormControl>
                   </Box>
                 </Grid>
               );