Oskar Nordin Portfolio #24

oskarnordin · 2025-04-28T17:37:46Z

Please include a link to your Figma design and a Netlify link.

https://fluffy-pavlova-f2b42e.netlify.app/
https://www.figma.com/design/ZRw04z3XfPptQHYQDDJFLr/Figma-designs-for-students--Copy----Oskar-N.?node-id=1045-3&p=f&m=dev

contact is now Contact.

removed style.css

style file test

KidFromCalifornia · 2025-05-08T08:45:47Z

dist/index.html

What is this for?

KidFromCalifornia · 2025-05-08T08:57:55Z

src/App.jsx

-      <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem, laborum! Maxime animi nostrum facilis distinctio neque labore consectetur beatae eum ipsum excepturi voluptatum, dicta repellendus incidunt fugiat, consequatur rem aperiam.</p>
+      <HeroVideo />
+      <Overlay />
+      <TechstackSection />


Your prop names are easy to understand and where they appear on your page. I can see you have a main element that isn't being used. Is that being addressed elsewhere?

KidFromCalifornia

Hey Oscar,

First off, I just wanted to say I really love what you’re doing with your project. The color choices are super solid, and the way you’re using animations to trigger the slides as you move through each section is really smooth, it adds a nice dynamic flow to everything. I also really liked the hero video, it’s a cool touch that definitely helps your project stand out more. I noticed a few things in your code that I wasn’t familiar with, so I’m curious to dig into those later, it looks like you’re trying out some cool stuff.

That said, I do have a couple of suggestions that might help. From an accessibility standpoint, it looks like you’re still missing a bit of semantic HTML in a few areas, so it might be good to go back through and make sure you’re using tags like

,

, and where they make sense. That’ll help with the overall structure and navigation, especially for screen readers.

I also noticed a few responsiveness issues, especially when scaling down from desktop to mobile. Around the mid-size range, some elements start to stretch or shift a bit weirdly. On mobile, there’s a bit of a hiccup with how things align, it seems like some flexbox behavior is changing unexpectedly, especially in your text stack layout.

It might also be worth double-checking your CSS and styled components. I noticed some class names that didn’t seem to match up with anything in the stylesheets, so maybe there’s some leftover or conflicting code hanging around. It could be worth cleaning those up just to avoid any styling bugs later on.

But all in all, you’re off to a really strong start. It already looks great, and I can tell it’s going to be an awesome finished product. Excited to see where you take it from here, keep it up.

last thing, don't forget to update your Netlify link 😉

Jonny

KidFromCalifornia · 2025-05-08T09:27:04Z

src/components/Sections/Contact.jsx

+`;
+
+const ContactSection = () => {
+  return (


Great use of styled components

KidFromCalifornia · 2025-05-08T09:32:24Z

src/components/Sections/Projects.jsx

+  box-sizing: border-box;
+  justify-content: center;
+  align-items: center;
+  @media (max-width: 768px) {


it seems like the formatting is incorrect. It might be good to check if this is causing an error.

KidFromCalifornia · 2025-05-08T09:38:55Z

src/components/Sections/Projects.jsx

+      />
+      <ProjectCard
+        title="This Portfolio"
+        description="The chat bot app is a conversational AI-powered tool designed to enhance user experience by providing instant, personalized, and automated responses to user inquiries."


I think using the JSON file to pull data would allow you to have cleaner code and reduce the number of lines of code. This would also enable you to update the JSON file only, without modifying the component card and populate each card on its own.

KidFromCalifornia · 2025-05-08T09:47:14Z

src/components/Cards/ContactCard.jsx

+  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+
+  &.visible {
+    opacity: 1;


Haven't seen this before! interesting!

KidFromCalifornia · 2025-05-08T10:06:05Z

src/main.jsx

-  </StrictMode>,
-)
+  const observer = new IntersectionObserver(
+    (entries, observer) => {


Is this necessary in the main? If so, could you import the hook or use it as a component to clean up the code?

KidFromCalifornia · 2025-05-08T10:22:47Z

src/components/HeroVideo.jsx

+
+const HeroVideoStyle = styled.video`
+  position: fixed;
+  top: 0;


Great job, I. loe the look of the video ! Is there a way to reduce the speed or pause it for accessibility?

HIPPIEKICK

Your Netlify link is broken, so please request a re-review when you’ve sorted the deploy.

Your code looks fine, however, remember to keep your code DRY going forward. You could’ve used the JSON file provided for the projects, or just put them in an array to loop through. It looks a bit repetitive now. Not a need-to-fix, but a nice-to-have.

HIPPIEKICK · 2025-06-09T10:50:00Z

Ping! 🔔

Change font

HIPPIEKICK · 2025-08-05T12:35:17Z

I still get Site not found on your Netlify link. Did you change the name of your deploy? 👀

oskarnordin · 2025-08-05T12:46:48Z

https://oskarnordin.se/

…

On Tue, 5 Aug 2025, 14:35 Matilda Brunemalm, ***@***.***> wrote: *HIPPIEKICK* left a comment (Technigo/js-project-portfolio#24) <#24 (comment)> I still get Site not found on your Netlify link. Did you change the name of your deploy? 👀 — Reply to this email directly, view it on GitHub <#24 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AJQPVUVTURQNOREXFFNER4T3MCQJVAVCNFSM6AAAAAB4A7WLG6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZTCNJVGAZTKMJVGM> . You are receiving this because you authored the thread.Message ID: ***@***.***>

JennieDalgren

⭐

fixed

oskarnordin added 11 commits April 28, 2025 16:27

Moved documents from earlier, non-forked repo to forked repo.

6d8421f

Update App.jsx

98dc3fa

contact is now Contact.

Update app.jsx

d64a4b7

removed style.css

styling according to design

d829d86

linked style.css

95399a7

global removal of margins

abf73d9

style linked

0e12b80

removed link in app

2a7260f

style file test

99ef2aa

style file test

added better file structure

9503ab4

removed style.css from gitignore

363b9cc

KidFromCalifornia reviewed May 8, 2025

View reviewed changes

dist/index.html

Copy link

KidFromCalifornia May 8, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is this for?

KidFromCalifornia reviewed May 8, 2025

View reviewed changes

HIPPIEKICK previously requested changes May 13, 2025

View reviewed changes

Change font

0455691

Change font

JennieDalgren approved these changes Oct 15, 2025

View reviewed changes

Oskar Nordin Portfolio #24

Are you sure you want to change the base?

Oskar Nordin Portfolio #24

Uh oh!

Conversation

oskarnordin commented Apr 28, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

KidFromCalifornia left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

HIPPIEKICK left a comment

Choose a reason for hiding this comment

Uh oh!

HIPPIEKICK commented Jun 9, 2025

Uh oh!

HIPPIEKICK commented Aug 5, 2025

Uh oh!

oskarnordin commented Aug 5, 2025 via email

Uh oh!

JennieDalgren left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants