AaronPo/the-biergarten-app
1
0
Fork 0
mirror of https://github.com/aaronpo97/the-biergarten-app.git synced 2026-02-16 20:13:49 +00:00
Code Issues Packages Projects 1 Releases Wiki Activity

Style updates

Browse Source
This commit is contained in:
Aaron William Po
2023-04-21 23:32:18 -04:00
parent 2dfb080d0c
commit 6a00532f75
22 changed files with 360 additions and 314 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/pages/404.tsx
View File

@@ -11,9 +11,11 @@ const NotFound: NextPage = () => {
<title>404 Page Not Found</title>
<meta name="description" content="404 Page Not Found" />
</Head>
<div className="flex h-full flex-col items-center justify-center space-y-4">
<h1 className="text-7xl font-bold">Error: 404</h1>
<h2 className="text-xl font-bold">Page Not Found</h2>
<div className="mx-2 flex h-full flex-col items-center justify-center text-center lg:mx-0">
<h1 className="text-3xl font-bold lg:text-5xl">404: Not Found</h1>
<h2 className="text-lg font-bold">
Sorry, the page you are looking for does not exist.
</h2>
</div>
</Layout>
);

8
src/pages/500.tsx
View File

@@ -9,9 +9,11 @@ const ServerErrorPage: NextPage = () => {
<title>500 Internal Server Error</title>
<meta name="description" content="500 Internal Server Error" />
</Head>
<div className="flex h-full flex-col items-center justify-center space-y-4">
<h1 className="text-7xl font-bold">Error: 500</h1>
<h2 className="text-xl font-bold">Internal Server Error</h2>
<div className="mx-2 flex h-full flex-col items-center justify-center text-center lg:mx-0">
<h1 className="text-2xl font-bold lg:text-4xl">500: Something Went Wrong</h1>
<h2 className="text-lg font-bold">
Please try again later or contact us if the problem persists.
</h2>
</div>
</Layout>
);

5
src/pages/_app.tsx
View File

@@ -2,6 +2,8 @@ import UserContext from '@/contexts/userContext';
import useUser from '@/hooks/useUser';
import '@/styles/globals.css';
import type { AppProps } from 'next/app';
import { useEffect } from 'react';
import { themeChange } from 'theme-change';
import { Space_Grotesk } from 'next/font/google';
@@ -10,6 +12,9 @@ const spaceGrotesk = Space_Grotesk({
});
export default function App({ Component, pageProps }: AppProps) {
useEffect(() => {
themeChange(false);
}, []);
const { user, isLoading, error, mutate } = useUser();
return (

4
src/pages/_document.tsx
View File

@@ -22,6 +22,10 @@ export default function Document() {
href="favicon/favicon-16x16.png"
/>
<link rel="manifest" href="favicon/site.webmanifest" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0"
/>
</Head>
<body>
<Main />

2
src/pages/beers/[id]/edit.tsx
View File

@@ -16,7 +16,7 @@ interface EditPageProps {
}
const EditPage: NextPage<EditPageProps> = ({ beerPost }) => {
const pageTitle = `Edit "${beerPost.name}"`;
const pageTitle = `Edit \u201c${beerPost.name}\u201d`;
return (
<Layout>

6
src/pages/beers/[id]/index.tsx
View File

@@ -55,12 +55,12 @@ const BeerByIdPage: NextPage<BeerPageProps> = ({ beerPost, beerRecommendations }
src={image.path}
height={1080}
width={1920}
className="h-[42rem] w-full object-cover"
className="h-96 w-full object-cover lg:h-[42rem]"
/>
</div>
))
: Array.from({ length: 1 }).map((_, i) => (
<div className="h-[42rem] bg-base-300" key={i} />
<div className="h-96 lg:h-[42rem]" key={i} />
))}
</Carousel>
@@ -79,7 +79,7 @@ const BeerByIdPage: NextPage<BeerPageProps> = ({ beerPost, beerRecommendations }
</div>
) : (
<Tab.Group>
<Tab.List className="tabs tabs-boxed items-center justify-center rounded-2xl bg-base-300">
<Tab.List className="tabs tabs-boxed items-center justify-center rounded-2xl">
<Tab className="tab tab-md w-1/2 uppercase ui-selected:tab-active">
Comments
</Tab>

4
src/pages/beers/index.tsx
View File

@@ -38,9 +38,9 @@ const BeerPage: NextPage = () => {
<meta name="description" content="Beer posts" />
</Head>
<div className="flex items-center justify-center bg-base-100" ref={pageRef}>
<div className="my-10 flex w-11/12 flex-col space-y-4 lg:w-8/12 2xl:w-7/12">
<div className="my-10 flex w-10/12 flex-col space-y-4 lg:w-8/12 2xl:w-7/12">
<header className="my-10 flex justify-between lg:flex-row">
<h1 className="text-6xl font-bold">The Biergarten Index</h1>
<h1 className="text-4xl font-bold lg:text-6xl">The Biergarten Index</h1>
{!!user && (
<div
className="tooltip tooltip-left h-full"

2
src/pages/breweries/index.tsx
View File

@@ -16,7 +16,7 @@ const BreweryCard: FC<{ brewery: z.infer<typeof BreweryPostQueryResult> }> = ({
brewery,
}) => {
return (
<div className="card bg-base-300" key={brewery.id}>
<div className="card" key={brewery.id}>
<figure className="card-image h-96">
{brewery.breweryImages.length > 0 && (
<Image

5
src/pages/index.tsx
View File

@@ -7,7 +7,10 @@ const Home: NextPage = () => {
<>
<Head>
<title>The Biergarten App</title>
<meta name="description" content="Home" />
<meta
name="description"
content="The Biergarten App is an app for beer lovers to share their favourite brews and breweries with like-minded people online."
/>
</Head>
<Layout>
<div className="flex h-full w-full items-center justify-center bg-primary">