KevinMidboe/immich
1
0
Fork 0
mirror of https://github.com/KevinMidboe/immich.git synced 2025-10-29 17:40:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: Semantic fixes and improvements for the main documentation page (#4576)

Browse Source 
* 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:
Bogdan Cerovac
2023-10-21 22:08:58 +02:00
committed by GitHub
parent f2c20f60f7
commit 5ead4af2dc
1 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
docs/src/pages/index.tsx
View File

@@ -6,29 +6,31 @@ function HomepageHeader() {
return ( return (
<header> <header>
<section className="text-center m-6 p-12 border border-red-400 rounded-[50px] bg-gray-100 dark:bg-immich-dark-gray"> <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" /> <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"> <h1 className="md:text-6xl font-immich-title mb-10 text-immich-primary dark:text-immich-dark-primary uppercase">
IMMICH Immich
</h1> </h1>
<div className="font-thin sm:text-base md:text-2xl my-12 sm:leading-tight"> <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 uppercase">
<p className="mb-1">FOR PHOTOS AND VIDEOS</p> Self-hosted backup solution <span className="block"></span>
<p className="mb-1">ON MOBILE DEVICE</p> for photos and videos <span className="block"></span>
on mobile device
</p>
</div> </div>
<div className="flex flex-col sm:flex-row place-items-center place-content-center mt-9 mb-16 gap-4 "> <div className="flex flex-col sm:flex-row place-items-center place-content-center mt-9 mb-16 gap-4 ">
<Link <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" to="docs/overview/introduction"
> >
GET STARTED Get started
</Link> </Link>
<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/" to="https://demo.immich.app/"
> >
DEMO PORTAL Demo portal
</Link> </Link>
</div> </div>