OW-02/index.html at main · Onna-bancho/OW-02 · 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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>SUNG JIN WOO Fan Website</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7" crossorigin="anonymous">
    <link rel="stylesheet" href="style.css">
  </head>
  <body class="flex-box ">
    <div class="container ">
      <header>
        <nav class="navbar navbar-expand-lg">
          <div class="container-fluid">
            <a class="navbar-brand text-white" href="#"><samp><img src="images/OT.png" class="rounded-circle" alt="" height="25px" width="25px"></samp> <samp>Otaku</samp></a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
              <span class="navbar-toggler-icon"></span>
            </button>
            <ul class="nav">
              <li class="nav-item">
                <a class="nav-link active text-white" aria-current="page" href="#"><samp>Home</samp></a>
              </li>
              <li class="nav-item">
                <a class="nav-link active text-white" aria-current="page" href="#"><samp><em class="text-decoration-underline">Characters</em></samp></a>
              </li>
              <li class="nav-item">
                <a class="nav-link active text-white" aria-current="page" href="#"><samp>Help</samp></a>
              </li>
            </ul>
          </div>
        </nav>
        <form id="form" class="search-container">
          <input type="text" id="query" name="q" class="search-input" placeholder="Search...">
          <button type="submit" class="search-button">
            <svg xmlns="http://www.w3.org/2000/svg" class="rounded-circle"  width="20" height="20" viewBox="0 0 24 24">
              <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 5 1.5-1.5-5-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/>
            </svg>
          </button>
        </form>

      </header>
      <main>
        <section class="profile">
          <div class="rank"><b class="h1 text-warning">S</b><small class="h6"> <i>RANK</i></small></div>
          <div class="name ">
            <small class="h6 text-warning">The Dancer A.K.A </small><br>
            <b class="display-5 text-white">CHA HAE IN</b><small class="h5 text-warning">(차해인)</small>
          </div>
          <div class="description text-white">
            CHA HAE IN <small class="text-warning">(차해인)</small>
            is the Vise-Guide Master of the hunt
            <br>ers Guide and the sword woman of the main raiding
            <br>party. She is the 9th ranked Hunter in south korea
            <br> also being it's only female S rank Hunter.
            <br>

            <br>
            Hae-In was a direct participant of the 4th Jeju Island
            <br>Reclaimation raid as a memder of the Korean S-Rank
            <br>Raid team. She possesses the unique ability of mana
            <br>smell and dislike the smell of hunters except for Sung
            <br>Jin-Woo.
          </div>
        </section>
        <section class="about">
          <br>
          <ul class="text-white">
            <li class="text-end display-5">ABOUT</li>
            <li class="text-end">AFFILIATION</li>
            <li class="text-end">STATUS</li>
            <li class="text-end">RELATIONSHIPS</li>
            <li class="text-end">SKILLS</li>
            <li class="text-end">TROOPS</li>
            <li class="text-end">WEAPONS & EQS</li>
          </ul>

          <div class="image-b">
          <img src="images/Adobe Express - file(3).png" alt="transparent-image" height="790px" width="480px">
          </div>
        </section>
      </main>
      <footer>
        <p>Redesigned by <i class="h2"><b>Onna-bancho.</b></i></p>
      </footer>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/js/bootstrap.bundle.min.js" integrity="sha384-k6d4wzSIapyDyv1kpU366/PK5hCdSbCRGRCMv+eplOQJWyd1fbcAu9OCUj5zNLiq" crossorigin="anonymous"></script>

  </body>
</html>