postscope/index.html at main · daniszaidan/postscope · 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
51
52
53
54
55
56
57
58
59
60
61
62
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" type="text/css" href="css/styles.css" />
    <title>PostScope</title>
  </head>
  <body>
    <div class="container">
      <nav>
        <span>PostScope</span>
        <div class="menu">
          <a href="index.html">Posts</a>
          <a href="reports.html">Reports</a>
        </div>
      </nav>

      <div class="content" id="content">
        <h1>
          Looking for something? Search through the posts and watch closely,
          posts with <span class="highlight">"rerum"</span> will be highlighted.
        </h1>

        <div class="table-header">
          <h2>All Posts</h2>
          <div class="search-box">
            <input type="text" id="search" placeholder="Search..." />
            <svg
              xmlns="http://www.w3.org/2000/svg"
              fill="none"
              viewBox="0 0 24 24"
              stroke-width="1.5"
              stroke="currentColor"
            >
              <path
                stroke-linecap="round"
                stroke-linejoin="round"
                d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"
              />
            </svg>
          </div>
        </div>

        <div class="table-container">
          <table>
            <thead>
              <tr>
                <th style="min-width: 200px">Title</th>
                <th style="min-width: 400px">Body</th>
                <th>Comments</th>
              </tr>
            </thead>
            <tbody id="posts"></tbody>
          </table>
        </div>
      </div>
    </div>

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