SONAR-21311 - Portfolio overview change main card to MIUI

diff --git a/server/sonar-web/design-system/src/components/DonutChart.tsx b/server/sonar-web/design-system/src/components/DonutChart.tsx
index 883b258c7144bfe3e7fcc13e437f148928057d1d..2c916ebe7cdf44fe332b722079054d4d2d39f800 100644 (file)
--- a/server/sonar-web/design-system/src/components/DonutChart.tsx
+++ b/server/sonar-web/design-system/src/components/DonutChart.tsx
@@ -19,7 +19,7 @@
  */
 import { arc as d3Arc, pie as d3Pie, PieArcDatum } from 'd3-shape';
 
-interface DataPoint {
+export interface DataPoint {
   fill: string;
   value: number;
 }

diff --git a/server/sonar-web/design-system/src/components/index.ts b/server/sonar-web/design-system/src/components/index.ts
index b39467294faddf8386faeef5c95204ac4e1f11c7..d4a4e5a6bb72cd19f9f1f21ba9c9b917ec1a62fc 100644 (file)
--- a/server/sonar-web/design-system/src/components/index.ts
+++ b/server/sonar-web/design-system/src/components/index.ts
@@ -30,6 +30,7 @@ export * from './CodeSnippet';
 export * from './CodeSyntaxHighlighter';
 export * from './ColorsLegend';
 export * from './CoverageIndicator';
+export * from './DonutChart';
 export { ActionsDropdown, Dropdown } from './Dropdown';
 export * from './DropdownMenu';
 export { DropdownToggler } from './DropdownToggler';

diff --git a/server/sonar-web/design-system/src/theme/light.ts b/server/sonar-web/design-system/src/theme/light.ts
index a1c81650c33367a80658ca078d002b0dfbc581a7..32d33e51cfe0fa34b309280b8643564dce309708 100644 (file)
--- a/server/sonar-web/design-system/src/theme/light.ts
+++ b/server/sonar-web/design-system/src/theme/light.ts
@@ -433,6 +433,13 @@ export const lightTheme = {
     'rating.D': COLORS.orange[200],
     'rating.E': COLORS.red[200],
 
+    // rating donut outside circle indicators
+    'ratingDonut.A': COLORS.green[400],
+    'ratingDonut.B': COLORS.yellowGreen[400],
+    'ratingDonut.C': COLORS.yellow[400],
+    'ratingDonut.D': COLORS.orange[400],
+    'ratingDonut.E': COLORS.red[400],
+
     // date picker
     datePicker: COLORS.white,
     datePickerIcon: secondary.default,