Project Handoff from UX designer #39
Conversation
There was a problem hiding this comment.
General feedback:
It seems you are missing the readme file? Add it, just to have somewhere to put a link to the deployed webpage at least :)
Overall, excellent job! It looks super professional, especially for the time given. A lot of components that adds complexity that you managed to pull off. I especially like the first carousel, nice job on the arrow animations!
I checked the responsiveness and it looks good in all sizes from what I could see. Impressive within the given time frame! The only thing I could find was that the power yoga and yoga studio description disappears in mobile view, but maybe that was intentional?
Also kudos that you managed to make use of styled components, states & props in your code. Nice job!
/Matilda
| <link rel="icon" type="image/png" sizes="32x32" href="./logo/favicon-32x32.png"> | ||
| <link rel="icon" type="image/png" sizes="16x16" href="./logo/favicon-16x16.png"> | ||
| <link rel="manifest" href="/site.webmanifest"> | ||
| <script src="https://kit.fontawesome.com/e51eabe7f5.js" crossorigin="anonymous"></script> | ||
| <!-- |
| import { SpyStudio } from './components/Infotainer/Spys'; | ||
| import { Adress } from './components/Infotainer/Adress'; | ||
| import { SignReview } from './components/SignUp/SignReview'; | ||
| import { Foot } from './components/Footer/Footer'; | ||
|
|
||
| export const App = () => { |
There was a problem hiding this comment.
Nice and clean App.js file! Easy to follow :)
|
|
||
| return ( | ||
| <> | ||
| <HamburgerButton type="button" onClick={() => toggleOpen(!open)}> |
There was a problem hiding this comment.
Nice job on the hamburger button functionality!
| @media (min-width: 895px) { | ||
| display: none; |
| right: 0; | ||
| background-color: #000; | ||
| opacity: 85%; | ||
| height: 100vh; |
There was a problem hiding this comment.
Is it intentional to have the navbar dropdown go all the way down to the buttom of the screen? If not, maybe you could alter the height to a smaller value?
| <p> Put simply, Yoga transformed our lives and we | ||
| want to share that magic with you. We created | ||
| Santulan to empower your journey to personal | ||
| growth and well-being. Our classes weave | ||
| ancient yogic philosophy into 21st century life, | ||
| and everyons's welcome, from absolute beginners | ||
| to advanced practitioners. We passionately | ||
| believe that Power Yoga is for everyone, | ||
| and no matter your age or flexibility, | ||
| our expert teachers will ensure you leave | ||
| each class stronger in mind and body. |
| return ( | ||
| <div className="review-container"> | ||
| <AwesomeSlider organicArrows={false}> | ||
| <div className="review-card"> |
There was a problem hiding this comment.
Since this component is being re-used, maybe it could be turned into its own component and imported? If you want to make it more concise. But not needed, works fine as it is :)
| @@ -1,8 +1,12 @@ | |||
| @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&display=swap'); | |||
| *{ | |||
| margin: 0; | |||
There was a problem hiding this comment.
I usually add 'box-sizing: border-box' here, to have it apply to all elements
https://ux-handoff-poweryoga.netlify.app