Feature/add article page

[Enagrom5]

:rocket:	This description was created by Ellipsis for commit 73d9faaa47f2990a16442504263ba23a70c4da30

Summary:

This PR introduces a new Articles component for listing articles, an ArticlePage component for article details, and updates the landing page to include the new component.

Key points:

• New Articles component in src/components/Landing/ArticlesSection.tsx displays a list of articles.
• New ArticlePage component in src/pages/article.tsx for article details.
• Modified src/pages/index.tsx to include Articles component.

---

Generated with :heart: by ellipsis.dev

[netlify[bot]]

✅ Deploy Preview for goodeworkers ready!

Name	Link
🔨 Latest commit	73d9faaa47f2990a16442504263ba23a70c4da30
🔍 Latest deploy log	https://app.netlify.com/sites/goodeworkers/deploys/66673d2ba1a7550008cc54ed
😎 Deploy Preview	https://deploy-preview-44--goodeworkers.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify[bot]]

Richard left a comment:

Each section here should be clickable and goes to the article page for now (later on the specific article)

Browser metadata

``` Path: / Browser: Firefox 125.0 on Ubuntu Viewport: 1920 x 966 @1x Language: en-US Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2F&os=OS%20X&os_version=Big%20Sur&browser=Firefox&browser_version=125.0&resolution=1920x966&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[netlify[bot]]

Richard left a comment:

Missing the small round container and arrow from design :

NB : it should be animated, see figma preview

Browser metadata

``` Path: / Browser: Firefox 125.0 on Ubuntu Viewport: 1920 x 966 @1x Language: en-US Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2F&os=OS%20X&os_version=Big%20Sur&browser=Firefox&browser_version=125.0&resolution=1920x966&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[netlify[bot]]

Richard left a comment:

There spacing missing here it should look like :

Browser metadata

``` Path: /article/ Browser: Firefox 125.0 on Ubuntu Viewport: 1920 x 966 @1x Language: en-US Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2Farticle%2F&os=OS%20X&os_version=Big%20Sur&browser=Firefox&browser_version=125.0&resolution=1920x966&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[netlify[bot]]

Richard left a comment:

• The blog and arrow should be bigger based on design.
• The text and the picture should have the same width, which would fix the alignment of the picture

Browser metadata

``` Path: /article/ Browser: Firefox 125.0 on Ubuntu Viewport: 1920 x 1080 @1x Language: en-US Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2Farticle%2F&os=OS%20X&os_version=Big%20Sur&browser=Firefox&browser_version=125.0&resolution=1920x1080&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[netlify[bot]]

Richard left a comment:

Should be bold based on design

Browser metadata

``` Path: /article/ Browser: Firefox 125.0 on Ubuntu Viewport: 1920 x 1080 @1x Language: en-US Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2Farticle%2F&os=OS%20X&os_version=Big%20Sur&browser=Firefox&browser_version=125.0&resolution=1920x1080&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[netlify[bot]]

Richard left a comment:

Missing :

• Orange bold underlined text
• The orange bar on the left and the bold on text

Browser metadata

``` Path: /article/ Browser: Firefox 125.0 on Ubuntu Viewport: 1920 x 1080 @1x Language: en-US Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2Farticle%2F&os=OS%20X&os_version=Big%20Sur&browser=Firefox&browser_version=125.0&resolution=1920x1080&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[netlify[bot]]

Richard left a comment:

Border of the button is cropped

Browser metadata

``` Path: / Browser: Firefox 125.0 on Ubuntu Viewport: 1920 x 1080 @1x Language: en-US Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2F&os=OS%20X&os_version=Big%20Sur&browser=Firefox&browser_version=125.0&resolution=1920x1080&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[r-ichard]

Too much margin on responsive view

Design should be like figma :

Rounded border, button under the articles :

[r-ichard]

Spacing and fonts does not match :

[r-ichard]

The border of the circle for the arrows are cut out

Browser metadata

``` Path: /article/ Browser: Firefox 126.0 on Mac OS 10.15 Viewport: 1440 x 715 @2x Language: fr Cookies: Enabled ``` [Open in BrowserStack](https://www.browserstack.com/user/try-live?url=https%3A%2F%2Fdeploy-preview-44--goodeworkers.netlify.app%2Farticle%2F&os=OS%20X&os_version=Catalina&browser=Firefox&browser_version=126.0&resolution=1440x715&speed=1&start=true&ref=netlify-source)

Open Deploy Preview · Mark as Resolved

[r-ichard]

Hello !

We discovered a lot of issues related to images so we simplified the design with Lili here is the new one : here

[r-ichard]

For some reason the legal notice page is broken on your version : https://deploy-preview-44--goodeworkers.netlify.app/legal-notice/