fix(mobile): doc property styles (#8760)

fix AF-1582
fix AF-1671

- mobile doc info dialog styles
- added ConfigModal for editing property values in modal, including:
  - workspace properties: text, number, tags
  - db properties: text, number, label, link

packages/frontend/component/src/ui/input/input.tsx

@@ -9,7 +9,7 @@ import type {
 import { forwardRef } from 'react';
 
 import { RowInput } from './row-input';
-import { input, inputWrapper } from './style.css';
+import { input, inputWrapper, mobileInputWrapper } from './style.css';
 
 export type InputProps = {
   disabled?: boolean;
@@ -50,19 +50,23 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(function Input(
 ) {
   return (
     <div
-      className={clsx(inputWrapper, className, {
-        // status
-        disabled: disabled,
-        'no-border': noBorder,
-        // color
-        error: status === 'error',
-        success: status === 'success',
-        warning: status === 'warning',
-        default: status === 'default',
-        // size
-        large: size === 'large',
-        'extra-large': size === 'extraLarge',
-      })}
+      className={clsx(
+        BUILD_CONFIG.isMobileEdition ? mobileInputWrapper : inputWrapper,
+        className,
+        {
+          // status
+          disabled: disabled,
+          'no-border': noBorder,
+          // color
+          error: status === 'error',
+          success: status === 'success',
+          warning: status === 'warning',
+          default: status === 'default',
+          // size
+          large: size === 'large',
+          'extra-large': size === 'extraLarge',
+        }
+      )}
       style={{
         ...style,
       }}

packages/frontend/component/src/ui/input/style.css.ts

@@ -51,6 +51,15 @@ export const inputWrapper = style({
     },
   },
 });
+
+export const mobileInputWrapper = style([
+  inputWrapper,
+  {
+    height: 30,
+    borderRadius: 4,
+  },
+]);
+
 export const input = style({
   height: '100%',
   width: '0',