SunnyFGC

Latest comments

• 

  Rodel Advincula•120

  @brodel10Submitted 3 months ago

  

  Responsive testimonials grid layout using Grid and Flexbox

  1

  40
  

  SunnyFGC•130

  @njmoon21Posted 3 months ago

  Great job on the grid layout. The testimonies that are taller/wider relative to the other testimonies are in their correct positions. Furthermore, you were successful in making Kira's testimony the last one in mobile view when she visually appears to be the third one on desktop view.

  One slightly significant thing I would change about the grid layout is how it behaves when you stretch out your window. I noticed that when I viewed it full-screen, the testimonies were fairly stretched out. I believe(?) you can fix this small issue by using "margin-inline: auto;" on the class that represents your grid-layout.

  0
• 

  Yusuf Babatunde•220

  @owocodedSubmitted over 1 year ago

  

  four card features

  1

  10
  

  SunnyFGC•130

  @njmoon21Posted 3 months ago

  I'm not sure why, but the imported google fonts seems to not work. And for the formatting of the four cards, it seems like some of the cards are uneven in width. I think to fix this, you should use a 'display: grid' instead of flex like you did in your '.section-center' class.

  But besides that, great work on creating the details for all four cards! All the texts seem to have the correct font-weights for each designated element, and you also were able to place the images currently on each card, which is what I initially struggled with when working on this challenge.

  Marked as helpful

  0
• 

  Mohamed -hamid•480

  @alexpromanSubmitted 3 months ago

  

  Product preview card component

  1

  40
  

  SunnyFGC•130

  @njmoon21Posted 3 months ago

  For some reason, the image is not showing up on the preview website. However your solution/design comparison does show the image, so that means you definitely inserted it in there.

  Great job for creating ':root' variables just in case you need to change the values at one spot. The only nit-picky thing is that the "P E R F U M E" isn't spaced out as it should be. But besides that, looking at the solution/design comparison, The formatting is spot on.

  Marked as helpful

  0
• 

  contrebasses•60

  @contrebassesSubmitted 3 months ago

  What are you most proud of, and what would you do differently next time?

  As usual I spent a way more time on this than I thought I would. But I'm glad I did. I needed the practice and I feel more confident to keep learning and developing my coding skills.

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

  Styling bullets (list-item markers) was way more complicated than I thought. I learned about properties that I will definitely rely on in the future. Same as always, I feel like this solution is far from elegant, but it does the job.

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

  I would love some advice on how to plan my work in such a way that my code will be more readable and elegant. I'm also looking for more live examples of CSS grids.

  

  Recipe page

  1

  20
  

  SunnyFGC•130

  @njmoon21Posted 3 months ago

  Great job on the formatting! I also had a harder time than I initially thought, especially with the bullet points like you.

  Although I don't have years of experience, I can try to help you relative to some advice I had when trying to make my code more readable and elegant.

  I was taught about SEO and BEM methodology. BEM stands for Block-Element-Modifier, and I believe it's a way to name your classes to make them more understandable. For example, you would have a button element, but would have classes such as "button" and "button__icon". (Although not fully confident about how correct I am. I am certain that SEO and BEM are very important concepts to learn)

  0
• 

  Luiz Gonzaga•60

  @loez97Submitted 3 months ago

  

  Social Links - HTML, CSS

  1

  20
  

  SunnyFGC•130

  @njmoon21Posted 3 months ago

  • Looking at the code, the solution has semantic HTML, such as profile-card, __button, __actions, __header, etc.
  • All the buttons and links are functional, except for Instagram (maybe intentional?).
  • The webpage looks great on both desktop and mobile view.
  • Personally, I would've spaced out certain elements in the html file, but at least the elements are indented as needed.
  • Some margins and text sizes differ, however the differences are very tiny. Regardless, everything is formatted correctly.

  1
• 

  Zura Gabichvadze•60

  @SkratchyySubmitted 4 months ago

  

  Responsive Blog Component

  1

  30
  

  SunnyFGC•130

  @njmoon21Posted 4 months ago

  I really love the extra transition you created with the container shadow, it makes the site feel more interactive as opposed to just simply highlighting text.

  The layout looks great from multiple screen sizes, and the text wraps with the change of the screen size.

  0