fix forward percentage width on mobile

components/adv-post-form.js

@@ -66,11 +66,13 @@ export default function AdvPostForm ({ edit }) {
                   <Input
                     name={`forward[${index}].pct`}
                     type='number'
-                    step='1'
+                    step={5}
-                    min='1'
+                    min={1}
-                    max='100'
+                    max={100}
+                    style={{ minWidth: '3.5rem' }}
                     append={<InputGroup.Text className='text-monospace'>%</InputGroup.Text>}
-                    groupClassName='flex-shrink-1 mb-0'
+                    groupClassName='mb-0'
+                    inputGroupClassName='flex-nowrap'
                   />
                 </div>
               )

components/form.js

@@ -219,7 +219,7 @@ function FormGroup ({ className, label, children }) {
 
 function InputInner ({
   prepend, append, hint, showValid, onChange, onBlur, overrideValue,
-  innerRef, noForm, clear, onKeyDown, debounce, ...props
+  innerRef, noForm, clear, onKeyDown, inputGroupClassName, debounce, ...props
 }) {
   const [field, meta, helpers] = noForm ? [{}, {}, {}] : useField(props)
   const formik = noForm ? null : useFormikContext()
@@ -259,7 +259,7 @@ function InputInner ({
 
   return (
     <>
-      <InputGroup hasValidation>
+      <InputGroup hasValidation className={inputGroupClassName}>
         {prepend}
         <BootstrapForm.Control
           onKeyDown={(e) => {