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

Portfolio Desktop design #5

Merged
merged 10 commits into from
Mar 23, 2022
Merged

Portfolio Desktop design #5

merged 10 commits into from
Mar 23, 2022

Conversation

ichala
Copy link
Owner

@ichala ichala commented Mar 23, 2022

This PR contains the following features :

  • Add Desktop Design
  • Fix Conflicts With Mobile Design
  • Add Media Query to apply responsiveness

Copy link

@Omar-Muhamad Omar-Muhamad left a comment

Choose a reason for hiding this comment

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

Changes Required ♻️

Hi @ichala,

Nice job, you are almost there.

(Highlights) Good Points: 👍

  • You documented your work professionally. ✔
  • Github flow is used correctly. ✔
  • All linters checks are ok. ✔

(Changes Required) Aspects to improve: ♻️

  • Please check the inline comments below.

[Optional] suggestions:

  • Nothing to mention.

Every comment with the [OPTIONAL] prefix is not crucial enough to stop the approval of this PR. However, I strongly recommend you to take them into account as they can make your code better.

Cheers and Happy coding!👏👏👏

Feel free to leave any questions or comments in the PR thread if something is not 100% clear, and please remember to tag me in your question so I can receive the notification**

Please, do not open a new Pull Request for re-reviews. You should use the same Pull Request submitted for the first review, either valid or invalid unless it is requested otherwise.


As described in the Code reviews limits policy you have a limited number of reviews per project (check the exact number in your Dashboard). If you think that the code review was not fair, you can request a second opinion using this form.

styles.css Outdated
@@ -418,3 +426,469 @@ body {
margin-bottom: 20px;
}
}

@media only screen and (min-width: 768px) {
Copy link

@Omar-Muhamad Omar-Muhamad Mar 23, 2022

Choose a reason for hiding this comment

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

  • Please change the value of min-width any value between 992 and 1100 is acceptable because this is the desktop version, not the tablet version.
    for example min-width: 1080px

Choose a reason for hiding this comment

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

All good now 👍🏽

styles.css Outdated

@media only screen and (max-device-width: 480px) {
Copy link

@Omar-Muhamad Omar-Muhamad Mar 23, 2022

Choose a reason for hiding this comment

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

  • Please remove the media query max-width because you already developing a mobile-first application and there is no benefit from it contrariwise it makes you repeat a lot of code again in the desktop version and as you learn your code has to be dry.

Choose a reason for hiding this comment

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

All good now 👍🏽

styles.css Outdated
Comment on lines 761 to 767
.form-flex {
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
}
Copy link

@Omar-Muhamad Omar-Muhamad Mar 23, 2022

Choose a reason for hiding this comment

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

  • Please add the right width for The form and the heading text beside it and edit the fint size and wieght for that text too. and try to stick as much as possible to the given Figma design.
Figma Design Your Design
image image

Choose a reason for hiding this comment

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

All good now 👍🏽

styles.css Outdated
Comment on lines 667 to 672
.bg-about {
background-image: url(images/bg-abt.png);
background-size: 20%;
background-repeat: no-repeat;
background-position: top right;
}
Copy link

@Omar-Muhamad Omar-Muhamad Mar 23, 2022

Choose a reason for hiding this comment

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

  • I can see in the about me section that the text is overlapping the background. Please fix that and try to stick as much as possible to the given Figma design.
Figma Design Your Design
image image

Choose a reason for hiding this comment

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

All good now 👍🏽

Copy link

@Whoistolu Whoistolu left a comment

Choose a reason for hiding this comment

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

Hi @ichala

Great job implementing the recommended changes by the last reviwer.
Your project is complete! There is nothing else to say other than... it's time to merge it :shipit:

STATUS: APPROVED 🟢

Congratulations! 🎉

Cheers and Happy coding!👏👏👏

Feel free to leave any questions or comments in the PR thread if something is not 100% clear.
Please, remember to tag me @Whoistolu in your question so I can receive the notification.


As described in the Code reviews limits policy you have a limited number of reviews per project (check the exact number in your Dashboard). If you think that the code review was not fair, you can request a second opinion using this form.

@ichala ichala merged commit 1f2eea6 into main Mar 23, 2022
@ichala ichala deleted the Desktop-Design branch April 6, 2022 08:01
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