-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
85 lines (80 loc) · 3.24 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GIFOS</title>
<link rel="stylesheet" href="style/style.css">
</head>
<body>
<header>
<nav>
<img src="assets/images/logo-mobile.svg" alt="GIFOS Logo" class="img_logo">
<div class="menu-btn">
<div class="menu-btn__burger"></div>
</div>
<!-- <ul>
<li><a href="#">Modo Nocturno</a></li>
<li><a href="#">Favoritos</a></li>
<li><a href="#">Mis GIFOS</a></li>
</ul> -->
</nav>
</header>
<section id="section_hero">
<!-- h1, hero image, search input, h3, trending links-->
<h1 class="search_result_toggable">Inspírate, busca, guarda, y crea los mejores <span>GIFOS</span></h1>
<img src="assets/images/ilustra_header.svg" class="search_result_toggable img_hero" alt="Hero image">
<div class="input_box">
<input type="text" id="input_search" placeholder="Busca GIFOS y más">
<img src="assets/icons/icon-search.svg" id="btn_search" alt="" class="icon_search">
</div>
<!-- <button id="btn_search">Search</button>
<button id="btn_clean">Clean</button>
<button id="btn_autocomplete">Autocomplete</button> -->
<div id="div_suggestions"></div>
<h4>Trending</h4>
<div id="trending_links_container">
<!-- Dinamically updated trending links go here -->
</div>
<hr>
<h1 id="search_h1"></h1> <!-- here goes the search query -->
<div class="gif_container" id="gif_results_showcase">
<!-- Dinamically created images go here -->
</div>
<button id="btn_show_more">Mostrar más</button>
</section>
<!-- <section id="section_create_gif">
<div id="preview_camera">
<video src="" id="video_cam_preview"></video>
</div>
<button id="btn_record">Record</button>
<button id="btn_stop">Stop</button>
<button id="btn_upload">Upload</button>
<a id="linkgif" href="">Link al gif</a>
</section> -->
<section id="section_trending">
<!-- h3, trending gifos-->
<h3>Trending GIFOS</h3>
<p>Mirá los últimos<br> GIFOS de nuestra comunidad</p>
<div id="trending_gifs_container">
<!-- Dinamically added trending gifs go here -->
</div>
<div>
<button id="btn_previous">Previous</button>
<button id="btn_next">Next</button>
</div>
</section>
<footer>
<p>Compartir en:</p>
<div class="social_icons_container">
<img src="assets/icons/icon_facebook.svg" alt="Facebook" class="icon_social">
<img src="assets/icons/icon-twitter.svg" alt="Twitter" class="icon_social">
<img src="assets/icons/icon_instagram.svg" alt="Instagram" class="icon_social">
</div>
<p>© GIFOS 2020 All Rights Reserved.</p>
</footer>
<!-- Scripts -->
<script src="https://www.WebRTC-Experiment.com/RecordRTC.js"></script>
<script src="scripts/script.js"></script>
<script src="scripts/create.js"></script>
</body>