User-Interface-Kathy/about.html at master · bubl-application/User-Interface-Kathy · 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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link
      href="https://fonts.googleapis.com/css?family=ABeeZee|Anton|Baloo+Da"
      rel="stylesheet"
    />
    <link
      rel="stylesheet"
      href="https://use.fontawesome.com/releases/v5.8.1/css/all.css"
      integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf"
      crossorigin="anonymous"
    />
    <link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
      integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
      crossorigin="anonymous"
    />
    <link href="css/index.css" rel="stylesheet" />
    <title>Bubl | About</title>
  </head>

  <body id="aboutBody">
    <nav class="navbar navbar-expand-lg navbar-dark bg-transparent">
      <div class="container">
        <a class="navbar-brand" href="index.html"
          ><img
            src="assets/PNG/INDIVIDUAL/brand.png"
            height="90"
            alt="brand image"
        /></a>
        <button
          class="navbar-toggler"
          type="button"
          data-toggle="collapse"
          data-target="#navbarTogglerDemo02"
          aria-controls="navbarTogglerDemo02"
          aria-expanded="false"
          aria-label="Toggle navigation"
        >
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
          <ul class="navbar-nav ml-auto text-center">
            <li class="nav-item">
              <a class="nav-link" href="about.html">About Bubl</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="contact.html">The Team</a>
            </li>
            <li class="nav-item dropdown text-center">
              <a
                class="nav-link dropdown-toggle"
                href="#"
                id="navbarDropdown02"
                role="button"
                data-toggle="dropdown"
                aria-haspopup="true"
                aria-expanded="false"
              >
                Schools
              </a>
              <div
                class="dropdown-menu text-center"
                aria-labelledby="navbarDropdown02"
              >
                <a class="dropdown-item" href="#">School 1</a>
                <a class="dropdown-item" href="#">School 2</a>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-link login-link" href="https://bubl-app.netlify.com/login">Login</a>
            </li>
          </ul>
          <a class="btn signup-Nav" href="https://bubl-app.netlify.com/register">Signup</a>
        </div>
      </div>
    </nav>

    <!-- about page -->
    <section id="section-about" class="grid">
      <div class="centered">
        <h1 class="innerH1s">About Bubl</h1>
        <a class="btn" id="signup-Nav" href="#">Signup</a>
        <video
          class="siteVideos"
          src="assets/VIDEOS/720p.mp4"
          poster="assets/PNG/INDIVIDUAL/Group 39poster.png"
          preload
          controls
          loop
        ></video>
        <p class="mainPara">
          Bubl is a social app for elementary school students transitioning to
          middle school. We get it. It's tough! What will you wear? Will you see
          old friends? Make new ones? And the teachers and schedules and
          clubs... it can get super overwhelming. But we thought of you when we
          made it. <br />
          Bubl is a place where you can do all of those things we mentioned and
          more! Sign up, pick your school, find your old friends, create Bubl
          groups on common interests & activities, and make new friends! All in
          all - Bubl's gonna help you live your best middle school life!
        </p>
        <div class="bubls">
          <img src="assets/PNG/INDIVIDUAL/bubbles_bottom.png" alt="" />
        </div>
      </div>
    </section>
    <script
      src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
      integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
      crossorigin="anonymous"
    ></script>
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
      integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
      crossorigin="anonymous"
    ></script>
    <script
      src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
      integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
      crossorigin="anonymous"
    ></script>
  </body>
</html>