Tier: 1-Beginner
The ChristmasLights application relies on your development talents to create a mesmerizing light display. Your task is to draw seven colored circles in a row and based on a timer change the intensity of each circle. When a circle is brightened it's predecessor returns to its normal intensity.
This simulates the effect of a string of rippling lights, similar to the ones displayed during the Christmas Holidays.
- User can press a button to start and stop the display
- User can change the interval of time controlling the change in intensity
- User can select the color used to fill each circle
- User can specify the intensity value
- User can change the size of any circle in the row
- User can specify the number of rows to be included in the display. From one to seven rows can be chosen
PureCSSChristmasLights Christmas Lights
I'm planning to work in this project 6 hours per week.
| Activity | Hours |
|---|---|
| PM meeting - Mery | 30 min |
| Code Review - Maia | 30 min |
| Planning meeting - Steph | 45 min |
| Hacking + research | 4 hours |
- Animation property
- Keyframes
- pseudo elements (
before|after)