Hugging Face's logo

Spaces:
Chunte
/
HFBA
Running

App Files Community
3
Chunte HF Staff commited on
Commit
b314464
·
verified ·
1 Parent(s): d8f0e51

Upload index.html

Browse files
Files changed (1) hide show
  1. index.html +48 -40
index.html CHANGED
@@ -15,6 +15,14 @@
15
  document.body.removeChild(link);
16
  }
17
  </script>
 
 
 
 
 
 
 
 
18
  <link rel="stylesheet" href="css/style.css" />
19
  <title>HFBA</title>
20
  <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -41,22 +49,22 @@
41
  <!--Download Buttons-->
42
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
43
  <!--.PNG button-->
44
- <button x-data="{ filename: 'Hugging Face.png', imageUrl: 'images/Brand Logos/Hugging Face.png' }" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2">
45
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
46
- <p class="text-gray-500 ">.PNG</p>
47
  </button>
48
 
49
- <hr class="mx-2 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
50
  <!--.SVG button-->
51
- <button x-data="{ filename: 'hf-logo.svg', imageUrl: 'images/Brand Logos/hf-logo.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2 ">
52
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
53
- <p class="text-gray-500 ">.SVG</p>
54
  </button>
55
- <hr class="mx-2 h-3 rounded-sm border-IconBorder border-r xl:mx-2.5">
56
  <!--.AI button-->
57
- <button x-data="{ filename: 'hf-logo.ai', imageUrl: 'images/Brand Logos/hf-logo.ai'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2">
58
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
59
- <p class="text-gray-500 ">.AI</p>
60
  </button>
61
  </div>
62
  </div>
@@ -71,15 +79,15 @@
71
  <!--Download Buttons-->
72
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
73
  <!--.PNG button-->
74
- <button x-data="{ filename: 'Rainbow Hugging Face.png', imageUrl: 'images/Brand Logos/Rainbow Hugging Face.png'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2">
75
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
76
- <p class="text-gray-500 ">.PNG</p>
77
  </button>
78
- <hr class="mx-2 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
79
  <!--.SVG button-->
80
- <button x-data="{ filename: 'Rainbow Hugging Face.svg', imageUrl: 'images/Brand Logos/Rainbow Hugging Face.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2 ">
81
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
82
- <p class="text-gray-500 ">.SVG</p>
83
  </button>
84
 
85
  </div>
@@ -94,22 +102,22 @@
94
  <!--Download Buttons-->
95
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
96
  <!--.PNG button-->
97
- <button x-data="{ filename: 'hf-logo-with-title.png', imageUrl: 'images/Brand Logos/hf-logo-with-title.png' }" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2">
98
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
99
- <p class="text-gray-500 ">.PNG</p>
100
  </button>
101
 
102
- <hr class="mx-2 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
103
  <!--.SVG button-->
104
- <button x-data="{ filename: 'hf-logo-with-title.svg', imageUrl: 'images/Brand Logos/hf-logo-with-title.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2 ">
105
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
106
- <p class="text-gray-500 ">.SVG</p>
107
  </button>
108
- <hr class="mx-2 h-3 rounded-sm border-IconBorder border-r xl:mx-2.5">
109
  <!--.AI button-->
110
- <button x-data="{ filename: 'hf-logo-with-title.ai', imageUrl: 'images/Brand Logos/hf-logo-with-title.ai'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2">
111
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
112
- <p class="text-gray-500 ">.AI</p>
113
  </button>
114
  </div>
115
  </div>
@@ -124,22 +132,22 @@
124
  <!--Download Buttons-->
125
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
126
  <!--.PNG button-->
127
- <button x-data="{ filename: 'hf-logo-with-white-title.png', imageUrl: 'images/Brand Logos/hf-logo-with-white-title.png' }" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2">
128
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
129
- <p class="text-gray-500 ">.PNG</p>
130
  </button>
131
 
132
- <hr class="mx-2 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
133
  <!--.SVG button-->
134
- <button x-data="{ filename: 'hf-logo-with-white-title.svg', imageUrl: 'images/Brand Logos/hf-logo-with-white-title.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2 ">
135
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
136
- <p class="text-gray-500 ">.SVG</p>
137
  </button>
138
- <hr class="mx-2 h-3 rounded-sm border-IconBorder border-r xl:mx-2.5">
139
  <!--.AI button-->
140
- <button x-data="{ filename: 'hf-logo-with-white-title.ai', imageUrl: 'images/Brand Logos/hf-logo-with-white-title.ai'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-2">
141
- <img src="images/download icon.svg" class="rounded-md bg-IconBg w-6 h-6 border border-IconBorder" alt="">
142
- <p class="text-gray-500 ">.AI</p>
143
  </button>
144
 
145
 
 
15
  document.body.removeChild(link);
16
  }
17
  </script>
18
+ <style>
19
+ .download-button {
20
+ transition: transform 0.2s;
21
+ }
22
+ .download-button:active {
23
+ transform: scale(0.80);
24
+ }
25
+ </style>
26
  <link rel="stylesheet" href="css/style.css" />
27
  <title>HFBA</title>
28
  <link rel="preconnect" href="https://fonts.googleapis.com">
 
49
  <!--Download Buttons-->
50
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
51
  <!--.PNG button-->
52
+ <button x-data="{ filename: 'Hugging Face.png', imageUrl: 'images/Brand Logos/Hugging Face.png' }" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button download-button">
53
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
54
+ <p class="text-gray-500 font-mono">.png</p>
55
  </button>
56
 
57
+ <hr class="mx-3 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
58
  <!--.SVG button-->
59
+ <button x-data="{ filename: 'hf-logo.svg', imageUrl: 'images/Brand Logos/hf-logo.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button ">
60
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
61
+ <p class="text-gray-500 font-mono">.svg</p>
62
  </button>
63
+ <hr class="mx-3 h-3 rounded-sm border-IconBorder border-r xl:mx-2.5">
64
  <!--.AI button-->
65
+ <button x-data="{ filename: 'hf-logo.ai', imageUrl: 'images/Brand Logos/hf-logo.ai'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button">
66
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
67
+ <p class="text-gray-500 font-mono">.ai</p>
68
  </button>
69
  </div>
70
  </div>
 
79
  <!--Download Buttons-->
80
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
81
  <!--.PNG button-->
82
+ <button x-data="{ filename: 'Rainbow Hugging Face.png', imageUrl: 'images/Brand Logos/Rainbow Hugging Face.png'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button">
83
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
84
+ <p class="text-gray-500 font-mono">.png</p>
85
  </button>
86
+ <hr class="mx-3 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
87
  <!--.SVG button-->
88
+ <button x-data="{ filename: 'Rainbow Hugging Face.svg', imageUrl: 'images/Brand Logos/Rainbow Hugging Face.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button ">
89
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
90
+ <p class="text-gray-500 font-mono">.svg</p>
91
  </button>
92
 
93
  </div>
 
102
  <!--Download Buttons-->
103
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
104
  <!--.PNG button-->
105
+ <button x-data="{ filename: 'hf-logo-with-title.png', imageUrl: 'images/Brand Logos/hf-logo-with-title.png' }" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button">
106
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
107
+ <p class="text-gray-500 font-mono">.png</p>
108
  </button>
109
 
110
+ <hr class="mx-3 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
111
  <!--.SVG button-->
112
+ <button x-data="{ filename: 'hf-logo-with-title.svg', imageUrl: 'images/Brand Logos/hf-logo-with-title.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button ">
113
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
114
+ <p class="text-gray-500 font-mono">.svg</p>
115
  </button>
116
+ <hr class="mx-3 h-3 rounded-sm border-IconBorder border-r xl:mx-2.5">
117
  <!--.AI button-->
118
+ <button x-data="{ filename: 'hf-logo-with-title.ai', imageUrl: 'images/Brand Logos/hf-logo-with-title.ai'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button">
119
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
120
+ <p class="text-gray-500 font-mono">.ai</p>
121
  </button>
122
  </div>
123
  </div>
 
132
  <!--Download Buttons-->
133
  <div class="flex flex-wrap gap-y-1 items-center mt-2 text-sm">
134
  <!--.PNG button-->
135
+ <button x-data="{ filename: 'hf-logo-with-white-title.png', imageUrl: 'images/Brand Logos/hf-logo-with-white-title.png' }" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button">
136
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
137
+ <p class="text-gray-500 font-mono">.png</p>
138
  </button>
139
 
140
+ <hr class="mx-3 h-3 rounded-sm border-r border-IconBorder border-xl:mx-2.5">
141
  <!--.SVG button-->
142
+ <button x-data="{ filename: 'hf-logo-with-white-title.svg', imageUrl: 'images/Brand Logos/hf-logo-with-white-title.svg'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button ">
143
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
144
+ <p class="text-gray-500 font-mono">.svg</p>
145
  </button>
146
+ <hr class="mx-3 h-3 rounded-sm border-IconBorder border-r xl:mx-2.5">
147
  <!--.AI button-->
148
+ <button x-data="{ filename: 'hf-logo-with-white-title.ai', imageUrl: 'images/Brand Logos/hf-logo-with-white-title.ai'}" x-on:click="downloadImage(imageUrl, filename)" class="flex items-center space-x-1 download-button">
149
+ <img src="images/download icon.svg" class=" w-4 h-4" alt="">
150
+ <p class="text-gray-500 font-mono">.ai</p>
151
  </button>
152
 
153