add task solution #3591
add task solution #3591
Conversation
eugenia-andropova
commented
Jan 20, 2025
eugenia-andropova
commented
- DEMO LINK
There was a problem hiding this comment.
Thank you for your hard work on this project! 😊 There are a few critical issues that need to be addressed before we can approve the pull request. The speed-up modifier should correctly set the animation duration to 10s for the seconds hand and 600s for the minutes hand, as per the task requirements. Additionally, the BEM modifier should be applied to the stopwatch block, not nested within the elements. Lastly, there's a typo in the class name for the second hand within the speed-up block that needs correction. Please make these changes, and you'll be all set! Keep up the great work! 🚀
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
🔄 Fix the issues, commit the changes, and then re-request my review using the Re-request review button in the Reviewers tab.
src/styles/index.scss
Outdated
| animation-duration: 600s / 6; | ||
| } | ||
|
|
||
| &__seconds-hand { |
There was a problem hiding this comment.
There is a typo in the class name &__seconds-hand. It should be &__second-hand to match the class defined earlier in the file.
There was a problem hiding this comment.
Thank you for your submission! 🎉 While your code is mostly correct, there are a few critical issues that need attention:
-
Speed-Up Modifier: Ensure the
speed-upmodifier is applied directly to thestopwatchblock asstopwatch--speed-up, not nested within elements. This will align with the task requirements. -
Animation Duration: The
speed-upmodifier should set the animation duration to10sfor the seconds hand and600sfor the minutes hand. Currently, the division by 6 is incorrect. -
Class Name Consistency: Correct the typo in the class name for the
speed-upmodifier in the HTML file fromstopwatch--sped-uptostopwatch--speed-up. -
Class Naming for Hands: Ensure the class name for the second hand is
stopwatch__seconds-handto match the task requirements.
These adjustments are crucial for the functionality of your code. Please review the comments and make the necessary changes to improve your solution. Keep up the great work and continue learning from these experiences! 🚀
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
| @@ -17,6 +17,10 @@ | |||
| /> | |||
| </head> | |||
| <body> | |||
| <h1>Stop watch</h1> | |||
| <div class="stopwatch stopwatch--sped-up"> | |||
There was a problem hiding this comment.
The BEM modifier stopwatch--sped-up is incorrectly named. According to the task requirements, it should be stopwatch--speed-up.
| @@ -17,6 +17,10 @@ | |||
| /> | |||
| </head> | |||
| <body> | |||
| <h1>Stop watch</h1> | |||
| <div class="stopwatch stopwatch--sped-up"> | |||
| <div class="stopwatch__second-hand"></div> | |||
There was a problem hiding this comment.
The class name for the second hand should be stopwatch__seconds-hand to match the task requirements.
| &--speed-up { | ||
| &__minutes-hand { | ||
| animation-duration: 600s / 6; | ||
| } | ||
|
|
||
| &__second-hand { | ||
| animation-duration: 10s / 6; | ||
| } | ||
| } |
There was a problem hiding this comment.
The BEM modifier &--speed-up is correctly named here, but it should not be nested within the elements. According to the task requirements, the modifier should be applied directly to the stopwatch block.
| animation: rotate 600s steps(60) infinite; | ||
| } | ||
|
|
||
| &__second-hand { |
There was a problem hiding this comment.
The class name for the second hand should be &__seconds-hand to match the task requirements.
