RadioButtons: Updates design and no longer full width in panel edit (#23883)

packages/grafana-ui/src/components/Forms/RadioButtonGroup/RadioButton.tsx

@@ -28,13 +28,13 @@ const getRadioButtonStyles = stylesFactory((theme: GrafanaTheme, size: RadioButt
   const c = theme.palette;
   const c = theme.palette;
   const textColor = theme.colors.textSemiWeak;
   const textColor = theme.colors.textSemiWeak;
   const textColorHover = theme.colors.text;
   const textColorHover = theme.colors.text;
-  const textColorActive = theme.isLight ? c.blue77 : c.blue95;
+  const textColorActive = theme.colors.textBlue;
   const borderColor = theme.colors.border2;
   const borderColor = theme.colors.border2;
   const borderColorHover = theme.colors.border3;
   const borderColorHover = theme.colors.border3;
-  const borderColorActive = theme.isLight ? c.blue77 : c.blue95;
+  const borderColorActive = theme.colors.border2;
   const bg = theme.colors.bodyBg;
   const bg = theme.colors.bodyBg;
   const bgDisabled = theme.isLight ? c.gray95 : c.gray15;
   const bgDisabled = theme.isLight ? c.gray95 : c.gray15;
-  const bgActive = theme.isLight ? c.white : c.gray05;
+  const bgActive = theme.colors.bg2;
 
 
   const border = `1px solid ${borderColor}`;
   const border = `1px solid ${borderColor}`;
   const borderActive = `1px solid ${borderColorActive}`;
   const borderActive = `1px solid ${borderColorActive}`;

packages/grafana-ui/src/utils/standardEditors.tsx

@@ -247,7 +247,7 @@ export const getStandardOptionEditors = () => {
     id: 'radio',
     id: 'radio',
     name: 'Radio',
     name: 'Radio',
     description: 'Allows option selection',
     description: 'Allows option selection',
-    editor: props => <RadioButtonGroup {...props} options={props.item.settings?.options} fullWidth />,
+    editor: props => <RadioButtonGroup {...props} options={props.item.settings?.options} />,
   };
   };
 
 
   const unit: StandardEditorsRegistryItem<string> = {
   const unit: StandardEditorsRegistryItem<string> = {