Any changes to your widgets could potentially break their functionality, so please review your code thoroughly and test it before adding it to your widget.

This widget resource changes your activity time selector widget's colors.

Before:

After:

You can find the code here

Copy everything in that file.

Now go to your widget resources, under "Company name"-->"Widget resources".
Then create a new widget resource with the resource type as LESS.

Finally, paste the code from the google drive file and save.

Your widget resource should look like this. (The title is optional)

Customize the colors

Feel free to modify the colors of the widget. At the top of the widget resource you can modify the variables beginning with "@". Such as @primaryColor or @secondaryColor.

You can find a color's hex value here

Example

If you want the primary color of your widget to be pink, you simply change the @primaryColor variable from

@primaryColor: #88bbc8;

to

@primaryColor: #ff00b4;


Don't forget to add the widget resource to the desired activity time selector.
This can be done in your Activity Time Selector's settings.

Did this answer your question?