minor styling changes to gaps, font-size and width

packages/grafana-ui/src/components/ColorPicker/NamedColorsPalette.tsx

@@ -29,8 +29,8 @@ export const NamedColorsPalette = ({ color, onChange, theme }: NamedColorsPalett
       style={{
         display: 'grid',
         gridTemplateColumns: 'repeat(3, 1fr)',
-        gridRowGap: '32px',
-        gridColumnGap: '32px',
+        gridRowGap: '24px',
+        gridColumnGap: '24px',
       }}
     >
       {swatches}

packages/grafana-ui/src/components/ColorPicker/_ColorPicker.scss

@@ -1,6 +1,7 @@
 $arrowSize: 15px;
 .ColorPicker {
   @extend .popper;
+  font-size: 12px;
 }
 
 .ColorPicker__arrow {
@@ -128,7 +129,7 @@ $arrowSize: 15px;
 }
 
 .ColorPickerPopover__content {
-  width: 360px;
+  width: 336px;
   padding: 24px;
 }