42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
|
import '../styles/cardBlogs.css'
|
||
|
|
|
||
|
|
type BlogCardProps = {
|
||
|
|
backgroundLink: string
|
||
|
|
}
|
||
|
|
|
||
|
|
export const BlogCard = ({ backgroundLink }: BlogCardProps) => {
|
||
|
|
return (
|
||
|
|
<a className='cardBlogMainWrapperLink' href='blog-inner.html'>
|
||
|
|
<div
|
||
|
|
className='cardBlogMain'
|
||
|
|
style={{
|
||
|
|
background: `url("${backgroundLink}") center / cover no-repeat`
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<div
|
||
|
|
className='cardBlogMainInside'
|
||
|
|
style={{
|
||
|
|
background:
|
||
|
|
'linear-gradient( rgba(255, 255, 255, 0) 0%, #232323 100%)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<h3
|
||
|
|
style={{
|
||
|
|
display: '-webkit-box',
|
||
|
|
WebkitBoxOrient: 'vertical',
|
||
|
|
overflow: 'hidden',
|
||
|
|
WebkitLineClamp: 2,
|
||
|
|
fontSize: '20px',
|
||
|
|
lineHeight: 1.5,
|
||
|
|
color: 'rgba(255, 255, 255, 0.75)',
|
||
|
|
textShadow: '0 0 8px rgba(0, 0, 0, 0.25)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
This is a blog title, the best blog title in the world!
|
||
|
|
</h3>
|
||
|
|
</div>
|
||
|
|
</div>{' '}
|
||
|
|
</a>
|
||
|
|
)
|
||
|
|
}
|