fix(field-icon): do not scale icon when long hint (#878)

Author: montezume

src/components/field-label/field-label.js

@@ -42,12 +42,15 @@ export const FieldLabel = props => {
 
         {props.hint && (
           <Spacings.Inline alignItems="center" scale="xs">
-            {props.hintIcon &&
-              // FIXME: add proper tone when tones are refactored
-              React.cloneElement(props.hintIcon, {
-                size: 'medium',
-                theme: props.hintIcon.props.theme || 'orange',
-              })}
+            {props.hintIcon && (
+              <Spacings.Inline>
+                {React.cloneElement(props.hintIcon, {
+                  // FIXME: add proper tone when tones are refactored
+                  size: 'medium',
+                  theme: props.hintIcon.props.theme || 'orange',
+                })}
+              </Spacings.Inline>
+            )}
             {props.hint && <Text.Detail>{props.hint}</Text.Detail>}
           </Spacings.Inline>
         )}

src/components/field-label/field-label.visualroute.js

@@ -50,5 +50,13 @@ export const component = () => (
         horizontalConstraint="l"
       />
     </Spec>
+    <Spec label="with a very long hint">
+      <FieldLabel
+        title="Hello"
+        hint="Sed vel condimentum lacus. Nam sit amet dui et magna tincidunt faucibus. Praesent gravida tempor semper. Donec et faucibus ante. Maecenas consectetur urna mi."
+        hintIcon={<WarningIcon />}
+        horizontalConstraint="m"
+      />
+    </Spec>
   </Suite>
 );