You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
50 lines
843 B
50 lines
843 B
import styled from 'styled-components' |
|
|
|
const BookInfo = ({title ,publisher, author}: Props) => { |
|
return ( |
|
<Container> |
|
{/* <BookImg src={src} alt={title} /> */} |
|
<BookContent> |
|
<Title>{title}</Title> |
|
<Info>{publisher}</Info> |
|
<Info>{author}</Info> |
|
</BookContent> |
|
</Container> |
|
); |
|
} |
|
|
|
const Container = styled.div` |
|
display: flex; |
|
padding: 24px; |
|
`; |
|
|
|
const BookImg = styled.img` |
|
margin-right: 12px; |
|
width: 44%; |
|
min-width: 120px; |
|
border-radius: 4px; |
|
background: #eee; |
|
`; |
|
|
|
const BookContent = styled.div` |
|
flex-grow: 1; |
|
`; |
|
|
|
const Title = styled.div` |
|
font-weight: 500; |
|
margin-bottom: 4px; |
|
`; |
|
|
|
const Info = styled.div` |
|
font-size: 14px; |
|
margin-bottom: 4px; |
|
`; |
|
|
|
interface Props { |
|
// src: string; |
|
title: string; |
|
publisher: string; |
|
author: string; |
|
} |
|
|
|
export default BookInfo |