Skip to content
OverviewSolutions
9
Comments
9

Prashant Uniyal

@mod-prashant170 points

Passionate web developer with a knack for crafting clean, creative and functional websites.Transforming ideas into user-friendly digital experiences.

Latest solutions

View more solutions

Latest comments

  • 6alactico•470
    @6alactico
    What are you most proud of, and what would you do differently next time?

    I am most proud of making the newsletter interactive. I am unsure what to do differently next time, but I will continue strengthening my knowledge of HTML, CSS, and JavaScript to make my code more efficient.

    What challenges did you encounter, and how did you overcome them?

    The main challenge I encountered was implementing JavaScript to make the newsletter interactive. I overcame this challenge by understanding the project goals and referencing materials.

    What specific areas of your project would you like help with?

    Any feedback is welcome.

    Newsletter Sign-Up With Success Message

    1
    Prashant Uniyal•170
    @mod-prashant

    I think you have made a perfect copy of the design. But there if there is one thing you could do is adding some JavaScript to make the email user inputs appear inside the success message like this

    for HTML add a class to the bold tag inside your paragraph of success container.

    <b class="userEmail">ash@loremcompany.com</b>.

    for JavaScript make a function to assign input value to the class you made.

    // assign email
function Assign_Email(email){
  const userEmail = document.querySelector('.userEmail');
  userEmail.innerHTML=email;
}

    and call that function when you display success container.

        // If valid, proceed
    const formData = new FormData(e.target); // Form data object
    const data = Object.fromEntries(formData.entries());
    Assign_Email(emailValue);
    newsletter.classList.add('hidden');
    success.classList.remove('hidden');
});
    Marked as helpful
  • Petar Rakocevic•320
    @PetarR21
    What are you most proud of, and what would you do differently next time?

    I learned how to toggle popup on click, in different ways, depending on a screen size.

    Also I learned how to position the popup, and how to create triangle shape using CSS.

    What challenges did you encounter, and how did you overcome them?

    Biggest challenge was to toggle popup on click, and to make it popup differently on mobile screens.

    Also, I spend quite some time figuring out how to make triangle shape using CSS.

    What specific areas of your project would you like help with?

    I would like to improve the code, so it is more robust and clean.

    Also, I would edit a project, in such I way that I will use provided SVG-s for the social icons, not Font Awesome icons.

    Responsive Article Preview Component | Using Flexbox and Media Queries

    1
    Prashant Uniyal•170
    @mod-prashant

    It's Perfect from my Perspective.

    The only advice I can think of is editing the drawer image for desktop

  • Prashant Uniyal•170
    @mod-prashant

    I think for background color you could use "Purple50" give in styleguide.md

  • Prashant Uniyal•170
    @mod-prashant

    I think you can change the Background color for the cards. And I am not a professional, so I don't know for sure but I personaly like making ID or Class instead of this section:nth-child(2).

  • Prashant Uniyal•170
    @mod-prashant

    Hello, I think your code is close to the design, But

    • you could try using css grid intead of flex to center the parent
    • For <h1> Use Font Family mentioned in style-guide.md to make it more accurate to the design
  • Prashant Uniyal•170
    @mod-prashant

    I think to make it more like the design.

    You can add styles to headings And, you can add left padding to lists like

    ul{
    padding-left: 1rem;
}
ul ::marker{
    color: var(--Rose800);
    font-weight: 600;
}
ul li{
    padding-left: 1rem;
}
    Marked as helpful
View more comments