Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
32
Comments
32
Emmanuel Akpan
@heisemmaco-dev

All comments

  • Ega•210
    @kurniantoega
    Submitted over 1 year ago

    Ping single column coming soon page

    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 1 year ago

    Hey Ega, you did i really good job there with design and also with javascript but there is one thing that you didn't get well

    The issue lies in the if statement checking if the email input is empty. Currently, it uses email.value === "" to verify emptiness. However, this condition doesn't account for spaces, so if spaces are entered, it still registers as content in the input.

    To solve this, consider using email.value.trim() for the condition. This adjustment checks if there's no content after trimming spaces. So, the updated code would look like this: if (email.value.trim() === "") { email.style.outlineColor = "red"; errorMsg.textContent = "Email cannot be empty"; } Now, it'll properly identify an empty input, including cases where there might be only spaces. This way, the form validation becomes more accurate.

    I hope your fine this helpful

    Marked as helpful
  • Paulo Guevara•320
    @pguevara135
    Submitted over 1 year ago

    Respnsive landing pae using HGML and CSS Flex

    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 1 year ago

    Hi bro, you did a very good job in your coding challenge, i admire the way you structure and style the web page, but you missed only one thing which is the background color, i can see that you mistakenly use container background color as the main background, that wrong, you can fine the color description in file named style guild, if you fine this comment helpful you can mark it a helpful and follow me, thank

  • MICHAEL•150
    @Generoustechnocrat
    Submitted about 2 years ago

    Responsive Page

    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    wow!! bro you try oo, e no easy abeg, continue your good work and looking forward to see you next project bro

  • Yeifren Palacios•20
    @Yeiifrensk8
    Submitted about 2 years ago

    CSS FLEX - MEDIA QUERIES

    2
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hi Yeiifrensk, Great work right their, I love the responsiveness of the card but on Mobil and desktop but their is one thing you you missed the background color, the background color is not supposed to be with, you can fine the background color on the style guide.

    I hope you fine this helpful

    Marked as helpful
  • Dellenar•160
    @dellenar
    Submitted about 2 years ago

    Fylo-Landing-Page HTML+CSS

    2
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hello there 👋. Congratulations on successfully completing the challenge! 🎉

    I must say you did a wonder job their, main look that the solution it look as if you use css flame works but you did it with pure css nice work their, i really love layout.

    continue the good works bro, no cap, you did a really things their,

    i hope you find this comment more encouraging and helpful

    Marked as helpful
  • ren-dani•40
    @ren-dani
    Submitted about 2 years ago

    Stats preview card component solution using CSS Flexbox

    3
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hello there 👋. Congratulations on successfully completing the challenge! 🎉

    I have other recommendations regarding your code that I believe will be of great interest to you. CSS: I WILL LIKE TO GO STRAIGHT TO THE POINT your images look more of white you can correct this by making the background color of the image div purple and then apply this property to the div: "background-blend-mode: multiple;"

    secondly, your image shrink with the whole card, i took a look that your code an saw that your use the source tag to set you image media quire, that good acually but you have to use only one instead of setting two source code at your picture tag

    I hope you find this helpful 😄 Above all, the solution you submitted is great !

    Marked as helpful
  • Nascimento•390
    @Nacsimento
    Submitted about 2 years ago

    stats-preview-card-component-main

    4
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hello there 👋. Congratulations on successfully completing the challenge! 🎉

    I have other recommendations regarding your code that I believe will be of great interest to you. CSS: I WILL LIKE TO GO STRAIGHT TO THE POINT your images look more of white you can correct this by making the background color of the image div purple and then apply this property to the div:

    "background-blend-mode: multiple;"

    I hope you find this helpful 😄 Above all, the solution you submitted is great !

    Marked as helpful
  • Aakash•10
    @Vorpalv2
    Submitted about 2 years ago

    First Challenge

    2
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hey, Hey, I think the reason why your image is not showing up is because it's not being linked correctly. You have the file path as : /images/image-qr-code It should be: ./images/image-qr-code. The problem is that you didn't add . That is full stop to the from Try it out :)

  • sorin7345•50
    @sorin7345
    Submitted about 2 years ago

    Stats-preview-card-component-using-basic-HTML-and-CSS

    2
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hi sorin7345, Congratulations 👏👏 on completing your project, I like the position your layout. Ok about the purple 💜 color that fade on the pic, you can actually do that by add background color to the tag that wrapped the picture then you add this css property "background-blend-mode: multiple" to that same tag.

    I hope you fine this helpful

  • MICHAEL•150
    @Generoustechnocrat
    Submitted about 2 years ago

    Responsive page using CSS and HTML

    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hi Generoustechnocrat, Congratulations on completing your project, you did very well in the layout but the width you give to you container, is too small because you only set the property to width instead of max-width and you gave the image a width of some number I can't remember, I suggest you set the width of your image to 100% so it will complete cover your items container.

    I hope you fine this useful

    Marked as helpful
  • P
    Samuel K. Ruan•940
    @SamuelKRuan1901
    Submitted about 2 years ago

    Product preview card

    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hi James, Congratulations on completing your project, I see you image is not show because you didn't direct your url to the place where the image can, I should say you should try to abjust that. To ../images/ name of the image, if you are using vs studio the images will pop up when you do that and then you select the image. Secondly you used <b> tag to make your button, I guess that's is the wrong path, use the button tag to do that.

    I hope you find This helpful

    Marked as helpful
  • ERICK WACHUMA•160
    @Erick384
    Submitted about 2 years ago

    NFT-Preview-Card CSS flexbox

    #cube-css#bootstrap
    2
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted about 2 years ago

    Hi Erick384, Congratulations on completing your front mentor project, I love your how you layout but you add height "100%" in your image that why you image doesn't look nice, I will always prefer you don't use height on images and also you didn't use the right font family, you can see that right to use on the style-guild.md on the file provided for you.

    I hope this will be helpful

  • j-0-n-e-z•410
    @j-0-n-e-z
    Submitted over 2 years ago

    Article preview component w/ React and Tailwind

    #react#tailwind-css
    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 2 years ago

    Hi j-0-n-e-z, Congratulations on completing this project, I noticed something, your container is not responsive in Mobil view, I suggest you you should you media quire on that.

    I hope you fine this insight helpful

    Marked as helpful
  • JustMe__Dev•140
    @Olagunju9148
    Submitted over 2 years ago

    Order- Summary-Component

    3
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 2 years ago

    Hi Olagunju, Congratulations on completing your first frontend mentor challenge, you did everything well but you page is not responsive on a mobile device this is because you add min-width in your media quire and you didn't direct your flex to column in your real body

    Marked as helpful
  • Narasimha Naik•100
    @narasimhanaik7013
    Submitted over 2 years ago

    css chat illustration

    #accessibility
    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 2 years ago

    Hi Narasimhanaik, congratulation on completing you project, i love you layout but the left background stuff, you didn't use the right color, use linear-gradient( 40deg, hsl(264, 100%, 61%), hsl(293, 100%, 63%); that's right color to use and you can just copy this one. I hope you find this helpful

    Marked as helpful
  • 𝕍𝕝𝕒𝕕𝕪𝕤𝕝𝕒𝕧 𝕄𝕚𝕤𝕙𝕔𝕙𝕦𝕜•300
    @VladMishchuk
    Submitted over 2 years ago

    ♟Chat app♟

    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 2 years ago

    Hi @VladMishchuk, congratulation on completing you project, i love you layout but the left background stuff, you didn't use the right color, use linear-gradient( 40deg, hsl(264, 100%, 61%), hsl(293, 100%, 63%); that's right color to use and you can just copy this one. I hope you find this helpful

  • LordY1sus•70
    @LordY1sus
    Submitted over 2 years ago

    Responsive Stats preview card component Using CSS Flex-Box & Grid

    1
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 2 years ago

    Hello 👋, Well done on completing the challenge! 🎉

    you did very thing well expect applying opacity to you image to make that effect, use this instend of that, setting the picture tag to {background-blend-mode: multiply} it will have that effect or if you didn't understand, you can reply to this my comment so that pull the issue in your github respository, so you will merge it.

    hope this was helpful

    Marked as helpful
  • rathmanjonathan•30
    @rathmanjonathan
    Submitted over 2 years ago

    QR CODE COMPONENT

    3
    Emmanuel Akpan•790
    @heisemmaco-dev
    Posted over 2 years ago

    Hello 👋, Well done on completing the challenge! 🎉

    I can see that the image you uploaded did show because you did upload the image file to your github respository and you didn't center conter in the middle because you did add min-height: 100vh to your body tag.

    I hope this was helpful

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub