@crimson3d
@roobiwebdev
Submitted
What are you most proud of, and what would you do differently next time?
working with the footer section mean the table
What challenges did you encounter, and how did you overcome them?
working with table and making it similar to design and i did it by using
@crimson3d
Posted
Good job
Marked as helpful
@JokerSent31
Submitted
@crimson3d
Posted
Cool
@praisevictor
Submitted
@crimson3d
Posted
Good job.
@guanjunming
Submitted
@crimson3d
Posted
Cool!
@AcharaChisomSolomon
Submitted
What are you most proud of, and what would you do differently next time?
proud of how I utilized the 'data-' attribute
in CSS =>
#main .daily,
#main .weekly,
#main .monthly {
display: none;
}
#main[data-theme='daily'] .daily,
#main[data-theme='weekly'] .weekly,
#main[data-theme='monthly'] .monthly{
display: flex;
}
in javascript =>
function changeToTheme(btn) {
const btns = [dayBtn, weekBtn, monthBtn];
for (const btn of btns) {
btn.classList.remove('active');
}
btn.classList.add('active');
main.dataset.theme = btn.id;
}
dayBtn.addEventListener('click', () => {
changeToTheme(dayBtn);
});
weekBtn.addEventListener('click', () => {
changeToTheme(weekBtn);
});
monthBtn.addEventListener('click', () => {
changeToTheme(monthBtn);
});
in HTML
${item.timeframes.weekly.current}hrs
Last Week - ${item.timeframes.weekly.previous}hrs
${item.timeframes.daily.current}hrs
Yesterday - ${item.timeframes.daily.previous}hrs
${item.timeframes.monthly.current}hrs
Last Month - ${item.timeframes.monthly.previous}hrs
What challenges did you encounter, and how did you overcome them?
working with the 'data-' attributes was a little confusing, loads of googling helped
What specific areas of your project would you like help with?
None for now. But any feedback is welcome, Thanks!!!!
@crimson3d
Posted
good job whit that code!
@jhypki
Submitted
What are you most proud of, and what would you do differently next time?
Used grid to make responsive deisgn
@crimson3d
Posted
Good job!
@bluepersia
Submitted
@crimson3d
Posted
You can adjust the size on desktop to make it look better.
@crimson3d
Submitted
@crimson3d
Posted
Thank you very much for your feedback!!! Your comments have been very helpful for some of the problems I encountered when making this design, thanks again ❤️
