docs: Semantic fixes and improvements for the main documentation page (#4576)
* Added missing alt text on logo in documentation * Better to use CSS to do the uppercases Some assistive technology can spell each letter instead of read the word, depends a lot on internals but it's better to prevent... * Semantic fix - single paragraph instead of many + uppercase via CSS Single sentence in single paragraph, using css instead * React requires className instead of class...
This commit is contained in:
parent
f2c20f60f7
commit
5ead4af2dc
1 changed files with 12 additions and 10 deletions
|
@ -6,29 +6,31 @@ function HomepageHeader() {
|
|||
return (
|
||||
<header>
|
||||
<section className="text-center m-6 p-12 border border-red-400 rounded-[50px] bg-gray-100 dark:bg-immich-dark-gray">
|
||||
<img src="img/immich-logo.svg" className="md:h-24 h-12 mb-2" />
|
||||
<h1 className="md:text-6xl font-immich-title mb-10 text-immich-primary dark:text-immich-dark-primary">
|
||||
IMMICH
|
||||
<img src="img/immich-logo.svg" className="md:h-24 h-12 mb-2" alt="Immich logo" />
|
||||
<h1 className="md:text-6xl font-immich-title mb-10 text-immich-primary dark:text-immich-dark-primary uppercase">
|
||||
Immich
|
||||
</h1>
|
||||
<div className="font-thin sm:text-base md:text-2xl my-12 sm:leading-tight">
|
||||
<p className="mb-1">SELF-HOSTED BACKUP SOLUTION </p>
|
||||
<p className="mb-1">FOR PHOTOS AND VIDEOS</p>
|
||||
<p className="mb-1">ON MOBILE DEVICE</p>
|
||||
<p className="mb-1 uppercase">
|
||||
Self-hosted backup solution <span className="block"></span>
|
||||
for photos and videos <span className="block"></span>
|
||||
on mobile device
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col sm:flex-row place-items-center place-content-center mt-9 mb-16 gap-4 ">
|
||||
<Link
|
||||
className="flex place-items-center place-content-center py-3 px-8 border bg-immich-primary dark:bg-immich-dark-primary rounded-full no-underline hover:no-underline text-white hover:text-gray-50 dark:text-immich-dark-bg font-bold"
|
||||
className="flex place-items-center place-content-center py-3 px-8 border bg-immich-primary dark:bg-immich-dark-primary rounded-full no-underline hover:no-underline text-white hover:text-gray-50 dark:text-immich-dark-bg font-bold uppercase"
|
||||
to="docs/overview/introduction"
|
||||
>
|
||||
GET STARTED
|
||||
Get started
|
||||
</Link>
|
||||
|
||||
<Link
|
||||
className="flex place-items-center place-content-center py-3 px-8 border bg-immich-primary/10 dark:bg-gray-300 rounded-full hover:no-underline text-immich-primary dark:text-immich-dark-bg font-bold"
|
||||
className="flex place-items-center place-content-center py-3 px-8 border bg-immich-primary/10 dark:bg-gray-300 rounded-full hover:no-underline text-immich-primary dark:text-immich-dark-bg font-bold uppercase"
|
||||
to="https://demo.immich.app/"
|
||||
>
|
||||
DEMO PORTAL
|
||||
Demo portal
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in a new issue