Skip to content

Commit

Permalink
This commit will add book and book control html
Browse files Browse the repository at this point in the history
  • Loading branch information
ayesha-ghani098 committed Aug 15, 2021
1 parent 1c2d676 commit 31d3b75
Show file tree
Hide file tree
Showing 4 changed files with 26 additions and 17 deletions.
14 changes: 4 additions & 10 deletions src/components/book/Book.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react';
import BookShelfControl from './BookShelfControl';

const Book = () => {
return (
Expand All @@ -9,19 +10,12 @@ const Book = () => {
style={{
width: 128,
height: 193,
backgroundImage: `url(${
book.imageLinks
? book.imageLinks.thumbnail
: 'icons/book-placeholder.svg'
})`,
}}
/>
<BookshelfChanger book={book} shelf={shelf} onMove={onMove} />
</div>
<div className='book-title'>{book.title}</div>
<div className='book-authors'>
{book.authors ? book.authors.join(', ') : 'Unknown Author'}
<BookShelfControl />
</div>
<div className='book-title'>"Harry Porter"</div>
<div className='book-authors'>Hello</div>
</div>
);
};
Expand Down
7 changes: 0 additions & 7 deletions src/components/book/BookShelfChanger.js

This file was deleted.

19 changes: 19 additions & 0 deletions src/components/book/BookShelfControl.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import React from 'react';

const BookShelfControl = () => {
return (
<div className='book-shelf-control'>
<select>
<option value='move' disabled>
Move to...
</option>
<option value='currentlyReading'>Currently Reading</option>
<option value='wantToRead'>Want to Read</option>
<option value='read'>Read</option>
<option value='none'>None</option>
</select>
</div>
);
};

export default BookShelfControl;
3 changes: 3 additions & 0 deletions src/containers/Home.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
import React from 'react';

// Components
import Book from '../components/book/Book';

const Home = ({ navigation }) => {
return (
<div className='App'>
Expand Down

0 comments on commit 31d3b75

Please sign in to comment.