Design comparison
Solution retrospective
I found this challenge to be quite difficult. But I think I did it quite good. Are my css practices and js structure good??
Community feedback
- @elaineleungPosted about 2 years ago
Hi Akash_16, first off, great work with this calculator app; I played around with it for a bit, and things look fairly functional to me. I also use Web Dev Simplified's code as my base, and so I recognize a lot of functions here; still, I think you did a good job in adapting his code, as he used a class in his calculator.
I just got some quick comments for you:
-
I'm viewing this on a laptop, and I can't see the toggler at all unless I make my screen at 60% view. This mainly has to do with you using
height: 100vh
instead ofmin-height: 100vh
, so always try to usemin-height
for centering. I also suggest a bit of margin for the component so that there's enough spacing. -
In the display, the height changes when the current operand becomes empty in the main display. You can try using a min height or even fixed height instead of
height: auto
and see whether that helps. -
For the CSS, things look alright to me! The only suggestion I have is to avoid using id as a selector as sometimes there could be specificity issues that could make it hard to troubleshoot. I also don't think you need to add
body
for the theme selectors (e.g.,body.theme2
) since these are all under the body selector anyway. Try removing and see what happens! -
For the JS, I think the only suggestion I have is not to mix jQuery with vanilla JS. Nothing's broken here, but it would just look cleaner if things are consistent, and plus what you're used jQuery for is fairly basic stuff, so it didn't really make sense to me how you only used jQuery for toggling. Since you're able to rewrite Kyle's code with just plain JS, I think you can learn how to add and remove classes using plain JS as well.
I do think you did a great job over all though, especially in learning something new and troubleshooting, so well done, and keep going π
Marked as helpful1@AkashKrish1609Posted about 2 years ago@elaineleung A big big appreciation from me for your time. I was in complete happiness after 2 days, making the toggle myself by watching various videos, stackOverFlow...blah..blah...and finally I made it. Not so big a achievement but seemed fulfilling to do it with pretty much my own efforts. So I hurried in structuring the calculator so I think that led to the first mistake I suppose. Will rectify it for sure. I set height: auto coz if there is a bigger number in question the div should adjust itself. For the sake of that I thought of making the height: auto. Will use min-height to rectify the problem I definetly need someone to help me with CSS and Javascript coz there are new things to learn everyday even though you think you know the necessary part. Will definetly work on using Id's. The part that I used for toggle part was copy paste from stackOverFlow. Not one I am proud of but majority of 2 days went for those two lines of jquery. To copy or do same as Web dev did in his video for calculator felt like cheating. Not to forget, the jquery part I copied was cheating too but felt okπ. I am still not able to wrap my head over some concepts like (this) in js so I did not want to use it. I only understood a little so used it one or two times. That was the main reason I created my own js code with reference to Kyle's video. The Jquery part is cheatingππ..never mind Thank you so very much for your comments and your time. Really appreciate it and I might as well ask for help from you if you were to share your twitter or linkedin social handle..Appreciate.
1@elaineleungPosted about 2 years ago@AkashKrish1609 Hey Akash, I totally know what you mean about taking code from elsewhere and using it into your projects because I've done the same too, and what's important is that you acknowledge where the source came from, which you've already done (and I also did too in my solution), and so as long as proper credit is given, I really think it's fine if you needed to take parts of someone else's code for your own learning. I think most of us started by copying how others did it and then through much experimentation we learned to write our own versions.
On that note, I've had others take my code and mention me, as well as how my code helped them. That's something I really appreciate, not just being given credit, but that I could help someone π. I also had people copy my entire repo and make it seem like they built it themselves, which of course I do not appreciate.
Anyway, feel free to drop me a message on Twitter (elaineclleung) or you can find me on Slack!
0@AkashKrish1609Posted about 2 years ago@elaineleung Hey elaine.....worked on some of the things you said about the website and updated it see if the toggler is visible now...Thank you and will message you incase of doubts on upcoming projects...Thanks again..
0 -
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord