danvics/openreader
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve SEO

Browse source
This commit is contained in:
Richard Roberson 2025-01-26 23:11:36 -07:00
parent 2ae5d05849
commit 8ed930e65a
3 changed files with 50 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
src/app/layout.tsx
View file

@ -6,11 +6,42 @@ import { Footer } from "@/components/Footer";
export const metadata: Metadata = { export const metadata: Metadata = {
title: "OpenReader WebUI", title: "OpenReader WebUI",
description: "A modern web interface for reading and managing documents", description: 'A "bring your own TTS api" web interface for reading documents with high quality text-to-speech voices.',
appleWebApp: { keywords: "PDF reader, text to speech, tts open ai, kokoro tts, Kokoro-82M, OpenReader, TTS PDF reader, high quality text to speech",
capable: true, authors: [{ name: "Richard Roberson" }],
statusBarStyle: "black-translucent", manifest: "/manifest.json",
} metadataBase: new URL("https://openreader.richardr.dev"), // Replace with your domain
openGraph: {
type: "website",
locale: "en_US",
url: "https://openreader.richardr.dev",
siteName: "OpenReader WebUI",
title: "OpenReader WebUI",
description: 'A "bring your own TTS api" web interface for reading documents with high quality text-to-speech voices.',
images: [
{
url: "/web-app-manifest-512x512.png",
width: 512,
height: 512,
alt: "OpenReader WebUI Logo",
},
],
},
robots: {
index: true,
follow: true,
googleBot: {
index: true,
follow: true,
'max-video-preview': -1,
'max-image-preview': 'large',
'max-snippet': -1,
},
},
verification: {
// Add your verification codes if you have them
google: "MJXyTudn1kgQF8EtGD-tsnAWev7Iawso9hEvqeGHB3U",
},
}; };
export default function RootLayout({ export default function RootLayout({
@ -27,7 +58,7 @@ export default function RootLayout({
<body className="antialiased"> <body className="antialiased">
<Providers> <Providers>
<div className="min-h-screen bg-background p-4"> <div className="min-h-screen bg-background p-4">
<div className="max-w-6xl mx-auto align-center"> <div className="relative max-w-6xl mx-auto align-center">
<div className="bg-base rounded-lg shadow-lg"> <div className="bg-base rounded-lg shadow-lg">
{children} {children}
</div> </div>

21
src/app/page.tsx
View file

@ -5,22 +5,23 @@ import { PDFUploader } from '@/components/PDFUploader';
import { DocumentList } from '@/components/DocumentList'; import { DocumentList } from '@/components/DocumentList';
import { SettingsModal } from '@/components/SettingsModal'; import { SettingsModal } from '@/components/SettingsModal';
import { SettingsIcon } from '@/components/icons/Icons'; import { SettingsIcon } from '@/components/icons/Icons';
import { Button } from '@headlessui/react';
export default function Home() { export default function Home() {
const [isSettingsOpen, setIsSettingsOpen] = useState(false); const [isSettingsOpen, setIsSettingsOpen] = useState(false);
return ( return (
<div className='p-3 md:p-5'> <div className='p-3 md:p-5'>
<div className="flex justify-between items-center mb-6"> <Button
<h1 className="text-xl font-bold text-center flex-grow">OpenReader WebUI</h1> onClick={() => setIsSettingsOpen(true)}
<button className="rounded-full p-2 text-foreground hover:bg-offbase transform transition-transform duration-200 ease-in-out hover:scale-[1.1] hover:text-accent absolute top-3 right-3"
onClick={() => setIsSettingsOpen(true)} aria-label="Settings"
className="rounded-full p-2 text-foreground hover:bg-offbase transform transition-transform duration-200 ease-in-out hover:scale-[1.1] hover:text-accent" tabIndex={0}
aria-label="Settings" >
> <SettingsIcon className="w-6 h-6 hover:animate-spin-slow" />
<SettingsIcon className="w-6 h-6 hover:animate-spin-slow" /> </Button>
</button> <h1 className="text-xl font-bold text-center flex-grow">OpenReader WebUI</h1>
</div> <p className="text-sm text-center text-muted mb-5">{'A "bring your own text-to-speech api" web interface for reading documents with high quality voices.'}</p>
<div className="flex flex-col items-center gap-5"> <div className="flex flex-col items-center gap-5">
<PDFUploader className='max-w-xl' /> <PDFUploader className='max-w-xl' />
<DocumentList /> <DocumentList />

4
src/components/PDFViewSettings.tsx
View file

@ -61,7 +61,7 @@ export function PDFViewSettings({ isOpen, setIsOpen }: PDFViewSettingsProps) {
value={selectedView} value={selectedView}
onChange={(newView) => updateConfigKey('viewType', newView.id as ViewType)} onChange={(newView) => updateConfigKey('viewType', newView.id as ViewType)}
> >
<div className="relative"> <div className="relative z-10">
<ListboxButton className="relative w-full cursor-pointer rounded-lg bg-background py-2 pl-3 pr-10 text-left text-foreground shadow-sm focus:outline-none focus:ring-2 focus:ring-accent transform transition-transform duration-200 ease-in-out hover:scale-[1.01] hover:text-accent"> <ListboxButton className="relative w-full cursor-pointer rounded-lg bg-background py-2 pl-3 pr-10 text-left text-foreground shadow-sm focus:outline-none focus:ring-2 focus:ring-accent transform transition-transform duration-200 ease-in-out hover:scale-[1.01] hover:text-accent">
<span className="block truncate">{selectedView.name}</span> <span className="block truncate">{selectedView.name}</span>
<span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2"> <span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
@ -118,7 +118,7 @@ export function PDFViewSettings({ isOpen, setIsOpen }: PDFViewSettingsProps) {
className="inline-flex justify-center rounded-lg bg-background px-4 py-2 text-sm className="inline-flex justify-center rounded-lg bg-background px-4 py-2 text-sm
font-medium text-foreground hover:bg-background/90 focus:outline-none font-medium text-foreground hover:bg-background/90 focus:outline-none
focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2
transform transition-transform duration-200 ease-in-out hover:scale-[1.04] hover:text-accent" transform transition-transform duration-200 ease-in-out hover:scale-[1.04] hover:text-accent z-1"
onClick={() => setIsOpen(false)} onClick={() => setIsOpen(false)}
> >
Close Close