Fixed books without cover display and added links to book page
This commit is contained in:
parent
3ac74ef780
commit
6044e7c375
@ -1,4 +1,6 @@
|
|||||||
.bookCard {
|
.bookCard {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
width: 300px;
|
width: 300px;
|
||||||
border: 1px lightgrey solid;
|
border: 1px lightgrey solid;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -3,23 +3,28 @@ import React from "react";
|
|||||||
import styles from "./BookItem.module.css";
|
import styles from "./BookItem.module.css";
|
||||||
|
|
||||||
import { IBook } from "~/types/book";
|
import { IBook } from "~/types/book";
|
||||||
|
import { Link } from "wouter";
|
||||||
|
|
||||||
interface IBookItemProps extends IBook {}
|
interface IBookItemProps extends IBook {}
|
||||||
|
|
||||||
export const BookItem = ({ author, title, cover }: IBookItemProps) => {
|
export const BookItem = ({ author, title, cover, hash }: IBookItemProps) => {
|
||||||
return (
|
return (
|
||||||
<div className={styles.bookCard}>
|
<Link href={hash!}>
|
||||||
<div className={styles.cardHeading}>
|
<a className={styles.bookCard}>
|
||||||
<h1>{title}</h1>
|
<div className={styles.cardHeading}>
|
||||||
<h2>{author}</h2>
|
<h1>{title}</h1>
|
||||||
</div>
|
<h2>{author}</h2>
|
||||||
<div className={styles.imageContainer}>
|
</div>
|
||||||
<img
|
{cover && (
|
||||||
className={styles.image}
|
<div className={styles.imageContainer}>
|
||||||
src={cover}
|
<img
|
||||||
alt={title + " cover picture"}
|
className={styles.image}
|
||||||
/>
|
src={cover}
|
||||||
</div>
|
alt={title + " cover picture"}
|
||||||
</div>
|
/>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</a>
|
||||||
|
</Link>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
Loading…
x
Reference in New Issue
Block a user