-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathspanish.html
323 lines (287 loc) · 13.6 KB
/
spanish.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
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
<!DOCTYPE html>
<html lang="es" dir="ltr">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
<title>Comrad - Software para radio para registro de listas de reproducción y gestión de tráfico</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css" href="bootstrap.css">
<!-- Stylesheet -->
<link rel="stylesheet" type="text/css" href="style.css">
<!-- Google fonts CSS -->
<link href="https://fonts.googleapis.com/css?family=Montserrat|Roboto" rel="stylesheet">
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-md navbar-custom">
<!-- Logo should go here -->
<h3 class="my-auto"><a class="navbar-brand" href="#"><img src="images/Comrad-logo-reverse.png" alt="Comrad logo"
class="img-fluid"></a></h3>
<!-- page links -->
<div class="links-container1" ID="links1" style="display:none">
<a href="#features-grid" class="scroll-link">CARACTERISTICAS</a><a href="#how-to-use-grid" class="scroll-link">CÓMO UTILIZAR</a><a href="#contact-container" class="scroll-link">CONTÁCTENOS</a>
</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse w-100 flex-md-column" id="navbarCollapse">
<div class="btn-group ml-auto">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
Inglés
</button>
<div class="dropdown-menu dropdown-menu-right">
<button class="dropdown-item" type="button">Español</button>
</div>
</div>
<ul class="navbar-nav ml-auto large mb-2 mb-md-0">
<li class="nav-item active">
<a class="nav-link py-1" href="#">Docs</a>
</li>
<li class="nav-item">
<a class="nav-link py-1" href="#">Obtener comrad</a>
</li>
</ul>
</div>
</nav>
<!-- Intro -->
<div class="elipse-container">
<div class="col-lg-12" ID="top-elipse">
<img src="images/top-elipse.svg" alt="elipse" class="img-fluid" />
</div>
</div>
<div class="links-container2" ID="links2">
<a href="#features-grid" class="scroll-link">CARACTERISTICAS</a><a href="#how-to-use-grid" class="scroll-link">CÓMO UTILIZAR</a><a
href="#contact-container" class="scroll-link">CONTÁCTENOS</a>
</div>
<div style="overflow: hidden;" class="intro-container border-radius">
<div style="text-align: center; float: right" ID="availability">
<div class="available">Disponible</div>
<div ID="summer">Otoño<br>
<span class="year">2019</span>
</div>
</div>
Comrad es software moderno, codigo abierto para estaciones de radio que buscan manejar su registro de reproducción, gestión de tráfico, informes y más.
</div>
<!-- Email subscription -->
<div class="email-container" style="color: white; background-color: #7db2bf">
<p>Recibe una notificación cuando Comrad está disponible.</p>
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="email">Dirección de correo electrónico:</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp"
placeholder="Ingrese correo electrónico">
<button type="submit" class="btn btn-primary">Suscribir</button>
</div>
</form>
</div>
<!-- Screenshot of Comrad container -->
<div class="comrad-grid">
<div class="comrad-grid__screenshot">
<img src="images/ComradUI-2.png">
</div>
</div>
<!-- Orange separator -->
<div class="separator-container" style="background-color: #d64000;">
<p></p>
</div>
<!-- Features container -->
<div class="features-grid" ID="features-grid">
<div class="features-grid__rule1">
<div class="features-grid__description">
<h3 style="color: #007283; font-weight: bold;">CARACTERISTICAS</h3>
<p>Comrad es moderno y flexible: puede personalizarlo para adaptarlo a sus necesidades. Comrad también está diseñado de manera modular, por lo que solo puede usar una pieza de Comrad si solo necesita una pieza de funcionalidad.</p>
<p>Disponible en inglés o español.</p>
</div>
</div>
<div class="features-grid__rule2">
<div class="features-grid__button">
<img src="images/playbutton-blue.svg" onmouseover="this.src='images/playbutton-blue-hover.svg';" onmouseout="this.src='images/playbutton-blue.svg';">
</div>
<div class="features-grid__title">
<h3 style="color: #007283; font-weight: bold;">MOSTRAR PROGRAMACIÓN</h3>
</div>
<div class="features-grid__list border-radius">
<ul>
<li>Configura shows regulares en una interfaz amigable de Google Calendar.
</li>
<li>Almacene los anfitriones para cada programa y vea fácilmente cuándo faltan programas en los programas.
</li>
<li>Mantenga a sus oyentes informados con widgets para su sitio web que muestran un calendario de programas y qué programas se emiten actualmente.
</li>
</ul>
</div>
<div class="features-grid__button">
<img src="images/playbutton-green.svg" onmouseover="this.src='images/playbutton-green-hover.svg';" onmouseout="this.src='images/playbutton-green.svg';">
</div>
<div class="features-grid__title">
<h3 style="color: #007283; font-weight: bold; font-style: caps">REGISTRO DE LA LISTA DE REPRODUCCIÓN</h3>
</div>
<div class="features-grid__list">
<ul>
<li>Una interfaz fácil de usar permite a los DJ registrar sus listas de reproducción mientras están en el aire, y los widgets del sitio web permiten a sus oyentes ver la lista de reproducción de programas actuales y pasados.
</li>
<li>Las integraciones le permiten acceder a los metadatos sobre lo que se está reproduciendo actualmente para ayudar con la integración del sistema de datos de radio.
</li>
<li>Cuando sea necesario para el cumplimiento legal, solicite a los DJ información adicional durante los shows.
</li>
</ul>
</div>
<div class="features-grid__button">
<img src="images/playbutton-gold.svg" onmouseover="this.src='images/playbutton-gold-hover.svg';" onmouseout="this.src='images/playbutton-gold.svg';">
</div>
<div class="features-grid__title">
<h3 style="color: #007283; font-weight: bold;">LA GESTIÓN DEL TRÁFICO</h3>
</div>
<div class="features-grid__list">
<ul>
<li>Agilice la programación de su tráfico pidiéndole a los DJ que anuncien suscripciones y anuncios de servicio público mientras organizan sus shows.
</li>
<li>Filtre y clasifique sus eventos de tráfico existentes en una interfaz fácil de usar, similar a la de Google Calendar.
</li>
</ul>
</div>
<div class="features-grid__button">
<img src="images/playbutton-red.svg" onmouseover="this.src='images/playbutton-red-hover.svg';" onmouseout="this.src='images/playbutton-red.svg';">
</div>
<div class="features-grid__title">
<h3 style="color: #007283; font-weight: bold;">INTEGRACIÓN DEL SITIO WEB DE LA ESTACIÓN</h3>
</div>
<div class="features-grid__list" ID="redbutton">
<ul>
<li>Los widgets de JavaScript de Comrad le permiten mostrar datos del sistema en tiempo real en su sitio web, con un esfuerzo mínimo de codificación y desarrollo.
</li>
<li>Muestra un calendario de programas, el programa que se está transmitiendo actualmente y las listas de reproducción de cada programa.
</li>
</ul>
</div>
<div class="features-grid__button">
<img src="images/playbutton-purple.svg" onmouseover="this.src='images/playbutton-purple-hover.svg';" onmouseout="this.src='images/playbutton-purple.svg';">
</div>
<div class="features-grid__title">
<h3 style="color: #007283; font-weight: bold;">REPORTANDO</h3>
</div>
<div class="features-grid__list">
<ul>
<li>Genere informes para los informes de SoundExchange y otras normativas.
</li>
</ul>
</div>
</div>
</div>
<!-- Orange separator -->
<div class="separator-container" style="background-color: #d64000;">
<p></p>
</div>
<!-- How to use container -->
<div class="how-to-use-grid" ID="how-to-use-grid">
<div class="how-to-use-grid__description">
<h3 style="color: #007283; font-weight: bold; ">CÓMO UTILIZAR</h3>
<p>El alojamiento administrado en la nube estará disponible, o puede configurar Comrad usted mismo.</p>
</div>
<div class="how-to-use-grid__step">
<span class="number">1. </span>Regístrese para obtener una cuenta de alojamiento en la nube.</p>
</div>
<div class="how-to-use-grid__logos">
<img src="images/Amazon_Web_Services_Logo.png" ID="amazon">
<img src="images/google-cloud.png">
<img src="images/DreamHost2014.png">
</div>
<div class="how-to-use-grid__step">
<span class="number">2. </span>Siga la guía de configuración para instalar el software necesario en su alojamiento en la nube.</p>
</div>
<div class="how-to-use-grid__logos">
<img src="images/MongoDB-Logo.png">
<img src="images/nodejs-logo.png">
<img src="images/Nginx_logo.png">
</div>
<div class="how-to-use-grid__step">
<span class="number">3. </span>Descarga Comrad y configúralo para tu estación.
</div>
<div class="how-to-use-grid__logos">
<img src="images/github-logo.png">
<img src="images/music-brainz-logo_split.jpg">
</div>
</div>
<!-- Contact us container -->
<div class="contact-container" ID="contact-container">
<h3 style="color: #007283; font-weight: bold;">CONTÁCTENOS</h3>
<p>Nos encantaría escuchar comentarios, solicitudes de funciones y cualquier pregunta que tenga sobre Comrad. Estamos desarrollando activamente el software y sus requisitos evolucionarán según lo que necesiten las estaciones de radio. Siéntase libre de escribirnos en <a href="mailto:[email protected]">[email protected]</a>.</p>
</div>
<!-- <div class="container">
<div class="row">
<div class="col-sm-12 col-md-6 col-lg-3">Column 1</div>
<div class="col-sm-12 col-md-6 col-lg-3">Column 2</div>
<div class="col-sm-12 col-md-6 col-lg-3">Column 3</div>
<div class="col-sm-12 col-md-6 col-lg-3">Column 4</div>
</div>
</div> -->
<!-- Footer -->
<footer class="footer">
<div class="container-fluid">
<div class="row">
<div class="col-lg-2">
<div class="text-left">Comrad es un software de código abierto construido por voluntarios de<a href="https://www.codefordenver.org"
target="_blank">Code for Denver</a> y <a href="https://www.kgnu.org" target="_blank">KGNU</a>.</div>
</div>
<div class="col-lg-8">
<div class="footer-middle">
<div class="footer-copyright" style="text-align: center;">Copyright 2019 Code for Denver y colaboradores</div>
<img class="footer-image" src="images/bottom-elipse.svg" alt="elipse" class="img-fluid" />
</div>
</div>
<div class="col-lg-2">
<div style="text-align: right" ID="team"><a href="#">El equipo de Comrad</a> | <a href="#">Comrad en GitHub</a></div>
</div>
</div>
</div>
</footer>
<footer class="footer2">
<div class="container-fluid">
<!-- <div class="row">
<div class="col-lg-12"> -->
<div class="text-center"><p>Comrad es un software de código abierto construido por voluntarios de <a href="https://www.codefordenver.org"
target="_blank"> Code for Denver </a> y <a href="https://www.kgnu.org" target="_blank">KGNU</a>.</p>
<p><a href="#">El equipo de comrad</a> | <a href="#">Comrad en GitHub</a></p>
<p>Código de Copyright 2019 para Denver y colaboradores</p>
<!-- </div>
</div> -->
</div>
</div>
</footer>
<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"
integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"
integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k"
crossorigin="anonymous"></script>
<script>
$(function() {
$(".navbar-brand").click(function(e) {
e.preventDefault();
$("html,body").animate({scrollTop: 0}, 400);
});
$(".scroll-link").click(function(e) {
e.preventDefault();
let scrollToPos = $($(this).attr("href")).offset().top - $("nav").outerHeight() - 20;
$("html,body").animate({scrollTop: scrollToPos}, 400);
});
$(window).scroll(function() {
if ($(this).scrollTop() > 100) {
$("#links1").fadeIn();
} else {
$("#links1").fadeOut();
}
});
$(".features-grid__title,.features-grid__button").click(function() {
$(this).nextAll(".features-grid__list:first").slideToggle();
});
//only leave the first feature list open on page load
$(".features-grid__list:not(:first)").slideToggle();
})
</script>
</body>
</html>