code.gitea.io/gitea@v1.22.3/web_src/js/utils/color.js (about)

     1  import tinycolor from 'tinycolor2';
     2  
     3  // Returns relative luminance for a SRGB color - https://en.wikipedia.org/wiki/Relative_luminance
     4  // Keep this in sync with modules/util/color.go
     5  function getRelativeLuminance(color) {
     6    const {r, g, b} = tinycolor(color).toRgb();
     7    return (0.2126729 * r + 0.7151522 * g + 0.072175 * b) / 255;
     8  }
     9  
    10  function useLightText(backgroundColor) {
    11    return getRelativeLuminance(backgroundColor) < 0.453;
    12  }
    13  
    14  // Given a background color, returns a black or white foreground color that the highest
    15  // contrast ratio. In the future, the APCA contrast function, or CSS `contrast-color` will be better.
    16  // https://github.com/color-js/color.js/blob/eb7b53f7a13bb716ec8b28c7a56f052cd599acd9/src/contrast/APCA.js#L42
    17  export function contrastColor(backgroundColor) {
    18    return useLightText(backgroundColor) ? '#fff' : '#000';
    19  }
    20  
    21  function resolveColors(obj) {
    22    const styles = window.getComputedStyle(document.documentElement);
    23    const getColor = (name) => styles.getPropertyValue(name).trim();
    24    return Object.fromEntries(Object.entries(obj).map(([key, value]) => [key, getColor(value)]));
    25  }
    26  
    27  export const chartJsColors = resolveColors({
    28    text: '--color-text',
    29    border: '--color-secondary-alpha-60',
    30    commits: '--color-primary-alpha-60',
    31    additions: '--color-green',
    32    deletions: '--color-red',
    33  });