Stel's Portfolio needs a review

Hi everyone, I just finished my portfolio and I’m so excited because I’ve claimed my first freeCodeCamp certificate.
Please have a look at it and give me your feedback.:sweat_smile::sweat_smile:

Some of the things I wrote are not true and the picture I used too is a bit weird.:joy::joy:
I wanted the project to look like something I could use in real life.

2 Likes

First of all, congrats on the first cert, thats awesome! I love your portfolio I think it looks stylish, yet warm and inviting. Responsiveness works well, and I think bringing the contact box up with your social media info and having a picture of yourself as the welcome-section is brilliant and works great. There are three things I noticed. First, on the larger desktop view, there appears to be a double overlap of some black opacity after you. Second, the hover effect for the download CV effect should probably be toned down a bit because it looks awkward when hovered given that CV stacks right-aligned under download, which looks off. Finally, I’d add hover effects to the launch buttons near the portfolio pieces. Again, awesome job overall!

1 Like

Hey Stella,
looks great, good job!

Suggestions:

  • the scale(1.3) in the navbar is so big, that it makes the navbar go higher
  • in my opinion, the padding of the navbar links is a little bit so low
  • there is no visual feedback for hovering over clickable elements (personal links, launch, images)
  • the image stel_crop_2.jpg is 1.2MB big. You can resize it and use gulp-imagemin
1 Like

I don’t see the CV stacked under the download. Could you a picture or elaborate more?
Thanks a lot.:sweat_smile:

The new hover fixed it from last change. So you are all good.

1 Like

Do you know what’s causing the overlapping after the “you”? When I remove the “you”, the overlapping still occurs at “meet”.

So, after looking at it for a little bit, it appears that the error is occuring because on the codepen html panel you have \<section class="me" id="me"> <h1><span>HELLO. NICE TO MEET YOU<span></h1>, you did not close the span tag after that started before hello and was intended to end at you. As a result, and after using inspect element and the developer tools built into apparently the browser interprets it this way <span>HELLO. NICE TO MEET YOU<span></span></span> which is why you have the overlap.

wow…I never noticed. That’s brilliant.
Thanks once again.:sweat_smile:

Great portfolio page, couldn’t find any mistakes with it. Keep it up and congratulations on your first freeCodeCamp certification.

1 Like

beautiful. how long have you been learning css and js?

1 Like

Not very long. I learnt everything here at freecodecamp. it’s just that I always try to make my project look like something I would do for a client and also the people here at freecodecamp help by reviewing it and giving suggestions that would make it even more beautiful.:sweat_smile:

looks really good … how long it took u to build it… and have you taken the other classes(JS)…before u worked on your portfolio … its… quiet impressive …keep it up…

Thanks for your feedback. I took me about 5 days and yes I did part of the JS classes before working on it.:sweat_smile:

nice one Stella , You have really done well

1 Like

Visual feedback when clicking the buttons to Github, Linkedin etc. would be very user-friendly

Thanks a lot for your feedback. What kind of visual feedback do you think would be cool? :sweat_smile:

The color of your icons is white
I would change it to your accent color,
e.g. for hover #47D4EB

For active, I would go a little bit darker.

1 Like