Got my first freelance gig there are bugs I don't understand?

So a friend of mine who is n the VFX industry asked me to build a portfolio for her.
Right now I am still using placeholder text and images. Once complete we will move to her own hosting provider.
Take a look and tell me what you think.

http://chriscline.tk/meggen/

1 Like

Very good looking I find. Maybe the font-sizes are a little too big in some places like in contacts page. Also, sometimes it is so big I find the page overwhelming.

Keep up the good work,
-Tech.

Thank you for the feedback
yes we are still not sure about the fonts, right now the focus is on the structure and how the different portfolio classes are nested. On mobile the font-size looks good, I need to adjust for desktop.

1 Like

The cool thing about fluid fonts

had:

font-size: calc(12px + (28 - 12) * ((100vw - 300px) / (1600 - 300)));

change one number in the stylesheet and problem solved.

font-size: calc(12px + (22 - 12) * ((100vw - 300px) / (1600 - 300)));
1 Like

Nothing major but the white border isn’t visible in the bottom when using the Chrome browser (on a PC) even if scrolled to the very bottom.

Weird

1 Like

You must have looked before I changed the font size issue that@tech mentioned. The margins are set with rem units so the larger font-size was pushing it down

1 Like

Nop, still same.
It is visible however using full screen mode or just using Firefox browser.

Did you clear your cache file?
Otherwise your browser stores it and you won’t see changes made to the css file.
I am trying to replicate it but It is not showing up like that on my end

Yup, I did clear the cache.
I used Chrome with version 71.0.3578.98.
My computer’s screen resolution - 1920x1080.
My bookmark bar is disabled.
My operating system - Windows 10.

thanks for letting me know, Ill try to figure it out

Looks lovely on mobile Chris. One thing I’d say is that the black on pink text is very hard on my eyes especially as it’s relatively small. I think it would prove problematic for anyone with not great eyesight.

Edit: You may know this already, but I just realised that the burger menu is stuck in its expanded state regardless of making it active or inactive.

No I had not noticed any issues with the burger. What platform?

I’m using Chrome and I noticed a strange behavior when I hover the images on the projects section:

Notice the images in the first row, there’s a strange black line on the images after the hover effect. This doesn’t happen when I use Safari though, so you probably want to check your code for cross-browser compatibility.

Also when I navigate to the portfolio page, the entire section is clickable, but I suspect that you only want to be your “cards” to be clickable. I checked your source code in the console and you don’t have a container for your cards, that’s why that is happening.

// Do this
<header>
 <nav>...</nav>
</header>
<section class="container">
 <a class="card" href="link">...</a>
 <a class="card" href="link">...</a>
</section>

// Instead of this 
<header>
 <nav>...</nav>
</header>
<a class="card" href="link">...</a>
<a class="card" href="link">...</a>

BTW, congratulations on your first gig.

thank you, your issue seems to be happening in one of the images above as well
I will have to look into that
its got me confused because on my end I am not seeing any of that stuff and I am also using chrome and windows 10. there should be a darker overlay and a link button present on hover

as far as the anchors that was intentional. I want the entire section to be a link to the portfolio for that type of work

and yes I agree about the pink text I;m hoping maybe a different font might help. Friend really wants the pink text.

Seems to be the border around that area that becomes opaque when hovered over.

yeah that’s the problem. not sure what is causing that

This helped me when I faced a similar problem.

thank you will try
I must have made a mistake somewhere the code is a module from an earlier project

I need to compare the code and see what I messed up

what gets me is that I have two computers on one I see the bug and on the other I don’t
they are both HP laptops both running chrome but the bug only appears on one. What would cause that? I have no idea but I am sure its going to drive me insane figuring it out
That is what I really don’t understand