Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Daily Spells app by Anna and Erika #68

Open
wants to merge 61 commits into
base: main
Choose a base branch
from

Conversation

Anna2024WebDev
Copy link

Netlify link

https://dailyspells.netlify.app/

Collaborators

Anna Hansen
Erika Olsson

[Anna2024WebDev, erikamolsson]

Erika Olsson and others added 30 commits November 5, 2024 13:58
Anna2024WebDev and others added 28 commits November 8, 2024 13:49
…ted them into the header and the personalized spells component
updated h2 heading in personalized spells
@JennieDalgren JennieDalgren self-assigned this Nov 14, 2024
Copy link

@JennieDalgren JennieDalgren left a comment

Choose a reason for hiding this comment

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

Great job with the project.

You have met all requirements and implemented the given deisgn in a good way! Remember to go through the files and "clean them up" I commented in the files regarding indentation.

Comment on lines +6 to +17
color: #000;
text-align: center;
font-family: "Yeseva One";
font-size: 3rem;
font-style: normal;
font-weight: 400;
margin: 0;

//Desktop styling
@media (min-width: 1200px) {
font-size: 6rem;

Choose a reason for hiding this comment

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

indentation

Comment on lines +22 to +49
color: #FFF;
text-align: center;
font-family: "Yeseva One";
font-size: 1.5rem;
font-style: normal;
font-weight: 400;
margin: 0;

// Tablet styling
@media (min-width: 768px) {
font-size: 2.25rem;
}

// Desktop styling
@media (min-width: 1200px) {
font-size: 4rem;
text-align: left;
}

`

const Level3 = styled.h3` //Heading pop-up
color: #000;
font-family: "Yeseva One";
font-size: 1.25rem;
font-style: normal;
font-weight: 400;
line-height: normal;

Choose a reason for hiding this comment

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

indentation

Comment on lines +79 to +97
color: #FFF;
text-align: center;
font-family: "Josefin Sans";
font-size: 1.5rem;
font-weight: 400;
line-height: 1.95rem;
`;

export const Typography6 = styled.p` //Quotes typography, exported this to be able to use white color
color: ${(props) => (props.isWhite ? '#fff' : '#000')}; // default black - choise to be white
text-align: ${(props) => (props.isCentered ? 'left' : 'center')};
font-family: "Josefin Sans";
font-size: 0.75rem;
font-style: ${(props) => (props.noItalic ? 'normal' : 'italic')};
font-weight: 300;
line-height: 1.1rem;

@media (min-width: 768px) {
font-size: 1rem;

Choose a reason for hiding this comment

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

indentation

Comment on lines +115 to +122
const Tag = level === 1 ? Level1
: level === 2 ? Level2
: level === 3 ? Level3
: level === 4 ? Typography4
: level === 5 ? Typography5
: level === 6 ? Typography6
: level === 7 ? Typography7
: `h${level}`; // Use `h2`, `h3` directly for levels 2 and 3

Choose a reason for hiding this comment

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

this is clever, however it is a bit harder to understand instead of calling the different texts heading1 or paragraph or similar

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.

2 participants