style: Update dark theming and fonts

This commit is contained in:
Aaron William Po
2023-10-23 23:16:31 -04:00
parent 6bd2d4713e
commit aef588c993
4 changed files with 43 additions and 39 deletions

View File

@@ -57,7 +57,7 @@ const BeerRecommendationsSection: FC<{
>
<div className="flex flex-col">
<Link className="link-hover link" href={`/beers/${post.id}`}>
<span className="text-xl font-semibold">{post.name}</span>
<span className="text-xl font-bold">{post.name}</span>
</Link>
<Link
@@ -74,7 +74,7 @@ const BeerRecommendationsSection: FC<{
className="link link-hover"
href={`/beers/styles/${post.style.id}`}
>
<span className="text-lg font-medium">{post.style.name}</span>
<span className="font-medium">{post.style.name}</span>
</Link>
</div>
<div className="space-x-2">

View File

@@ -62,41 +62,46 @@ const BeerStyleHeader: FC<BeerInfoHeaderProps> = ({ beerStyle }) => {
</div>
)}
</header>
<div className="space-y-2">
<div>
<p>{beerStyle.description}</p>
<div className="flex w-25 space-x-3 flex-row">
<div className="text-sm font-bold">
ABV Range:{' '}
<span>
{beerStyle.abvRange[0].toFixed(1)}% - {beerStyle.abvRange[0].toFixed(1)}%
</span>
</div>
<div className="text-sm font-bold">
IBU Range:{' '}
<span>
{beerStyle.ibuRange[0].toFixed(1)} - {beerStyle.ibuRange[1].toFixed(1)}
</span>
</div>
</div>
</div>
<div className="font-semibold">
Recommended Glassware:{' '}
<span className="text-sm font-bold italic">{beerStyle.glassware.name}</span>
</div>
<div className="flex justify-between">
<div>
{(!!likeCount || likeCount === 0) && (
<div className="flex justify-between">
<div className="space-y-2">
<div className="flex w-25 space-x-3 flex-row">
<div className="text-sm font-bold">
ABV Range:{' '}
<span>
Liked by {likeCount}
{likeCount !== 1 ? ' users' : ' user'}
{beerStyle.abvRange[0].toFixed(1)}% - {beerStyle.abvRange[0].toFixed(1)}
%
</span>
)}
</div>
<div className="text-sm font-bold">
IBU Range:{' '}
<span>
{beerStyle.ibuRange[0].toFixed(1)} - {beerStyle.ibuRange[1].toFixed(1)}
</span>
</div>
</div>
<div className="card-actions items-end">
{user && (
<BeerStyleLikeButton beerStyleId={beerStyle.id} mutateCount={mutate} />
)}
<div className="font-semibold">
Recommended Glassware:{' '}
<span className="text-sm font-bold italic">{beerStyle.glassware.name}</span>
</div>
<div className="flex justify-between">
<div>
{(!!likeCount || likeCount === 0) && (
<span>
Liked by {likeCount}
{likeCount !== 1 ? ' users' : ' user'}
</span>
)}
</div>
</div>
</div>
<div className="card-actions items-end">
{user && (
<BeerStyleLikeButton beerStyleId={beerStyle.id} mutateCount={mutate} />
)}
</div>
</div>
</div>