diff --git a/src/components/desktop_nav/desktop_nav.scss b/src/components/desktop_nav/desktop_nav.scss index 0c094ce28..61d2541ca 100644 --- a/src/components/desktop_nav/desktop_nav.scss +++ b/src/components/desktop_nav/desktop_nav.scss @@ -6,6 +6,10 @@ color: var(--inputTopbarText, var(--inputText)); } + a { + color: var(--link); + } + .inner-nav { display: grid; grid-template-rows: var(--navbar-height); @@ -87,6 +91,10 @@ width: 2em; height: 100%; text-align: center; + + .svg-inline--fa { + color: var(--link); + } } .sitename { diff --git a/src/components/top_bar.style.js b/src/components/top_bar.style.js index daee80afe..20181adc0 100644 --- a/src/components/top_bar.style.js +++ b/src/components/top_bar.style.js @@ -32,18 +32,6 @@ export default { directives: { textColor: '--text' } - }, - { - component: 'Icon', - parent: { - component: 'ButtonUnstyled', - parent: { - component: 'TopBar' - } - }, - directives: { - textColor: '--parent--text' - } } ] } diff --git a/src/services/color_convert/color_convert.js b/src/services/color_convert/color_convert.js index 654f6eaa8..4d49d9cce 100644 --- a/src/services/color_convert/color_convert.js +++ b/src/services/color_convert/color_convert.js @@ -225,7 +225,7 @@ export const getTextColor = function (bg, text, preserve) { const originalColor = convert(text).hex const invertedColor = invertLightness(originalColor).hex - const invertedContrast = getContrastRatio(bg, convert(invertedColor).rgb) + const invertedContrast = getContrastRatio(bg, invertedColor) let workColor if (invertedContrast > originalContrast) { @@ -238,14 +238,13 @@ export const getTextColor = function (bg, text, preserve) { const result = convert(rgb2hex(workColor)).hsl const delta = result.l > 50 ? 1 : -1 const multiplier = 10 - while (contrast < 4.5 && result.l > 0 && result.l < 100) { + while (contrast < 4.5) { result.l += delta * multiplier - contrast = getContrastRatio(bg, convert(result).rgb) - console.log(convert(result).hex, result.l, contrast) + contrast = getContrastRatio(bg, result) } const base = typeof text.a !== 'undefined' ? { a: text.a } : {} - return Object.assign(convert(result).rgb, base) + return Object.assign(base, result) } /** diff --git a/static/palettes/index.json b/static/palettes/index.json index 650d38bb5..782be7a09 100644 --- a/static/palettes/index.json +++ b/static/palettes/index.json @@ -56,7 +56,6 @@ "bg": "#323337", "fg": "#1D1E21", "link": "#18A0E3", - "accent": "#6671E2", "text": "#DBDDE0", "cRed": "#E05053", "cBlue": "#6671E2",