Fixed books without cover display and added links to book page

This commit is contained in:
Dmitriy Shishkov 2021-07-16 04:39:12 +05:00
parent 3ac74ef780
commit 6044e7c375
No known key found for this signature in database
GPG Key ID: 14358F96FCDD8060
2 changed files with 21 additions and 14 deletions

View File

@ -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;

View File

@ -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>
); );
}; };