0
Students
Calendars are very often used on web pages. They can be implemented in many different ways. You can put this challenge into any course and get completely different kinds of layout. In this challenge, you'll implement a calendar using the most accessible tools possible.
Main calendar styles
- Text color:
#fff - Font size: 16px
- Line height: 1
- Font: Rubik. Font files are in assets folder
- Background color:
#e5e5e5
Wrapper
- Width: 250px
- Paddings: 60 pixels from the top, right and left. 30 pixels from the bottom
- Background color:
#1e1f25 - Corner rounding: 12px
Second level header
- Bottom margin: 30px
- Bold font
- Font size: 16px
Calendar
- Bottom margin: 30px
- Bottom padding: 20px
- Font size: 14px with line height 2
- Bottom border which colored in
#313131
Numbers
- Color:
#ccc, center-aligned - Padding: 0
- Line height: 2.3
- Background color of selected number:
#589c5f
To-do list
- Margins: 5px from the top, 20px from the bottom
- Font size: 14px
- Time color:
#ccc - Time font size: 10px
For full access to the challenge you need a professional subscription.
A professional subscription will give you full access to all Hexlet courses, projects and lifetime access to the theory of lessons learned. You can cancel your subscription at any time.