Hugging Face's logo

Spaces:
jordonpeter01
/
sf-f52
Running

App Files Community
jordonpeter01 commited on
Commit
6b5a736
·
verified ·
1 Parent(s): d4ec5d2

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +32 -39
index.html CHANGED
@@ -1,56 +1,49 @@
1
  <!DOCTYPE html>
2
- <html lang="en">
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Hugging Face Spaces Showcase</title>
7
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
8
  <style>
9
- body {
10
- background-color: #f5f5f5;
 
11
  }
12
- .space-card {
13
- margin-bottom: 20px;
 
 
 
 
14
  }
15
  </style>
16
  </head>
17
  <body>
18
  <div class="container">
19
- <h1 class="text-center">Hugging Face Spaces Showcase</h1>
20
  <div class="row">
21
- <div class="col-md-4">
22
- <div class="card space-card">
23
- <img src="https://via.placeholder.com/300x200" alt="Space 1 Image">
24
- <div class="card-body">
25
- <h5 class="card-title">Space 1</h5>
26
- <p class="card-text">Description of Space 1</p>
27
- <a href="#" class="btn btn-primary">View Space</a>
28
- </div>
29
- </div>
30
- </div>
31
- <div class="col-md-4">
32
- <div class="card space-card">
33
- <img src="https://via.placeholder.com/300x200" alt="Space 2 Image">
34
- <div class="card-body">
35
- <h5 class="card-title">Space 2</h5>
36
- <p class="card-text">Description of Space 2</p>
37
- <a href="#" class="btn btn-primary">View Space</a>
38
- </div>
39
- </div>
40
- </div>
41
- <div class="col-md-4">
42
- <div class="card space-card">
43
- <img src="https://via.placeholder.com/300x200" alt="Space 3 Image">
44
- <div class="card-body">
45
- <h5 class="card-title">Space 3</h5>
46
- <p class="card-text">Description of Space 3</p>
47
- <a href="#" class="btn btn-primary">View Space</a>
48
- </div>
49
- </div>
50
  </div>
51
  </div>
52
  </div>
53
- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
54
- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
55
  </body>
56
  </html>
 
1
  <!DOCTYPE html>
2
+ <html lang="pt-br">
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Barra de Pesquisa Estilo Google</html>
7
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
8
  <style>
9
+ .container {
10
+ padding: 20px;
11
+ text-align: center;
12
  }
13
+ #search-bar {
14
+ width: 100%;
15
+ padding: 15px;
16
+ border: 1px solid #ddd;
17
+ border-radius: 4px;
18
+ font-size: 16px;
19
  }
20
  </style>
21
  </head>
22
  <body>
23
  <div class="container">
 
24
  <div class="row">
25
+ <div class="col-md-12">
26
+ <h1>Barra de Pesquisa Estilo Google</h1>
27
+ <input type="text" id="search-bar" placeholder="Procure algo...">
28
+ <button onclick="executeSearch()" class="btn btn-primary mt-3">Pesquisar</button>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
29
  </div>
30
  </div>
31
  </div>
32
+
33
+ <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
34
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
35
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
36
+ <script>
37
+ function executeSearch() {
38
+ const searchBar = document.getElementById('search-bar');
39
+ const searchTerm = searchBar.value;
40
+
41
+ if (searchTerm) {
42
+ window.location.href = `https://www.google.com/search?q=${searchTerm}`;
43
+ } else {
44
+ alert('Digite algo na barra de pesquisa!');
45
+ }
46
+ }
47
+ </script>
48
  </body>
49
  </html>