d76c16da19
* update article content to markdown ui component * decouple lunr indexing from class name * remove summary outline none rule, apply utility class instead * improve typing * scope more styles down to markdown-body/extended-markdown * move all markdown-body style overrides to MarkdownContent component * fix class targeting within css module * clean up MarkdownContent header style * rename data-lunr to data-search * fix: inline code color issue * fix: update article markdown to work with MarkdownContent
26 lines
613 B
TypeScript
26 lines
613 B
TypeScript
import React, { ReactNode } from 'react'
|
|
import cx from 'classnames'
|
|
|
|
type Props = {
|
|
as?: keyof JSX.IntrinsicElements
|
|
maxLines: number
|
|
children: ReactNode
|
|
className?: string
|
|
}
|
|
export const TruncateLines = (props: Props) => {
|
|
const { maxLines, className, children, as: Component = 'div' } = props
|
|
return (
|
|
<Component className={cx('root', className)}>
|
|
{children}
|
|
<style jsx>{`
|
|
.root {
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: ${maxLines};
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
}
|
|
`}</style>
|
|
</Component>
|
|
)
|
|
}
|