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,16 +3,19 @@ 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!}>
<a className={styles.bookCard}>
<div className={styles.cardHeading}> <div className={styles.cardHeading}>
<h1>{title}</h1> <h1>{title}</h1>
<h2>{author}</h2> <h2>{author}</h2>
</div> </div>
{cover && (
<div className={styles.imageContainer}> <div className={styles.imageContainer}>
<img <img
className={styles.image} className={styles.image}
@ -20,6 +23,8 @@ export const BookItem = ({ author, title, cover }: IBookItemProps) => {
alt={title + " cover picture"} alt={title + " cover picture"}
/> />
</div> </div>
</div> )}
</a>
</Link>
); );
}; };