## Description - Updates admin UI with more condensed spacing throughout. - Improves hover states and read-only states for various components. - Removes the `Merriweather` font from `next/font` and replaces with stack of system serif fonts and fallbacks (Georgia, etc). Closes #7257 ## BREAKING CHANGES - Custom components and styling that don't utilize Payload's CSS/SCSS variables may need adjustments to match the updated styling. - If you are using the `Merriweather` font, you will need to manually configure `next/font` in your own project. --------- Co-authored-by: Paul Popus <paul@nouance.io>
40 lines
804 B
TypeScript
40 lines
804 B
TypeScript
'use client'
|
|
import React from 'react'
|
|
|
|
import { Button } from '../Button/index.js'
|
|
import { usePreviewURL } from './usePreviewURL.js'
|
|
|
|
const baseClass = 'preview-btn'
|
|
|
|
const DefaultPreviewButton: React.FC = () => {
|
|
const { generatePreviewURL, label } = usePreviewURL()
|
|
|
|
return (
|
|
<Button
|
|
buttonStyle="secondary"
|
|
className={baseClass}
|
|
icon={'link'}
|
|
iconPosition="left"
|
|
// disabled={disabled}
|
|
onClick={() =>
|
|
generatePreviewURL({
|
|
openPreviewWindow: true,
|
|
})
|
|
}
|
|
size="medium"
|
|
>
|
|
{label}
|
|
</Button>
|
|
)
|
|
}
|
|
|
|
type Props = {
|
|
CustomComponent?: React.ReactNode
|
|
}
|
|
|
|
export const PreviewButton: React.FC<Props> = ({ CustomComponent }) => {
|
|
if (CustomComponent) return CustomComponent
|
|
|
|
return <DefaultPreviewButton />
|
|
}
|