Responsive Multi-Step From using Angular. Any feedback is welcome!!!
Lucas Nahuel Muñoz
@LucasNahuelAll comments
- @ChuchyXSubmitted over 1 year ago@LucasNahuelPosted over 1 year ago
In your code, when you select a plan, it adds up to the total. So if you go to the 2nd step, change it, and then go to the 4th step, the total adds up and now shows the anterior plan price plus the new selected one. Make sure when you select a new plan you clear the total and assign the new value.
Another more general thing, would be better if you componetize the different steps and elements of the form, and having a programatic structure that stores the differents plans/addons info (like an array) instead of hard-coding them over the program.
greetings 👋
Marked as helpful0 - @KmSutulaSubmitted about 2 years ago@LucasNahuelPosted about 2 years ago
Hi! Only noticeable things are how your notification image with "notif-pic" class doesn't stick to the right end side. Also, clicking "mark all as read" doesn't make the notification count 0.
You coul make your "notif-details" class to have "width: 100%" to fix this or since you're using flexbox, i recommend the next structure or something similar to your notification:
<div class="notif-picture-li" style="justify-content: space-between"> <div style="display: flex; flex-direction: row"> //profile-pic and notif-details here </div> <img class="notif-pic"> <div>0 - @Brenda403Submitted about 2 years ago
- I was unsure of how to add the orange dot to indicate unread in addition to the highlighted blue part.
-I had trouble with getting all of the highlighted blue notifications to go white when pressing "mark all read. " Initially, I just changed the querySelector to querySelectorAll but that itself didn't fix the problem.
@LucasNahuelPosted about 2 years agoHi! In order to resolve the dot problem i resorted to make it a <div> with the "display: inline-flex" property inside a <p> (where all the data from the notification is). Hope it helps!
0