-
Notifications
You must be signed in to change notification settings - Fork 104
/
world.html
173 lines (155 loc) · 8.78 KB
/
world.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
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
<!DOCTYPE html>
<html>
<head>
<title>Cómo Ayudar MX | Help Needed.</title>
<meta name="description" content="Information Repository to assist those affected by the earthquake in Mexico." />
<!-- Twitter Card data -->
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@comoayudarmx">
<meta name="twitter:title" content="Help those affected by the earthquake in Mexico.">
<meta name="twitter:description" content="Find different organizations, collection centers or other helping methods to assist those affected by the earthquake in Mexico or earthquake rescuers.">
<meta name="twitter:image" content="http://javierivero.com/twitter.png">
<!-- Open Graph data -->
<meta property="og:title" content="Help those affected by the earthquake in Mexico." />
<meta property="og:type" content="web" />
<meta property="og:site_name" content="Cómo Ayudar MX" />
<meta property="og:url" content="http://comoayudar.mx/" />
<meta property="og:image" content="facebook.jpg" />
<meta property="og:description" content="Help those affected by the earthquake in Mexico. Help needed." />
<!-- Disable tap highlight on IE -->
<meta name="msapplication-tap-highlight" content="no">
<!-- Web Application Manifest -->
<link rel="manifest" href="manifest.json">
<!-- Add to homescreen for Chrome on Android -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="application-name" content="Cómo Ayudar MX">
<link rel="icon" sizes="192x192" href="img/touch/chrome-touch-icon-192x192.png">
<!-- Add to homescreen for Safari on iOS -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="Cómo Ayudar MX">
<link rel="apple-touch-icon" href="img/touch/apple-touch-icon.png">
<!-- Tile icon for Win8 (144x144 + tile color) -->
<meta name="msapplication-TileImage" content="img/touch/ms-touch-icon-144x144-precomposed.png">
<meta name="msapplication-TileColor" content="#f73535">
<!-- Color the status bar on mobile devices -->
<meta name="theme-color" content="#f73535">
<link rel="stylesheet" type="text/css" href="style.min.css">
<link rel="stylesheet" type="text/css" href="lib/chosen/chosen.css">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/chosen/chosen.jquery.min.js" ></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:400,500" rel="stylesheet">
<link rel="icon" href="favicon.png" type="image/x-icon" />
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">¿Cómo ayudar?</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="world.html" data-modal="contactos">Home</a></li>
<li><a class="modal__link" href="#" data-modal="about">About</a></li>
<li><a href="index.html">Español</a></li>
<li><a href="https://github.com/eldelentes/comoayudarmx" target="_blank">Contribute <i class="fa fa-github"></i></a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<section class="intro">
<div>
<h2 class="intro__title">Help Needed for Mexico Earthquake<br>Sep 7 and 19 and, 2017</h2>
<h4 class="intro__location"><i class="fa fa-globe"></i>CDMX, Puebla, Morelos, Tlaxcala, Oaxaca, Guerrero & Chiapas</h4>
<div class="buttons">
<a class="button" href="#cards">How Can You Help?</a>
<a class="button modal__link" href="#" data-modal="new">Publish <i class="fa fa-edit"></i></a>
</div>
</div>
</section>
<section class="cards" id="cards">
<div class="cards__intro">
<h3>Emergency Contacts</h3>
<p>Here is a contact list that can help you if you are in an area affected by the earthquake.</p>
<p>If you know any other important contact information <a class="modal__link" data-modal="new" href="#">Contact us.</a></p>
</div>
<div class="container">
<!-- Aquí se agregan las tarjetas -->
<!-- Por favor, no modifiques el markup/html de las tarjetas, solamente remplaza la información. -->
<div id="cards_container">
<template id="card_template">
<article class="card">
<h2 class="card__title"></h2>
<!-- Agrega una pequeña descripción -->
<p class="card__desc"></p>
<div class="card__info">
<div class="card__type">
<h4>Donation Type:</h4>
<!-- Especifica si la ayuda es en especie, monetaria, ayuda, etc. -->
<h3><i class="fa fa-info-circle"></i></h3>
</div>
<div class="card__location">
<h4>Location:</h4>
<!-- Especifica si se puede ayudar desde una parte o en todo México -->
<h3><i class="fa fa-globe"></i></h3>
</div>
</div>
<!-- Link al contacto, imágen, correo o información -->
<a class="card__button" target="_blank" href="">More Information</a>
</article>
</template>
</div>
</div>
<section class="modal" data-modal="about">
<a href="#" class="modal__close">Close</a>
<div class="modal__container">
<h2>About Como Ayudar</h2>
<p>This volunteer project is an effort to centralize all information regarding assistance and distribution to help those affected by the earthquake in Mexico on September 19, 2017.</p>
<p>If you are a developer and want to help, please check our repo on <a href="https://github.com/eldelentes/comoayudarmx"><i class="fa fa-github"></i>Github</a></p>
<hr>
<p> If you wish to add a Helping Source, please contact us here:</p>
<a href="https://twitter.com/comoayudarmx" target="_blank" class="modal__button"><i class="fa fa-twitter"></i>@comoayudarmx</a> or <a class="modal__email" href="mailto:[email protected]">[email protected]</a>
</div>
</section>
<section class="modal" data-modal="new">
<a href="#" class="modal__close">Close</a>
<div class="modal__container">
<h2>Publish a Helping Source</h2>
<p>Send us the information about a Helping Source with all the applicable information: Who are you helping, location, type of help. You can send us the information using the following methods:</p>
<a href="https://twitter.com/comoayudarmx" target="_blank" class="modal__button"><i class="fa fa-twitter"></i>@comoayudarmx</a> or <a class="modal__email" href="mailto:[email protected]">[email protected]</a>
</div>
</section>
<script src="cards.js" type="text/javascript"></script>
<script src="app.js" type="text/javascript"></script>
<script src="modals.js" type="text/javascript"></script>
<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-106793072-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments)};
gtag('js', new Date());
gtag('config', 'UA-106793072-1');
</script>
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-106793072-1', 'auto');
ga('require', 'displayfeatures');
ga('send', 'pageview');
</script>
</body>
</html>