infra
/
etesync
2
0
Fork 0
Code Issues Pull Requests Packages Activity

Event view: change the text colour based on background. 

This is needed to ensure a good enough contrast.

Fixes #85.
master
Tom Hacohen 2020-03-11 20:07:13 +02:00
parent 9e1c7ea8d5
commit 649a7cd281
3 changed files with 25 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -38,6 +38,7 @@
"eject": "react-scripts eject"
},
"devDependencies": {
"@types/color": "^3.0.1",
"@types/jest": "^24.0.4",
"@types/node": "^11.9.3",
"@types/node-rsa": "^1.0.0",

8
src/components/PimItemHeader.tsx
View File

@ -2,15 +2,17 @@
// SPDX-License-Identifier: AGPL-3.0-only
import * as React from 'react';
import Color from 'color';
import { Theme, withTheme } from '@material-ui/core/styles';
export default withTheme((props: {text: string, backgroundColor?: string, children?: any, theme: Theme}) => {
const backgroundColor = props.backgroundColor ?? props.theme.palette.secondary.main;
const foregroundColor = props.theme.palette.getContrastText(Color(backgroundColor).rgb().string());
const style = {
header: {
backgroundColor: (props.backgroundColor !== undefined) ?
props.backgroundColor : props.theme.palette.secondary.main,
color: props.theme.palette.secondary.contrastText,
backgroundColor,
color: foregroundColor,
padding: 15,
},
headerText: {

19
yarn.lock
View File

@ -2030,6 +2030,25 @@
dependencies:
"@babel/types" "^7.3.0"
"@types/color-convert@*":
version "1.9.0"
resolved "https://registry.yarnpkg.com/@types/color-convert/-/color-convert-1.9.0.tgz#bfa8203e41e7c65471e9841d7e306a7cd8b5172d"
integrity sha512-OKGEfULrvSL2VRbkl/gnjjgbbF7ycIlpSsX7Nkab4MOWi5XxmgBYvuiQ7lcCFY5cPDz7MUNaKgxte2VRmtr4Fg==
dependencies:
"@types/color-name" "*"
"@types/color-name@*":
version "1.1.1"
resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0"
integrity sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ==
"@types/color@^3.0.1":
version "3.0.1"
resolved "https://registry.yarnpkg.com/@types/color/-/color-3.0.1.tgz#2900490ed04da8116c5058cd5dba3572d5a25071"
integrity sha512-oeUWVaAwI+xINDUx+3F2vJkl/vVB03VChFF/Gl3iQCdbcakjuoJyMOba+3BXRtnBhxZ7uBYqQBi9EpLnvSoztA==
dependencies:
"@types/color-convert" "*"
"@types/eslint-visitor-keys@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@types/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#1ee30d79544ca84d68d4b3cdb0af4f205663dd2d"