diff --git a/src/cards/top-languages-card.js b/src/cards/top-languages-card.js index 9385f4a7ebed3..ab484c39b0feb 100644 --- a/src/cards/top-languages-card.js +++ b/src/cards/top-languages-card.js @@ -21,7 +21,7 @@ const MAXIMUM_LANGS_COUNT = 20; const NORMAL_LAYOUT_DEFAULT_LANGS_COUNT = 5; const COMPACT_LAYOUT_DEFAULT_LANGS_COUNT = 6; -const DONUT_LAYOUT_DEFAULT_LANGS_COUNT = 5; +const DONUT_LAYOUT_DEFAULT_LANGS_COUNT = 3; const PIE_LAYOUT_DEFAULT_LANGS_COUNT = 6; const DONUT_VERTICAL_LAYOUT_DEFAULT_LANGS_COUNT = 6; @@ -243,11 +243,11 @@ const createProgressTextNode = ({ width, color, name, progress, index }) => { const createCompactLangNode = ({ lang, totalSize, hideProgress, index }) => { const percentage = ((lang.size / totalSize) * 100).toFixed(2); const staggerDelay = (index + 3) * 150; - const color = lang.color || "#858585"; + const color = lang.color || "#ffffff"; return ` - + ${lang.name} ${hideProgress ? "" : percentage + "%"} @@ -618,7 +618,13 @@ const renderDonutLayout = (langs, width, totalLanguageSize) => { const radius = centerX - 60; const strokeWidth = 12; - const colors = langs.map((lang) => lang.color); + const langs = [ + { + name: "Python", + size: 100, + color: "#FF007F", + }; + const langsPercents = langs.map((lang) => parseFloat(((lang.size / totalLanguageSize) * 100).toFixed(2)), );