All solutions

What's the best practices for Selecting of the plans Arcade, Advanced, Pro on page 2? I feel like I may have used a work around to accomplish this.

I found this to be a fun and challenging project. If anyone want's to look over my code and offer ways that it can be improved, that would be greatly appreciated. Thanks!

I have one functionality issue that I could use some help with. If you make a mistake entering the CC number the cursor gets hung up on the space inserted. You can arrow over and then delete the text, but I'd prefer if that didn't happen. I can see this as a potential user issue if this was for production.

I'd be happy to hear any critiques and advice on how I could have improved my code. Thanks in advance,

Anyone have a good explanation on how I can target my .class:nth-child()? Say I have 7 mapped elements with the class named .title. How do I target only number 3 and 7 in CSS? Element:nth-of-type() works well and its straight forward, but I found targeting class:nth-child() to be way more difficult than expected. I read the documentation and I understand that I need to use a formula, but that's about where my understanding ends. I just gave up and I ended up using a work around, which I'm not overly thrilled with.

1. Is it best practice to separate Component styles in their own CSS file? if not, what is the proper way of going about this?

2. I'm not sure if my code is structured properly here. I was practicing passing props and state to components and I think I may have added unnecessary layers of complexity by adding components when it may not have been needed. I'm curious what the textbook code structure would have been for this little app?

Any comments or suggestions are welcome. Thanks!

1. I am unsure of the code in the AgeCalculator component return(). Originally I attempted to create an input component to keep the return() cleaner, but I was having issues getting the component to work with the onChange properties.