-
Notifications
You must be signed in to change notification settings - Fork 0
/
account.html
156 lines (128 loc) · 4.32 KB
/
account.html
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
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
<!doctype html>
<html lang="en">
<head>
<title>KeyLime - Account</title>
<!-- meta tags -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description" content="KeyLime">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Aliasger Rasheed, Cameron Dawson">
<!-- ADOBE FONTS -->
<link rel="stylesheet" href="https://use.typekit.net/kmv0kfi.css">
<!-- GOOGLE FONTS -->
<!-- Quicksand -->
<link href="https://fonts.googleapis.com/css?family=Quicksand:300,400,500,600,700&display=swap" rel="stylesheet">
<!-- Jost -->
<link rel="stylesheet" href="https://indestructibletype.com/fonts/Jost.css" type="text/css" charset="utf-8" />
<!-- Be Vietnam -->
<link href="https://fonts.googleapis.com/css?family=Be+Vietnam:100,100i,400,400i,600,600i,800,800i&display=swap"
rel="stylesheet">
<!-- css files -->
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/grid.css">
</head>
<body>
<header>
<nav id="nav-bar" class="top-bar row">
<div id="logo-cont" class="centerer row">
<a href="homepage.html">
<h1 class="logo-text keylime-logotype"> KeyLime </h1>
</a>
</div>
<div id="search-cont" class="centerer">
<input type="text" class="centerer" placeholder="Search..">
</div>
<div id="nav-cont" class="row">
<a href="account.html">Account</a>
<a href="about.html">About</a>
</div>
</nav>
</header>
<main class="grid x24">
<aside id="profile-section" class="accounts grid x24">
<div class="profile-pic">
<h2> Allie Webber </h2>
<figure>
<img src="images/profile-picture1.png" alt="Profile Picture">
</figure>
</div>
<div class="info">
<h3> About </h3>
<p> Studies criminology at UBC</p>
<p> Lives in Vancouver, British Columbia</p>
<p> Born in Boise, Idaho</p>
</div>
</aside>
<article id="settings-cont" class="grid x24 xR2">
<section class="stats-cont ">
<div>
<h3> Username </h3>
<p> allie.webber92 </p>
</div>
</section>
<!-- -->
<section class="stats-cont">
<div>
<h3 class=""> Followers </h3>
<p> 213 Followers </p>
</div>
</section>
<!-- -->
<section class="stats-cont">
<h3> Following </h3>
<p> 187 Following </p>
</section>
<!-- -->
<section class="stats-cont">
<h3> Posts </h3>
<p> 11 Posts </p>
</section>
<!-- -->
<section class="stats-cont">
<h3> Images </h3>
<p> 28 Images </p>
</section>
<!-- -->
<section class="stats-cont">
<h3> Videos </h3>
<p> 5 Videos </p>
</section>
</article>
<article id="sub-cont">
<section class="sub-options">
<div class="text-container">
<h2> Subscribe to KeyLime. </h2>
<h4> Recieve full access to KeyLime and never worry about your privacy again.</h4>
</div>
<div class="text-container row">
<h3 class="centerer"> 5.99 CAD + tax/month</h3>
<a href="billing.html" class="button-link centerer">Join us</a>
</div>
</section>
<section class="sub-options">
<div class="text-container">
<h2> Single time payment. </h2>
<h4> Pay a one time fee and renew your account as you see fit.</h4>
</div>
<div class="text-container row">
<h3 class="centerer"> 5.99 CAD + tax for 1 month</h3>
<a href="billing.html" class="button-link centerer">Join us</a>
</div>
<div class="text-container row">
<h3 class="centerer"> 15.99 CAD + tax for 3 month</h3>
<a href="billing.html" class="button-link centerer">Join us</a>
</div>
<div class="text-container row">
<h3 class="centerer"> 29.99 CAD + tax for 6 month</h3>
<a href="billing.html" class="button-link centerer">Join us</a>
</div>
<div class="text-container row">
<h3 class="centerer"> 55.99 CAD + tax for 1 year</h3>
<a href="billing.html" class="button-link centerer">Join us</a>
</div>
</section>
</article>
</main>
</body>
</html>