Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • @MelvinAguilar

    Submitted

    Hi there 👋, I’m Melvin and this is my solution for this challenge. 🚀

    🛠️ Built With:

    • TailwindCSS
    • npm - prettier

    Any suggestions on how I can improve and reduce unnecessary code are welcome!

    Thank you. 😊✌️

    Single price grid component (Tailwind CSS)

    #accessibility#tailwind-css

    9

    Azka 480

    @Azkanorouzi

    Posted

    Hello melvin, great solution congrats on finishing that, I am really surprised by how precisely identical your solutions are to the main design, are you using some kinda app or something to help you get the most accurate size in px? if you do please let me know, and keep it up, your work is really impressive, hope you continue this journey and never give up, good luck.

    0
  • Lucas 👾 104,580

    @correlucas

    Submitted

    👾 Hello, Frontend Mentor coding community. This is my solution for the Testimonials Grid Section.

    Feel free to leave any feedback and help me improve my solution or make the code clean!

    🤩 I had a lots of fun building this challenge! Mainly because I understood how to apply a focus effect on the card hovered with only CSS and I've also created my own design changes and personal improvements to the challenge elements.

    SPECIAL THANKS to @elaineleung that show me how to add different animation stats for the cards in the intro.

    I added some features:

    • 🎨 Focus effect on hover.
    • 👨‍🔬 Focus effect on card hovered.
    • 📱 New media query breakpoint for tablet screens
    • 😎 Custom Design.
    • 👾Custom button to switch between FEM UI and CORRELUCAS UI.

    I'll be happy to hear any feedback and advice!

    Azka 480

    @Azkanorouzi

    Posted

    Hello Lucas, I hope you are doing great 😃. focus effect is absolutely gorgeous👀, would you give me a hint on how to do this by myself if you don't mind?

    Marked as helpful

    1
  • Azka 480

    @Azkanorouzi

    Posted

    hello Kaan 😀 your card's text collapses sometimes I guess you should set your card's height on auto so that it can grow depending on content inside of it , if that didn't work play around with padding between the texts a little bit, I hope it helps . nice job btw 👍

    Marked as helpful

    1
  • P
    Fluffy Kas 7,735

    @FluffyKas

    Submitted

    This is my first Junior challenge completed! ^^ I'm more or less satisfied with the final result but I had a hard time coming up with a nice-looking layout for medium screen sizes and I feel like I had to use one or two small "hacks" to make things look like how I wanted. I sometimes felt a bit frustrated and confused about the length of this design, as so far I only did smaller components, but I'm sure this is something I'll get used to ^^

    Pretty please give me your honest feedbacks about it, I'm sure there's plenty to improve on my html, how I organised my code and on these small "hacks". One of these hacks was how I aligned the feature divs in the workflow section. The images are not the same width and height, which made the text look all over the place. The only solution I could came up with is to set a fixed height for the image holder divs, but I'm sure there's a more elegant way to do this (probably it's just my lack of knowledge of flexbox).

    I'd appreciate it if you take time to look at my work. Have a lovely day everyone! :)

    edit: After looking at the report, I'd like to ask, do I need to provide an alt for all images even if I set aria-hidden for them?

    Azka 480

    @Azkanorouzi

    Posted

    it looks pretty nice , good job 🥳

    0
  • P
    Chamu 12,970

    @ChamuMutezva

    Submitted

    I had not used the reset before, and tried to use it this time around. Whilst it cleared the inputs automatically, i still have to figure out its proper use as my variables are not being reset - reset.addEventListener("reset", function())

    • where reset is the reset button. Looks like i need to add the eventlistener on the form rather than the reset button Let me know of any bugs and improvement
    Azka 480

    @Azkanorouzi

    Posted

    hello chamu nice work ! I would be appreciate if you take a look at my solutions and give me your honest advice😊

    1
  • @Halo-last

    Submitted

    I've first tried to make it through Mobile, I had trouble adjusting the margin for the stats of the card for mobile. And for the re-sizeing of the font for dekstop is a bit wrong will work on it.

    Azka 480

    @Azkanorouzi

    Posted

    good job ✌️

    1
  • @BelayAdamu

    Submitted

    My third project on Frontend Mentors. I'm slightly dissatisfied with my solution because I used a different API for tracking IPs than what was suggested by Frontendmentor. This is because the recommended one allows only up to 1000 calls whereas the one I used allows up to 10000 calls a month. But as you will find out results of the this API are somewhat less accurate. Please do provide me suggestions on where I can find alternative APIs for the app. It goes without saying comments on other features of the app are also very welcome. Thank you

    Azka 480

    @Azkanorouzi

    Posted

    well done it is impressive !

    Marked as helpful

    1
  • brediedis 20

    @brediedis

    Submitted

    This is my first challenge, so i have a couple of questions

    • In the style guide file there are defined desktop and mobile resolutions. In that case, does the desktop version of the page has to look good up until that specified mobile resolution or it's just up to me when i switch to mobile or i can also make up my own "tablet" version of the site? Because i think my solution switches to mobile too early.

    • When using SCSS for example, is it advisable to use media queries in each class / selector if the breakpoints are mostly if not all the same?

    Thank you!

    Azka 480

    @Azkanorouzi

    Posted

    hello you can make your tablet version as well .

    0
  • Azka 480

    @Azkanorouzi

    Posted

    hello Amera nice work ! I have some feedbacks that might be helpful though , first you need to use <a> tag for links in footer of your solution and also you should probably use cursor : pointer for buttons .

    and at some points for small screens devices for instance at 250px width and less your icons and images become too small I think this happen because you are using relative units for your icons or images .

    I would be appreciated if you have any opinion or advice for my solutions and happy coding btw.😊

    0
  • Vanza Setia 27,855

    @vanzasetia

    Submitted

    Hello Everyone! 👋

    Newbie challenges are tricky challenges. 😬

    Now for the questions:

    • I used button element for Change and use anchor tags for Proceed Payment and Cancel Order. Do you think it's true or not?
    • For the Order Summary words, do you think it can be a heading or other tag?
    • I tried to use TalkBack on my Android phone and I understood what it has spoken to me. Could you try it using your screen reader? I want to know that you understand what's going on.

    Of course, other comments or any issues that you may find, feel free to write it down.

    Also if you want me to give my feedback on your solution, feel free to give me the link on the community feedback! I will be glad to help you too!

    Thanks!

    Order Summary Component | HTML CSS Sass

    #accessibility#lighthouse#sass/scss#bem

    4

    Azka 480

    @Azkanorouzi

    Posted

    good job ✌️🙌 please take a look at my solution for this challenge and let me know if you have any feedback I would be appreciate 😊 your feedback has been helpful for me last time .

    Marked as helpful

    0
  • asadali209 115

    @asadali209

    Submitted

    Feedbacks are appreciated :) Main problem was adjusting background image which I somehow solved by using background-size: contain. This is the first time I have used this property.

    Azka 480

    @Azkanorouzi

    Posted

    nice job

    0
  • @muhammadshajjar

    Submitted

    Hello, everyone! 👋

    Open to any feedback and recommendations, Would love to hear some feedback or suggestions on improving my code quality. Your suggestions and feedback are highly appreciated.

    Happy Coding :)

    Azka 480

    @Azkanorouzi

    Posted

    hi muhammad congratulation . it looks perfect but in my opinion you should use media query for desktop and big screen devices at about 1100px width . because when width go further than 1100 px image is too big or you can just reduce the width of you image at that point . 😊✌️

    Marked as helpful

    1
  • Azka 480

    @Azkanorouzi

    Posted

    good job it seems quite good ✌️

    1
  • MagWeb 220

    @MagWebDev

    Submitted

    Hey. Please I need a feedback for this challenge. Please check if I'm even going in the right direction. How to get this color on image? I tried to use :after pseudoclass but it didn't work. Will be gratefull for your feedbacks.

    Azka 480

    @Azkanorouzi

    Posted

    hello if you want to add a color overlay to your img you can create an empty div tag and give it a color and decrease opacity and after that you can increase z-index of that div so its going to appear right after the image. good luck and happy coding 😊🙌 remember that div tag must be after img

    Marked as helpful

    0
  • @lancemartija

    Submitted

    Hi again! I would like to present to you my version of this project. I'm pretty sure I got it accurately, though what I'm absolutely sure of is that my Grid game is mediocre! Hahaha. Anyway, check it out and please don't hesitate to leave your opinion about my work.

    I would love to know what you think I should improve with my HTML5 semantics and the way I use Grid so that I'll be able to improve them next time.

    Thank you and keep on coding!

    Azka 480

    @Azkanorouzi

    Posted

    good job mate

    1
  • Azka 480

    @Azkanorouzi

    Posted

    hello 😊 add this line of code to have a better hover effect for buttons(replace them ) : id of your button:hover{ background : transparent; color:white; border:2px solid white; } id of your button{ transition : .5s; } also you should increase button height so its gonna be more similar . good luck mate 🙌

    Marked as helpful

    0
  • @abno-24

    Submitted

    I have build this design using flexbox and grid. It was quiet simple project and I have done my best to make it responsive. Please have a look on it and feel free to give feedback. Please let me how can I improve my CSS Skill. Thank You.

    Azka 480

    @Azkanorouzi

    Posted

    👍💫

    2
  • @naveensing575

    Submitted

    The CSS code is not fully responsive but I enjoyed doing my FIRST task #Front_end_developer_journey

    Azka 480

    @Azkanorouzi

    Posted

    hello my friend if you notice there is a bit difference in background it looks like it does not cover all the image . I had same problem until I find out how to fix it. you can simply use img tag instead of background property and use src to import image to img tag to fix it after that you can create an empty div just after the img tag and give it a color and reduce opacity in order to give it a color overlay and you are good to go . nice work btw

    Marked as helpful

    2
  • Azka 480

    @Azkanorouzi

    Posted

    keep it going that is not bad at all

    Marked as helpful

    1
  • Azka 480

    @Azkanorouzi

    Posted

    majestic ! congratulation

    0
  • Azka 480

    @Azkanorouzi

    Posted

    good work

    Marked as helpful

    0
  • Ahmed Faisal 5,095

    @afrussel

    Submitted

    Learn a lot while working on this challenge, specially the flipping animation part. Make this template like anyone can easilly download this and use for their purpose. Tried my level best to make it like professional template.

    Azka 480

    @Azkanorouzi

    Posted

    Good job mate

    0
  • Azka 480

    @Azkanorouzi

    Posted

    Well done congratulation

    Marked as helpful

    0
  • Azka 480

    @Azkanorouzi

    Posted

    Its pretty similar . Good job mate

    1