-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
137 lines (128 loc) · 4.47 KB
/
about.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="about us">
<meta name="keywords" content="dogs, match, dogcare, tindog">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TinDog</title>
<link rel="stylesheet" href="./styles/styles.css">
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
<!-- FontAwesome Icons -->
<script src="https://kit.fontawesome.com/2b687f3f0a.js" crossorigin="anonymous"></script>
<style>#sidenav {display: none;}</style>
<script>
var openMenu = false;
$(document).ready(() => {
$("#hamburger").click(menuslide);
$("#closeMenu").click(menuslide);
$("sidenav").slideUp();
});
function menuslide () {
if (!openMenu) {
$("#hamburger").attr("src", "./imgs/openmenu.png");
$("#sidenav").slideDown()
} else {
$("#hamburger").attr("src", "./imgs/menu.png");
$("#sidenav").slideUp()
}
openMenu = !openMenu;
}
</script>
</head>
<body>
<header>
<div class="logoBar">
<div class="box">
<a href="index.html"><img src="./imgs/tindoglogo.png"></a>
</div>
<div class="box">
<h3>TinDog</h3>
</div>
</div>
<div class="nav">
<div class="box">
<img id="hamburger" style="height: 2em" src="./imgs/menu.png">
</div>
<div class="box">
<a href="index.html"><h4>Home</h4></a>
</div>
<div class="box">
<a href="match.html"><h4>Our Dogs</h4></a>
</div>
<div class="box">
<a href="donate.html"><h4>Donate</h4></a>
</div>
<div class="box">
<a href="care.html"><h4>Care Materials</h4></a>
</div>
<div class="box">
<a href="resources.html"><h4>Owner Resources</h4></a>
</div>
<div class="box">
<a href="about.html"><h4>About TinDog</h4></a>
</div>
<div class="box">
<a href="contact.html"><h4>Contact</h4></a>
</div>
</div>
<div id="sidenav">
<a href="index.html">Home</a>
<br>
<a href="match.html">Our Dogs</a>
<br>
<a href="donate.html">Donate</a>
<br>
<a href="care.html">Care Materials</a>
<br>
<a href="resources.html">Owner Resources</a>
<br>
<a href="about.html">About TinDog</a>
<br>
<a href="contact.html">Contact Us</a>
<br>
<button id="closeMenu">×</button>
</div>
</header>
<div class="main">
<div id="imgdiv">
<h1>About Us!</h1>
</div>
</div>
<div class="slogan-container">
<p id='slogan'>We are TinDog.</p>
<p id='slogan-caption'>Let us introduce ourselves.</p>
</div>
<div class="about-container">
<div class="pic-container">
<img id="profile-pics" src="./imgs/larry.jpg" alt="">
<img id="profile-pics" src="./imgs/alex.png" alt="">
<img id="profile-pics" src="./imgs/adrien.png" alt="">
<img id="profile-pics" src="./imgs/ben.png" alt="">
</div>
<div class="bio-container">
<p id='about-us-text'>We <b>LOVE</b> dogs. </p>
<p id='about-us-text'>And we're sure you do too. Here at
TinDog, it is our goal to make both every dog and every owner
happy. We are a group of programmers from Tufts University.
With out web programming skills, we thought there would be
nothing better than to utilize such skills to help all the
lonely dogs and people out there. We hope you enjoy our service!</p>
<i class="fas fa-bone fa-4x about-icon"></i>
<p id='about-us-text'>- Adrien Lynch, Ben McDermott, Alex
Williams, and Lawrence Xu</p>
</div>
</div>
<div id="donate" style="text-align: center;">
<h3>
TinDog relies upon your support to stay running!
</h3>
<p>If you like our service, please consider <a href="donate.html">donating!</a></p>
<form action="donate.html" method="get" id="btnform">
<button id="donatebtn">Donate Now!</button>
</form>
<br>
</div>
</body>
</html>