add task solution #3903
add task solution #3903
Conversation
There was a problem hiding this comment.
Great job on implementing the calendar with SCSS and BEM methodology! 🎉 The code meets the task requirements effectively. Just make sure that all SCSS variables are correctly imported to avoid any compilation issues. Keep up the great work! 😊
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
|
|
||
| .calendar { | ||
| box-sizing: border-box; | ||
| width: $field-width; |
There was a problem hiding this comment.
The variable $field-width is used here but is not defined in this file. Ensure it is imported correctly from utils/variables or another file.
| display: flex; | ||
| flex-wrap: wrap; | ||
| gap: 1px; | ||
| padding: $field-pad; |
There was a problem hiding this comment.
The variable $field-pad is used here but is not defined in this file. Ensure it is imported correctly from utils/variables or another file.
| gap: 1px; | ||
| padding: $field-pad; | ||
|
|
||
| @each $number, $day in $week { |
There was a problem hiding this comment.
The variable $week is used here but is not defined in this file. Ensure it is imported correctly from utils/variables or another file.
|
|
||
| @each $number, $day in $week { | ||
| &--start-day-#{$day} > .calendar__day:first-child { | ||
| margin-left: ($number - 1) * ($cell-size + $cell-gap); |
There was a problem hiding this comment.
The variables $cell-size and $cell-gap are used here but are not defined in this file. Ensure they are imported correctly from utils/variables or another file.
|
|
||
| @each $last-day in $possible-month-lengths { | ||
| &--month-length-#{$last-day} { | ||
| @if $last-day < $days { |
There was a problem hiding this comment.
The variable $days is used here but is not defined in this file. Ensure it is imported correctly from utils/variables or another file.
| // } | ||
| // } | ||
|
|
||
| @each $last-day in $possible-month-lengths { |
There was a problem hiding this comment.
The variable $possible-month-lengths is used here but is not defined in this file. Ensure it is imported correctly from utils/variables or another file.
DEMO LINK
TEST REPORT LINK
[ x] Changing 'month-lengh' and 'start-day' modifier in the code element
reflects in changing calendar layout
[ x] Each day has no modifiers, only class (eg. calendar__day)
[ x] All
Typical MistakesfromBEMlesson theory are checked.[ x] Code follows all the Code Style Rules ❗️