From ee8ab238ac9d0ca6ed2b35c816cbf155c6eefcf8 Mon Sep 17 00:00:00 2001
From: Sergey Garin <sergikgarin@gmail.com>
Date: Tue, 23 Aug 2022 14:19:46 +0400
Subject: [PATCH] Reduce gap betwel label and labelSuffix (#195)

---
 .changeset/shaggy-apricots-care.md    | 5 +++++
 src/components/forms/FieldWrapper.tsx | 6 ++++--
 2 files changed, 9 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/shaggy-apricots-care.md

diff --git a/.changeset/shaggy-apricots-care.md b/.changeset/shaggy-apricots-care.md
new file mode 100644
index 00000000..fb4ab47b
--- /dev/null
+++ b/.changeset/shaggy-apricots-care.md
@@ -0,0 +1,5 @@
+---
+'@cube-dev/ui-kit': patch
+---
+
+Reduced gap between `label` and `labelSuffix` in `<Field />`
diff --git a/src/components/forms/FieldWrapper.tsx b/src/components/forms/FieldWrapper.tsx
index 257fb087..9156fcde 100644
--- a/src/components/forms/FieldWrapper.tsx
+++ b/src/components/forms/FieldWrapper.tsx
@@ -136,7 +136,7 @@ function FieldWrapper(props: CubeFieldWrapperProps, ref) {
       {...labelProps}
     >
       <Flex placeContent="baseline space-between" width="100%">
-        <Space placeItems="center" gap="1x">
+        <Space placeItems="center" gap="0.25x">
           <div>{label}</div>
 
           {tooltip ? (
@@ -145,7 +145,9 @@ function FieldWrapper(props: CubeFieldWrapperProps, ref) {
               title={tooltip}
               width="initial max-content 40x"
             >
-              <InfoCircleOutlined style={{ color: 'var(--primary-color)' }} />
+              <InfoCircleOutlined
+                style={{ color: 'var(--primary-color)', margin: '0 4px' }}
+              />
             </TooltipProvider>
           ) : null}