finalProjectCS4300/index.html at main · rhettmarcelo/finalProjectCS4300 · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Snap it!</title>
    <link rel="stylesheet" href="style.css">
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>

  <div id="top" class="fullscreen nopadding">
    <div id="header">
      <img src="https://cdn.discordapp.com/attachments/918652617444442134/1046981074569400350/Screenshot_2022-11-02_194612.png" width="50px" />
      <ul>
        <li><a href="#top">Home</a></li>
        <li><a href="about.html">About</a></li>
      </ul>
    </div>
    <div class="header">
      <h1>Home</h1>
    </div>
  </div>

  <div class="white nopadding more">
    <a id="more">&#x25BC; More &#x25BC;</a>
  </div>

  <div class="white">
    <a id="test"></a>
        <!-- rhett -->
        <section class="main">
          <div class="wrapper">
            <div class="left-col">
              <div class="status-wrapper">
                <div class="status-card">
                  <div class="profile-pic"><img src="/img/w1 - Copy.jpg" alt=""></div>
                  <p class="username">Vesper</p>
                </div>
                <div class="status-card">
                  <div class="profile-pic"><img src="/img/w2.jpg" alt=""></div>
                  <p class="username">Luna</p>
                </div>
                <div class="status-card">
                  <div class="profile-pic"><img src="/img/w3.jpg" alt=""></div>
                  <p class="username">Morocca</p>
                </div>
                <div class="status-card">
                  <div class="profile-pic"><img src="/img/w4.jpg" alt=""></div>
                  <p class="username">Ansarudin</p>
                </div>
                <div class="status-card">
                  <div class="profile-pic"><img src="/img/w5.jpg" alt=""></div>
                  <p class="username">Makimbo</p>
                </div>
                <div class="status-card">
                  <div class="profile-pic"><img src="/img/w6.jpg" alt=""></div>
                  <p class="username">Astrea</p>
                </div>
                <div class="status-card">
                  <div class="profile-pic"><img src="/img/w7.jpg" alt=""></div>
                  <p class="username">Marina</p>
                </div>

              </div>
            </div>
            <div class="right-col">

            </div>
          </div>
        </section>
    <h1>Hello we are Snap-It! We are the newest social media app that will beat our competitor Instagram!</h1>
    <p> Let's begin explaining who we are and why you should choose us! </p>
    <p> Down below will let us explain what will make us better social media app!</p>
  </div>

  <div class="semitrans">
    <h1>Quality</h2>
      <style scoped>
        .whiteText {background-color:black;color:white;}
        </style>
        <p class="whiteText">Here at Snap-It, we belive users should be able to capture and post photos at their full quality. At instagream they hold back user's potential pictures!</p>
      <h1>License</h1>
      <style scoped>
        .whiteText {background-color:black;color:white;}
        </style>
    <p class= "whiteText" >Here at Snap-It, we love seeing pictures at their full potentail so much that you should be able to license your photos and be able to sell them! This is for current and future influncers who want to come here and make it a job here. We will provide details and resources to help you jump start your job! </p>
    <h1> Limiting social media time </h1>
    <style scoped>
      .whiteText {background-color:black;color:white;}
      </style>
  <p class= "whiteText" >  Here at Snap-It, we believe users who struggle to put their phone down should be able to have control again! We offer an option for users who can limit their time on Snap-It and choose a max of 2 hours per day on our app. There will be an option to turn off the limitation if needed.  </p>
  </div>


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

</body>
</html>