Skip to content

Conversation

@smirrebinx
Copy link

No description provided.

Copy link

@YlvaKarlsson YlvaKarlsson left a comment

Choose a reason for hiding this comment

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

You did a very nice Labyrinth. Great animations and pictures!
Consistent css-code (that you use rem instead of mixing px, rem, em etc).

We would just advice you to change the opacity to be less transparent so the text is easier to read (or add a background color instead).

Great work from both of you!
Greetings /Ylva & Maja

Replace this readme with your own information about your project.

Start by briefly describing the assignment in a sentence or two. Keep it short and to the point.
This React project was focused on delving deeper into Redux. The project includes Redux-related topics, such as using thunks for async actions, working with APIs, and using Redux Toolkit. We worked in a pair and gained a more understanding of working with APIs with Redux, using thunks, and structuring our Redux store to best suit our data. We also learned about creating reusable components and sending JSON in the body of a request.

Choose a reason for hiding this comment

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

Good readme with proper information.
:)

{
"allowSingleLine": true
}
],

Choose a reason for hiding this comment

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

I also do this in all projects due to working with a Windows-computer = timesaver :D

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Bruno+Ace&family=Cormorant+Garamond:wght@300&family=Press+Start+2P&family=Wallpoet&display=swap" rel="stylesheet">
<title>Labyrinth</title>

Choose a reason for hiding this comment

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

Nice that you changed the title to something of your own.

import { Main } from 'components/Main.js'

export const App = () => {
return (

Choose a reason for hiding this comment

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

Clean code in the App.js - good job!

@@ -0,0 +1,11 @@
import React from 'react';
import { FireworksAnimation } from './FireworksAnimation';

Choose a reason for hiding this comment

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

Cool animation - We love it!

import styled from 'styled-components';
import HeroPlayerInputContainer from '../assets/hero-start-page.jpg';

export const DirectionText = styled.div`

Choose a reason for hiding this comment

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

You could have added a background to the boxes with the directions because the opacity makes it a little hard to read the text in a good way.
Apart from that we really love your styling.

return (
<Provider store={store}>
<StartGame />
{/* <GameQuestions />

Choose a reason for hiding this comment

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

If you don't need these here you could remove them from the code to improve even more 👍
( GameQuestions and EndGame )

@@ -0,0 +1,16 @@
import React from 'react';
import { Player } from '@lottiefiles/react-lottie-player';

Choose a reason for hiding this comment

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

We love this animation!

import HeroPlayerInputContainer from '../assets/hero-start-page.jpg';

export const StyledHeroPlayerInputContainer = styled.div`
background-image: url(${HeroPlayerInputContainer});

Choose a reason for hiding this comment

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

Nice work with using the url like this. It makes the code look cleaner.

import GameQuestions from './GameQuestions';
import Loading from './Loading';

// StartGame uses the useSelector hook to get the username

Choose a reason for hiding this comment

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

Good that you do comments like this :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants