Fix/home page appearance

[Ayoubrabiae]

#Fix Home page text appearance

• The issue number: #189

• The issue link

• I fixed the appearance of the home page text by adding the style attribute [margin: auto] to the div containing the text. However, this caused the gap between the image and the text to be removed. To address this, I adjusted the container that holds both the text and the image, giving it a 64px gap to match the margin that the text previously had.

• [x] I have read and followed the contribution guidelines.

• [x] I have tested these changes either locally on my machine

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
starter-hive	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 31, 2023 3:50pm

[ArslanYM]

Can you please tell me how to reproduce the issue. I cant seem to reproduce the issue in the first place. How to do it>

[Ayoubrabiae]

I noticed that the text on the home page didn't look good, so I made a fix. I went to the 'home.jsx' file and added the attribute style={{margin: auto}} to the div containing all the text. This improved the text's appearance, but it caused an issue on phones where the gap between the text and the image disappeared due to the auto margin.

To address this, I added a class called 'home-page-container' to the container holding the text and image. Then, in the 'index.css' file, I selected the 'home-page-container' class and added a gap property with a value of 64px, the same value as the previous margin of the text.

Now, the text looks good on both the home page and mobile devices.