内容两侧横线

()=>{
function Hr({ children }) {
	return <>
		<div className='cls001' >
			{children}
		</div>
		<style jsx>{`
.cls001{
	display: flex;
	flex-direction: row;
	font-family: 'Arial Negreta', 'Arial';
	font-weight: 700;
	font-style: normal;
	font-size: 24px;
	color: #666666;
}
.cls001:before,.cls001:after {
	content: "";
	flex: 1 1;
	border-bottom: 2px solid yellowgreen;
	margin: auto;
}
`}</style>
	</>;
}
return <Hr><div>aaa</div></Hr>;
}

import { ReactNode } from 'react';

/**
 * 横线
 */
export default function Hr({ children }: { children: ReactNode; }) {
	return <>
		<div className='cls001' >
			{children}
		</div>
		<style jsx>{`
.cls001{
	display: flex;
	flex-direction: row;
	font-family: 'Arial Negreta', 'Arial';
	font-weight: 700;
	font-style: normal;
	font-size: 24px;
	color: #666666;
}
.cls001:before,.cls001:after {
	content: "";
	flex: 1 1;
	border-bottom: 2px solid yellowgreen;
	margin: auto;
}
`}</style>
	</>;
}