Hi FFC! I've just finished my Portfolio Challenge! I would really appreciate any kind of Feedback or Suggestion! :D

Code Feedback
1

Hi FFC! First of all, let me thank all the whole community as there’s always someone willing to help! You guys are great!

Here’s my Portfolio Page Challenge!

Secondly, I made up my mind this 2017 with the #100DaysOfCode Challenge (check out Twitter or GitHub in case you haven’t signed up yet!), and I’ve commited to progress throught FCC’s tutorial learning as much as I can.

I’ve started my Portfolio page a few days ago, and I’ve found myself feeling so dumb so many times, as it is WAY more different to follow up a tutorial where everything is “laboratory-like”, meaning that every parameter is contained and controlled. Building a project from scratch… Even though is something easy as a portfolio page… Well, it represented a big challenge for me. I couldn’t understand how Bootstrap’s Navbars worked until today! Hahahahaha

The cool thing is that, by building this project, I immersed myself in research and I think I finally got to start understanding the grid system, navbars and basic css layout! =D Ty again FCC and @QuincyLarson! Hahaha

Thirdly, I would really appreciate any kind of suggestions, comments, feedback… whatever you feel about guys! I’ve just started coding about 9-10 days ago, from scratch, having no idea about code, so I understand that my portfolio page won’t be really that great and its code won’t be the more efficient. That’s why I’m here! To learn! :grin: So any feedback is welcome!

Lastly, and I apologize if this sections isn’t the most appropriate to ask this question, the thing is that I’ve got two problems:

  • On Safari and Chrome browsers, I’ve got no problem with the .hover function that colors the icons when you pass the mouse through them, but Mozilla shows them grey always and doesn’t respond to .hover function.

The other problem I’ve got is again with the .hover function:

  • It doesn’t make any sense to establish a .hover function in smartphones as small devices are touchscreens. Is there a way to establish every icon as .active so as to show them colored full time in smartphones, and maintain the .hover function in large screens?
    I would like to point out that I’m 101% new to code and my knowledge in JavaScript is zero, so… Any kind of CSS/HTML formatting? Because I don’t want to Copy&Paste a code that haven’t been written by me: I feel like that’s not really helping to learn…

Anyway, thank you all SO MUCH!

Happy coding, and remember: Sharing is Power! =)

2

Hi Togeri,

I think your portfolio is awesome.
So this is what I would like to add:

  • when you read the portfolio on a small screen, the icons (twitter etc.) are in colour. But when you switch to bigger screens, they are all in grey
  • you can’t click on those icons (probably a codepen limitation)

Apart from that, I think it’s a great start :+1:

PS: very nice IDF Logo!

1 Like
3

Hi Melwyn,

Thanks really nice of you!
Yeah, I’ve mad that (colors) on purpose: on big screens (bigger than tablets), icons are shown in grey so as to be colored when you hover the mouse over them. As there’s no hover function on touchscreens, they’re just colored as the webpage initiates.
The only problem I’m facing now is that it works perfectly on Chrome, but Safari and Mozilla are much of a problem right now, even with the “-moz-” and “-webkit-” features. I still have to figure out how to solve this…

Thank you for the logo appreciation! I’m just learning a bit of design too, hahaha

Thank you very much for your support and feedback!

4

Hello Togeri!
Your portfolio is clear and efficient. I like the use of bright colours for your different categories in the portfolio, and although I’m still learning as well, I think it’s a good work :slight_smile: Keep going!

1 Like
5

Thank you very much @lnfrelot, I really appreciate the feedback! =)