Hugging Face's logo

Spaces:
kadirnar
/
Personal-Activity
Running

App Files Community
1
kadirnar commited on
Commit
90a3beb
·
verified ·
1 Parent(s): 6022220

Update index.html

Browse files
Files changed (1) hide show
  1. 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 .emoji {
36
- font-size: 2.3rem;
37
- margin-right: 6px;
 
 
 
 
 
 
 
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="emoji">🤗</span> My Hugging Face Heatmaps
 
 
 
 
 
 
 
 
 
 
 
 
 
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>