Improve documentation page

[kathywklee]

Context

There are some points I found which can further improve the documentation page: General:

• Standardize css, currently it's a mix of scss & Tailwind
• Revisit HTML tags & structure
• Optimize images

Homepage:

• Improve Section component on homepage, possible to add title, animation rules to it

About Us page:

• Fix timeline in mobile
• The contrast seems to be too low for --ifm-link-color, the link(refer to the screenshot above) : 1.71(light theme)/4.48(dark theme)
• Self-host background image of HeaderSection

Version/doc page: Haven't had time to have a look. Maybe in another issue as the scope of this issue is not small.

Suggested solution

• Use Tailwind as the main way of styling
• Use webp format for images as it is well supported among modern browsers, also resize images if needed
• About us timeline: display the UI similar to the one in desktop
• Pick another color for link to have higher contrast
• Initialize theme based on user preference (ref)

[webbertakken]

Thanks for the suggestions. Agreed on all suggested solutions.

The link colour is using the brand colour for GameCI. The new colour should be as close as possible to it, ideally just a different shade.

[webbertakken]

Seems these are all resolved. Awesome work!