urbit/shrub
1
1
Fork 0
mirror of https://github.com/urbit/shrub.git synced 2024-12-25 21:12:56 +03:00
Code Issues Packages Projects Releases Wiki Activity

clock: differentiate date and time colors

Browse Source
This commit is contained in:
Tyler Brown Cifu Shuster 2020-10-08 08:37:47 -07:00
parent e8e3c08050
commit b7e63fb530
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
pkg/interface/src/views/apps/launch/components/tiles/clock.js
View File

@ -14,18 +14,20 @@ const innerSize = 124; // clock size
// }
// }
let text = '#000000', background = '#ffffff';
let timeTextColor = '#000000', dateTextColor = '#333333', background = '#ffffff';
const dark = window.matchMedia('(prefers-color-scheme: dark)');
if (dark.matches) {
text = '#7f7f7f';
timeTextColor = '#ffffff';
dateTextColor = '#7f7f7f';
background = '#333';
}
function darkColors(dark) {
if (dark.matches) {
text = '#7f7f7f';
timeTextColor = '#ffffff';
dateTextColor = '#7f7f7f';
background = '#ffffff';
}
}
@ -344,10 +346,10 @@ class Clock extends React.Component {
: moment().format('h:mm A');
const dateText = moment().format('MMM Do');
ctx.textAlign = 'center';
ctx.fillStyle = text;
ctx.fillStyle = timeTextColor;
ctx.font = '12px Inter';
ctx.fillText(timeText, ctr, ctr + 6 - 7);
ctx.fillStyle = text;
ctx.fillStyle = dateTextColor;
ctx.font = '12px Inter';
ctx.fillText(dateText, ctr, ctr + 6 + 7);