fix(ui): make csv delay input thin

LN-Zap · Oct 18, 2020 · 8416628 · 8416628
1 parent b4c8487
commit 8416628
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 9 deletions.
diff --git a/renderer/components/Channels/ChannelCreateForm.js b/renderer/components/Channels/ChannelCreateForm.js
@@ -310,14 +310,25 @@ class ChannelCreateForm extends React.Component {
         )}
 
         <Flex alignItems="center" justifyContent="space-between" mt={2}>
-          <Label
-            htmlFor="remoteCsvDelay"
-            tooltip={intl.formatMessage({ ...messages.remote_csv_delay_tooltip })}
-          >
-            <FormattedMessage {...messages.remote_csv_delay_label} />
-          </Label>
-
-          <IntegerInput field="remoteCsvDelay" placeholder="test" width={80} />
+          <Flex>
+            <Span color="gray" fontSize="s" mr={2}>
+              <Padlock />
+            </Span>
+            <Label
+              htmlFor="remoteCsvDelay"
+              tooltip={intl.formatMessage({ ...messages.remote_csv_delay_tooltip })}
+            >
+              <FormattedMessage {...messages.remote_csv_delay_label} />
+            </Label>
+          </Flex>
+
+          <IntegerInput
+            field="remoteCsvDelay"
+            placeholder="auto"
+            textAlign="right"
+            variant="thin"
+            width={80}
+          />
         </Flex>
       </Box>
     )

diff --git a/renderer/components/Form/IntegerInput.js b/renderer/components/Form/IntegerInput.js
@@ -70,7 +70,7 @@ const preventNonNumericOnPaste = e => {
  */
 class IntegerInput extends React.Component {
   render() {
-    return <BasicInput {...this.props} pattern="[0-9]*" placeholder="0" type="number" />
+    return <BasicInput pattern="[0-9]*" placeholder="0" {...this.props} type="number" />
   }
 }