----------About This Project----------
This is a project that is made for TOP's(The Odin Project) curriculum. All the code you see here is written by me!
----------The Goal----------
So the overall goal is to create a library-type web application where a user can add a book, delete an existing one, mark the books read or not read.
----------My Thought Process----------
What's going through my mind 🧠 is having some kind of real books 📚📚 that the user can interact with. Maybe I might choose to use svgs or maybe gradients and give them a 3d look. I want the user experience to be like, "Wow! 😍 This is not something you see everyday ✨". I'm gonna use overflow-y: scrollbar so that I can have a lot of books and don't have to worry about them being overflowed or not being responsive 😩. I'm going to have the new book button somewhere at the bottom of the screen or at the top... Not quite sure about that...🤔. Anyway I'm going to have a delete ❌ button in the bottom side of the book and when the user clicks a book 📕 it opens up in the screen and he can see the details and toggle read or not read. The hardest part is going to be the Javascript Objects 😫. But HEY! I'll get through it... 💪... hopefully. 😜
----------Struggles I Had----------
- I had trouble with setting the book svgs up so that they would look realistic. So I kind of got rid of that idea and decided to cards instead.
- I'm having some trouble with how I want to create the edit section and delete functionality. I think it would take 1 day or 2 days to look it up and make it.
- I finally figured out how to delete a card now I don't think I can spend more time on this so I'm going to give up on the idea of adding an edit section and just be happy with what I got.!
----------Assets----------
The gradient:- background: linear-gradient(45deg, #c0c0c0 25%, transparent 25%) -50px 0,linear-gradient(45deg, #c0c0c0 25%, transparent 25%) -50px 0,linear-gradient(225deg, #c0c0c0 25%, transparent 25%),linear-gradient(225deg, #c0c0c0 25%, transparent 25%);background-size: 100px 100px;background-color: #e0e0e0;
Book svg:- Created by me... 😊. In the assets folder.
Avatars:- Downloaded from Storyset.com (Research illustrations by Storyset)
Color pallate:- Sourced from Realtimecolors.com
Text: #150a09
Background: #fbf1f1
Primary: #d5463e
Secondary: #f0938d
Accent: #f45147
Font:- Poppins
Finished in: 24th Of January 2024