Updated styles

This commit is contained in:
killerboss 2024-10-31 23:03:26 +01:00
parent 39f35f7d5f
commit 5cf82faf04

View file

@ -11,7 +11,7 @@ export interface Props {
export class H1 extends React.Component<Props> { export class H1 extends React.Component<Props> {
render() { render() {
return ( return (
<h1 className={cn("scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl", this.props.className)}> <h1 className={cn("mt-5 scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl", this.props.className)}>
{this.props.children} {this.props.children}
</h1> </h1>
); );
@ -21,7 +21,7 @@ export class H1 extends React.Component<Props> {
export class H2 extends React.Component<Props> { export class H2 extends React.Component<Props> {
render() { render() {
return ( return (
<h2 className={cn("scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight first:mt-0", this.props.className)}> <h2 className={cn("mt-5 scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight first:mt-0", this.props.className)}>
{this.props.children} {this.props.children}
</h2> </h2>
); );
@ -31,7 +31,7 @@ export class H2 extends React.Component<Props> {
export class H3 extends React.Component<Props> { export class H3 extends React.Component<Props> {
render() { render() {
return ( return (
<h3 className={cn("scroll-m-20 text-2xl font-semibold tracking-tight", this.props.className)}> <h3 className={cn("mt-5 scroll-m-20 text-2xl font-semibold tracking-tight", this.props.className)}>
{this.props.children} {this.props.children}
</h3> </h3>
); );
@ -41,7 +41,7 @@ export class H3 extends React.Component<Props> {
export class H4 extends React.Component<Props> { export class H4 extends React.Component<Props> {
render() { render() {
return ( return (
<h4 className={cn("scroll-m-20 text-xl font-semibold tracking-tight", this.props.className)}> <h4 className={cn("mt-5 scroll-m-20 text-xl font-semibold tracking-tight", this.props.className)}>
{this.props.children} {this.props.children}
</h4> </h4>
); );
@ -51,7 +51,7 @@ export class H4 extends React.Component<Props> {
export class P extends React.Component<Props> { export class P extends React.Component<Props> {
render() { render() {
return ( return (
<p className={cn("leading-7 [&:not(:first-child)]:mt-6", this.props.className)}> <p className={cn("text-justify leading-7 [&:not(:first-child)]:mt-6", this.props.className)}>
{this.props.children} {this.props.children}
</p> </p>
); );