Explore: UI changes for derived fields (#20557)

packages/grafana-ui/src/components/DataLinks/DataLinkInput.tsx

@@ -124,7 +124,6 @@ export const DataLinkInput: React.FC<DataLinkInputProps> = memo(
           'gf-form-input',
           'gf-form-input',
           css`
           css`
             position: relative;
             position: relative;
-            height: auto;
           `
           `
         )}
         )}
       >
       >

public/app/plugins/datasource/loki/configuration/DerivedField.tsx

@@ -6,6 +6,7 @@ import { DerivedFieldConfig } from '../types';
 const getStyles = stylesFactory(() => ({
 const getStyles = stylesFactory(() => ({
   firstRow: css`
   firstRow: css`
     display: flex;
     display: flex;
+    align-items: baseline;
   `,
   `,
   nameField: css`
   nameField: css`
     flex: 2;
     flex: 2;
@@ -65,6 +66,9 @@ export const DerivedField = (props: Props) => {
             event.preventDefault();
             event.preventDefault();
             onDelete();
             onDelete();
           }}
           }}
+          className={css`
+            margin-left: 8px;
+          `}
         />
         />
       </div>
       </div>