-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
157 lines (132 loc) · 5.52 KB
/
index.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
157
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Give Generously</title>
<!-- CSS -->
<link type="text/css" rel="stylesheet" href="https://cdn.firebase.com/libs/firebaseui/3.2.0/firebaseui.css" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<!-- Add Tithe favicon -->
<link rel="icon" href="images/tithe-favicon.png" type="image/gif" sizes="16x16">
</head>
<body>
<!-- Dropdown Lists for state selection on mobile and desktop -->
<ul id="dropdown1" class="dropdown-content">
</ul>
<ul id="dropdown2" class="dropdown-content">
</ul>
<!-- Navigation Bar for Brand and State Picked Dropdown -->
<nav role="navigation">
<div class="nav-wrapper container">
<a id="logo-container" href="index.html" class="brand-logo"><img id="logo" class=responsive-img src="images/tithe-favicon.png" alt="Tithe"></a>
<ul class="right hide-on-med-and-down">
<li><a class="dropdown-trigger" href="#" data-target="dropdown1">Pick A State<i class="material-icons right">arrow_drop_down</i></a></li>
</ul>
<ul id="nav-mobile" class="sidenav">
<li><a class="dropdown-trigger" href="#" data-target="dropdown2">Pick a State</a></li>
</ul>
<a href="#" data-target="nav-mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>
</div>
</nav>
<!-- A section for title of page and brand statement -->
<div class="container">
<div class="section">
<div class="row">
<div class="col s12 center category">
<h3><i class="mdi-content-send brown-text"></i></h3>
<!-- <h4>Tithe</h4> -->
<p class="header-caption center-align light">A modern web application for contributing to your favorite charity!</p>
</div>
</div>
</div>
</div>
<!-- A section for the category cards with titles and pics -->
<div id="index-banner" class="parallax-container">
<div class="section no-pad-bot">
<div class="container">
<br>
<!-- Category Row updated dynamically -->
<div id="catRow" class="row cat-card" >
</div>
<br>
</div>
</div>
<!-- A background image -->
<div class="parallax" id="cat-background">
<div style="opacity: 0.4;">
<img src="images/begging-1922612_1920.png" alt="Hands">
</div>
</div>
</div>
<!-- A section for the favorites title -->
<div class="container">
<div class="section">
<div class="row">
<div class="col s12 center">
<h3><i class="mdi-content-send brown-text"></i></h3>
<p class="header-caption center-align light">★ Favorites</p>
</div>
</div>
</div>
</div>
<!-- A section for the favorite charity cards and their info -->
<div class="parallax-container valign-wrapper">
<div class="section no-pad-bot">
<div class="container">
<!-- The favorite charity row updated dynamically -->
<div id="favRow" class="row center">
</div>
</div>
</div>
<!-- A background image -->
<div class="parallax">
<div style="opacity: 0.4;">
<img src="images/background_image-2.jpeg" alt="Unsplashed background img 2">
</div>
</div>
</div>
<!-- Tithe page footer with links to the authors portfolio pages -->
<footer class="page-footer">
<div class="container">
<div class="row">
<div class="col s6">
<h5 class="white-text">Team Tithe</h5>
<p class="grey-text text-lighten-4">We are a team of college students living the dream.</p>
</div>
<div class="col s6">
<h5 class="white-text">Connect</h5>
<div class="row" style="margin-bottom: 8px;">
<div class="col s6">
<ul>
<li><a href="https://audiosutras.github.io/Bootstrap-Portfolio/index.html" target="_blank">Christopher Dixon</a></li>
<li><a href="https://chandana-k.github.io/" target="_blank">Chandana Katika</a></li>
</ul>
</div>
<div class="col s6">
<ul>
<li><a href="https://jenguin777.github.io/Bootstrap-Portfolio/portfolio.html" target="_blank">Jen Fahey</a></li>
<li><a href="https://ocskier.github.io/My-Mat-Portfolio/" target="_blank">Jon Jackson</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="footer-copyright">
<div class="container">
</div>
</div>
</footer>
<!-- Scripts-->
<script src="https://www.gstatic.com/firebasejs/4.12.0/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/firebaseui/3.2.0/firebaseui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="javascript/materialize.js"></script>
<script src="javascript/init.js"></script>
<script src="javascript/app.js"></script
</body>
</html>