javascript_project2/index.html at main · BHUVANESWAR-G/javascript_project2 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>BookNest</title>

    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <div class="navbar"><h1>BookNest</h1></div>
    <div class="book-container">
      <div class="content-box">
        <h2>Rich Dad Poor Dad</h2>
        <h3>Robert</h3>
        <p>
          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus
          nesciunt molestias necessitatibus deserunt totam asperiores, eos
          voluptate illum nisi nulla hic perferendis consectetur repellat, amet
          perspiciatis ad aspernatur velit, porro accusantium. Ipsum sint nulla
          nesciunt, ab quos odit! Ullam reiciendis tempora veritatis quod
          inventore soluta sunt delectus architecto commodi natus.
        </p>
        <button onclick="deletebook(event)" class="delete-button">Delete</button>
      </div>
    </div>

    <div>
      <button class="add-button" id="add-button">+</button>
    </div>

    <div class="popup-overlay"></div>

    <div class="popup-box">
      <h2>Add Book</h2>
      <form>
        <input type="text" placeholder="Book Title" id="book-title-input" />
        <input type="text" placeholder="Book Author" id="book-author-input" />
        <textarea
          placeholder="Short Description..."
          id="book-description-input"
        ></textarea>
        <button id="add-book">ADD</button>
        <button id="cancel-popup">CANCEL</button>
      </form>
    </div>

    <script src="script.js"></script>
  </body>
</html>