BLOG-87 Fix to unify post content title color (#88)
All checks were successful
Frontend CI / build (push) Successful in 1m5s
All checks were successful
Frontend CI / build (push) Successful in 1m5s
### Description - Enhance typography and color consistency in PostPreview and PostContentPage - Add tailwind configuration for custom typography styles ### Package Changes _No response_ ### Screenshots _No response_ ### Reference Resolves #87 ### Checklist - [x] A milestone is set - [x] The related issuse has been linked to this branch Reviewed-on: #88 Co-authored-by: SquidSpirit <squid@squidspirit.com> Co-committed-by: SquidSpirit <squid@squidspirit.com>
This commit is contained in:
parent
0896afe819
commit
64ebfaa3e9
@ -1,5 +1,6 @@
|
||||
@import 'tailwindcss';
|
||||
@plugin '@tailwindcss/typography';
|
||||
@config "../tailwind.config.js";
|
||||
|
||||
@font-face {
|
||||
font-family: 'HackNerdMono';
|
||||
|
@ -16,7 +16,7 @@
|
||||
onMount(() => postBloc.dispatch({ event: PostEventType.PostLoadedEvent, id: id }));
|
||||
</script>
|
||||
|
||||
<article class="container prose pb-10">
|
||||
<article class="container prose pb-10 prose-gray">
|
||||
{#if state.data}
|
||||
<PostContentHeader postInfo={state.data.info} />
|
||||
<div class="max-w-3xl">
|
||||
|
@ -34,7 +34,7 @@
|
||||
</div>
|
||||
<div class="flex flex-col gap-y-2.5">
|
||||
<PostPreviewLabels labels={postInfo.labels} />
|
||||
<span class="line-clamp-1 text-lg font-bold">{postInfo.title}</span>
|
||||
<span class="line-clamp-1 text-lg font-bold text-gray-800">{postInfo.title}</span>
|
||||
<span class="line-clamp-3 text-justify text-sm">{postInfo.description}</span>
|
||||
<span class="text-sm text-gray-500">{postInfo.formattedPublishedTime}</span>
|
||||
</div>
|
||||
|
18
frontend/tailwind.config.js
Normal file
18
frontend/tailwind.config.js
Normal file
@ -0,0 +1,18 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
theme: {
|
||||
extend: {
|
||||
typography: () => ({
|
||||
gray: {
|
||||
css: {
|
||||
'--tw-prose-body': 'var(--color-gray-700)',
|
||||
'--tw-prose-headings': 'var(--color-gray-800)',
|
||||
'--tw-prose-links': 'var(--color-gray-800)',
|
||||
'--tw-prose-bold': 'var(--color-gray-800)',
|
||||
'--tw-prose-quotes': 'var(--color-gray-800)'
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
Loading…
x
Reference in New Issue
Block a user