style: Style adjustments, headings, search result etc. #20

Merged
timharek merged 14 commits from style-layout-changes into main 2024-04-02 19:14:06 +00:00
2 changed files with 4 additions and 4 deletions
Showing only changes of commit b20a2a1292 - Show all commits

View File

@ -5,9 +5,9 @@ export default function SeriesCard(props: { serie: SearchResult; origin: string
const feedUrl = new URL(`/api/feeds/${props.serie.seriesId}`, props.origin); const feedUrl = new URL(`/api/feeds/${props.serie.seriesId}`, props.origin);
const image = props.serie.images[0]; const image = props.serie.images[0];
return ( return (
<div className="border-2 my-2 p-2"> <div className="border-2 border-blue-800 p-4 rounded-lg bg-blue-400">
<div className="mx-auto h-full w-full space-y-2"> <div className="mx-auto h-full w-full space-y-2">
<h2 className="text-xl">{props.serie.title}</h2> <h2 className="text-xl font-semibold">{props.serie.title}</h2>
<p className="text-md">{props.serie.description}</p> <p className="text-md">{props.serie.description}</p>
<img src={image.uri} width={image.width} alt="" /> <img src={image.uri} width={image.width} alt="" />
<code className="font-mono bg-black text-white select-all p-2">{feedUrl.toString()}</code> <code className="font-mono bg-black text-white select-all p-2">{feedUrl.toString()}</code>

View File

@ -28,7 +28,7 @@ export default function Home({ data }: PageProps<HandlerData>) {
<Head> <Head>
<title>{data.query ? `Søk: ${data.query} - ` : ""}NRSS</title> <title>{data.query ? `Søk: ${data.query} - ` : ""}NRSS</title>
</Head> </Head>
<div className="p-4 mx-auto max-w-screen-md bg-blue-400"> <div className="p-4 mx-auto max-w-screen-md">
<div className="text-center"> <div className="text-center">
<h1 className="text-2xl lg:text-3xl font-semibold"> <h1 className="text-2xl lg:text-3xl font-semibold">
<a href="/">📻 NRSS</a> <a href="/">📻 NRSS</a>
@ -38,7 +38,7 @@ export default function Home({ data }: PageProps<HandlerData>) {
<Search defaultValue={data.query} /> <Search defaultValue={data.query} />
{data.result {data.result
? ( ? (
<div className="w-full mx-auto my-4"> <div className="w-full mx-auto my-4 space-y-4">
{data.result.map((result) => ( {data.result.map((result) => (
<SeriesCard <SeriesCard
serie={result} serie={result}