Spaces:
Running
Running
Update index.html
Browse files- index.html +60 -4
index.html
CHANGED
@@ -32,9 +32,16 @@
|
|
32 |
letter-spacing: -1px;
|
33 |
animation: fadeInDown 1.2s cubic-bezier(.18,.89,.32,1.28);
|
34 |
}
|
35 |
-
.modern-title .
|
36 |
-
|
37 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
38 |
}
|
39 |
.card-grid {
|
40 |
display: grid;
|
@@ -88,6 +95,30 @@
|
|
88 |
text-align: center;
|
89 |
animation: fadeInUp 1.1s cubic-bezier(.18,.89,.32,1.28);
|
90 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
91 |
iframe {
|
92 |
width: 100%;
|
93 |
height: 260px;
|
@@ -135,21 +166,46 @@
|
|
135 |
<body>
|
136 |
<div class="container">
|
137 |
<h1 class="modern-title">
|
138 |
-
<span class="
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
139 |
</h1>
|
140 |
|
141 |
<div class="card-grid">
|
142 |
<div class="heatmap-card">
|
143 |
<div class="heatmap-label">Kadir Nar</div>
|
144 |
<iframe src="https://cfahlgren1-model-release-heatmap.hf.space/kadirnar"></iframe>
|
|
|
|
|
|
|
|
|
145 |
</div>
|
146 |
<div class="heatmap-card">
|
147 |
<div class="heatmap-label">OpenSpeechHub</div>
|
148 |
<iframe src="https://cfahlgren1-model-release-heatmap.hf.space/OpenSpeechHub"></iframe>
|
|
|
|
|
|
|
|
|
149 |
</div>
|
150 |
<div class="heatmap-card">
|
151 |
<div class="heatmap-label">Closed-TTS</div>
|
152 |
<iframe src="https://cfahlgren1-model-release-heatmap.hf.space/Closed-TTS"></iframe>
|
|
|
|
|
|
|
|
|
153 |
</div>
|
154 |
</div>
|
155 |
</div>
|
|
|
32 |
letter-spacing: -1px;
|
33 |
animation: fadeInDown 1.2s cubic-bezier(.18,.89,.32,1.28);
|
34 |
}
|
35 |
+
.modern-title .hf-logo {
|
36 |
+
height: 2.7rem;
|
37 |
+
width: 2.7rem;
|
38 |
+
display: inline-block;
|
39 |
+
vertical-align: middle;
|
40 |
+
margin-right: 8px;
|
41 |
+
filter: drop-shadow(0 2px 12px #0005);
|
42 |
+
background: #fff;
|
43 |
+
border-radius: 50%;
|
44 |
+
padding: 3px;
|
45 |
}
|
46 |
.card-grid {
|
47 |
display: grid;
|
|
|
95 |
text-align: center;
|
96 |
animation: fadeInUp 1.1s cubic-bezier(.18,.89,.32,1.28);
|
97 |
}
|
98 |
+
.scroll-tip {
|
99 |
+
color: #aaa;
|
100 |
+
font-size: 1rem;
|
101 |
+
margin: 12px 0 0 0;
|
102 |
+
text-align: center;
|
103 |
+
letter-spacing: 0.1px;
|
104 |
+
user-select: none;
|
105 |
+
display: flex;
|
106 |
+
align-items: center;
|
107 |
+
justify-content: center;
|
108 |
+
gap: 6px;
|
109 |
+
opacity: 0.85;
|
110 |
+
animation: fadeIn 1.8s 1s both;
|
111 |
+
}
|
112 |
+
.scroll-tip .arrow {
|
113 |
+
font-size: 1.3em;
|
114 |
+
animation: arrowMove 1.2s infinite alternate cubic-bezier(.18,.89,.32,1.28);
|
115 |
+
display: inline-block;
|
116 |
+
vertical-align: middle;
|
117 |
+
}
|
118 |
+
@keyframes arrowMove {
|
119 |
+
from { transform: translateX(0);}
|
120 |
+
to { transform: translateX(12px);}
|
121 |
+
}
|
122 |
iframe {
|
123 |
width: 100%;
|
124 |
height: 260px;
|
|
|
166 |
<body>
|
167 |
<div class="container">
|
168 |
<h1 class="modern-title">
|
169 |
+
<span class="hf-logo">
|
170 |
+
<svg viewBox="0 0 40 40" width="38" height="38" xmlns="http://www.w3.org/2000/svg">
|
171 |
+
<circle cx="20" cy="20" r="20" fill="#fff" />
|
172 |
+
<g>
|
173 |
+
<ellipse cx="20" cy="20" rx="18" ry="18" fill="#ffd21e"/>
|
174 |
+
<ellipse cx="14" cy="17" rx="2.5" ry="3" fill="#fff"/>
|
175 |
+
<ellipse cx="26" cy="17" rx="2.5" ry="3" fill="#fff"/>
|
176 |
+
<ellipse cx="14" cy="17" rx="1.2" ry="1.5" fill="#222"/>
|
177 |
+
<ellipse cx="26" cy="17" rx="1.2" ry="1.5" fill="#222"/>
|
178 |
+
<path d="M13 26 q7 5 14 0" stroke="#222" stroke-width="2" fill="none" stroke-linecap="round"/>
|
179 |
+
</g>
|
180 |
+
</svg>
|
181 |
+
</span>
|
182 |
+
My Hugging Face Heatmaps
|
183 |
</h1>
|
184 |
|
185 |
<div class="card-grid">
|
186 |
<div class="heatmap-card">
|
187 |
<div class="heatmap-label">Kadir Nar</div>
|
188 |
<iframe src="https://cfahlgren1-model-release-heatmap.hf.space/kadirnar"></iframe>
|
189 |
+
<div class="scroll-tip">
|
190 |
+
<span>En güncel aktiviteler için sağa kaydırın</span>
|
191 |
+
<span class="arrow">➡️</span>
|
192 |
+
</div>
|
193 |
</div>
|
194 |
<div class="heatmap-card">
|
195 |
<div class="heatmap-label">OpenSpeechHub</div>
|
196 |
<iframe src="https://cfahlgren1-model-release-heatmap.hf.space/OpenSpeechHub"></iframe>
|
197 |
+
<div class="scroll-tip">
|
198 |
+
<span>En güncel aktiviteler için sağa kaydırın</span>
|
199 |
+
<span class="arrow">➡️</span>
|
200 |
+
</div>
|
201 |
</div>
|
202 |
<div class="heatmap-card">
|
203 |
<div class="heatmap-label">Closed-TTS</div>
|
204 |
<iframe src="https://cfahlgren1-model-release-heatmap.hf.space/Closed-TTS"></iframe>
|
205 |
+
<div class="scroll-tip">
|
206 |
+
<span>En güncel aktiviteler için sağa kaydırın</span>
|
207 |
+
<span class="arrow">➡️</span>
|
208 |
+
</div>
|
209 |
</div>
|
210 |
</div>
|
211 |
</div>
|