Make description text style more consistent
- links and blockquotes have light font weight, like other text - font size in editor matches font size in description - old descriptions have same style as new - placeholder text matches editor style - decrease line-height a bit
This commit is contained in:
parent
e2a72dd0a2
commit
781de79b97
|
@ -21,7 +21,8 @@ import { FileUploadButton } from './file-upload-button'
|
||||||
import { linkClass } from './site-link'
|
import { linkClass } from './site-link'
|
||||||
|
|
||||||
const proseClass = clsx(
|
const proseClass = clsx(
|
||||||
'prose prose-p:my-2 prose-li:my-0 prose-blockquote:not-italic max-w-none prose-quoteless font-light'
|
'prose prose-p:my-0 prose-li:my-0 prose-blockquote:not-italic max-w-none prose-quoteless leading-relaxed',
|
||||||
|
'font-light prose-a:font-light prose-blockquote:font-light'
|
||||||
)
|
)
|
||||||
|
|
||||||
export function useTextEditor(props: {
|
export function useTextEditor(props: {
|
||||||
|
@ -34,7 +35,7 @@ export function useTextEditor(props: {
|
||||||
|
|
||||||
const editorClass = clsx(
|
const editorClass = clsx(
|
||||||
proseClass,
|
proseClass,
|
||||||
'box-content min-h-[6em] textarea textarea-bordered'
|
'box-content min-h-[6em] textarea textarea-bordered text-base'
|
||||||
)
|
)
|
||||||
|
|
||||||
const editor = useEditor({
|
const editor = useEditor({
|
||||||
|
@ -98,7 +99,7 @@ export function TextEditor(props: {
|
||||||
{editor && (
|
{editor && (
|
||||||
<FloatingMenu
|
<FloatingMenu
|
||||||
editor={editor}
|
editor={editor}
|
||||||
className="-ml-2 mr-2 w-full text-sm text-slate-300"
|
className={clsx(proseClass, '-ml-2 mr-2 w-full text-slate-300 ')}
|
||||||
>
|
>
|
||||||
Type <em>*markdown*</em>. Paste or{' '}
|
Type <em>*markdown*</em>. Paste or{' '}
|
||||||
<FileUploadButton
|
<FileUploadButton
|
||||||
|
@ -155,7 +156,7 @@ function RichContent(props: { content: JSONContent }) {
|
||||||
export function Content(props: { content: JSONContent | string }) {
|
export function Content(props: { content: JSONContent | string }) {
|
||||||
const { content } = props
|
const { content } = props
|
||||||
return typeof content === 'string' ? (
|
return typeof content === 'string' ? (
|
||||||
<div className="whitespace-pre-line break-words">
|
<div className="whitespace-pre-line font-light leading-relaxed">
|
||||||
<Linkify text={content} />
|
<Linkify text={content} />
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
|
|
Loading…
Reference in New Issue
Block a user