Skip to content
OverviewSolutions
25
Comments
11
Dani Feelshot
@Feelshot

All comments

  • Antony•210
    @AntonatorSubmitted almost 2 years ago

    Any comment is welcome, hope this looks good :D

    HTML & CSS

    1
    Dani Feelshot•370
    @FeelshotPosted almost 2 years ago

    Congratulations on your recent programming exercise fellow DEV! I'm sure you've learned a lot and I'm excited to see your exercise implemented so well. Good job and keep it up!

    1
  • Dani Feelshot•370
    @FeelshotPosted almost 2 years ago

    Congratulations on completing this challenge! I'm sure it was hard to conclude, but the results are incredible. Keeping up with programming can be a challenge, don't forget to read the official documentation to expand the options when solving a problem. If you need help tag me and I will gladly help you.

    0
  • Dani Feelshot•370
    @FeelshotPosted almost 2 years ago

    Hello future dev, I really liked your programming exercise! If you continue doing your exercises in this way, you will undoubtedly be a great programmer very soon. Keep trying and learning, and don't hesitate to ask for help when you need it, tag me and I'll be happy to help you!

    Marked as helpful
    0
  • Kuromika•10
    @kuromikaSubmitted almost 2 years ago

    I struggled a lot when it came to making the image and the rest of the card the same size, and I don't know if my approach of giving them the same size was the correct one.

    I'm also unsure if the way I named my class elements was the best.

    I would appreciate any feedback regarding these matters or any others.

    Product preview card using Flexbox, ::before, picture and srcset

    2
    Dani Feelshot•370
    @FeelshotPosted almost 2 years ago

    Congratulations on your recent programming exercise! I am sure you have worked hard and it has been a great achievement for you. Keeping up with the schedule can be a challenge, but your efforts have paid off. I'm excited to see how you develop as a programmer in the future. Good job!

    1
  • Dani Feelshot•370
    @FeelshotPosted over 2 years ago

    Very good, I loved the results :D

    0
  • Dani Feelshot•370
    @FeelshotPosted almost 3 years ago

    Hello future Dev, I have found some errors that could make your exercise much better. Remember that there are no correct ways to do it, just different ways and the following is my personal recommendation :D

    The margin and padding on your elements is not properly applied, due to how you built the main container. You make a container card to center everything, however this harms the visualization of it. Try to make a card of a fixed size and center it with

    .card { display:flex; flex-direction:column; justify-content:center; Align-items: center; }

    I leave you my exercise so that you can visualize how I arrive at that solution, I hope it will help you.

    Github: https://github.com/Feelshot/practica-02-css Live site: https://practica-02-css.vercel.app/

    Greetings and good trip mate.

    Marked as helpful
    1
  • Anosha Ahmed•9,300
    @anoshaahmedSubmitted almost 3 years ago

    First time using SCSS! I love it! It's so convenient!

    One thing I wish I had done differently is not nesting. I don't know why I was nesting at first... maybe because I was using SCSS for the first time?and it felt cool? But when it came to do media queries, it was so inconvenient to deal with specification etc. I'm gonna make sure not to do that again if I don't need to.

    One problem I kept having, with this solution, was that every time I would save, and my live server would reload, the font-size of random paragraphs would appear larger than before I saved last time. And it was weird because I didn't even touch the font-size of those paragraphs. So, I would stop the live-server and open it again, and the font-size would be back to normal. Then I'd save again, and the font-size would appear larger. Ugh, it was such a hassle.

    But yay I'm happy with the result!

    "clipboard landing page" + sass + flexbox + mobile-first + responsive

    17
    Dani Feelshot•370
    @FeelshotPosted almost 3 years ago

    Nice work! 🙌

    Marked as helpful
    1
  • Dani Feelshot•370
    @FeelshotPosted almost 3 years ago

    Very good work. I would only recommend adjusting the size of the fonts to get a little closer to the final result of the exercise. Also do not forget to use the <h1> and <p> tags for the texts, as well as <figure> for the images. Another recommendation for the pseudo-class: hover would be to use transition: 0.5s; This will help you have a 0.5 second transition and make the animation more fluid. Keep it up, and much success in future jobs.

    1
  • Dani Feelshot•370
    @FeelshotPosted almost 3 years ago

    Very good work. I would only recommend adjusting the background in the mobile version so that it covers the entire screen.

    0
  • Louis Jalenques•50
    @TynxtSubmitted almost 3 years ago

    Hello!

    I would appreciate some feedback on how to make my css grid code less specific to this specific use-case. I am also interested in any advice related to my use of use of the grid layout.

    Thanks!

    Responsive testimonials grid

    2
    Dani Feelshot•370
    @FeelshotPosted almost 3 years ago

    Very good work. Another way to do it could be with measurements of fixed boxes. I leave you my exercise so that you can visualize how I did it. I hope it is useful to you and you can find another way to perform the exercises, keep practicing and success in the programmer's way.

    https://www.frontendmentor.io/solutions/testimonials-grid-section-challenge-hub-with-css-grid-0p8zgkPqJ

    0
  • Dani Feelshot•370
    @FeelshotPosted almost 3 years ago

    Hello, I leave you my repository to be able to appreciate how I made use of the media queries, with this you can make a website responsive. As another comment, try to adjust the measurements of the boxes again, this with width and height, as well as with margin-bottom. Check my code, I hope it can be useful and have a good trip partner: D

    https://github.com/Feelshot/practica-06-css

    0