Hugging Face's logo

Spaces:
senthil3226w
/
fastapi_dummy
Sleeping

App Files Community
senthil3226w commited on
Commit
cb7d288
·
verified ·
1 Parent(s): ecf3782

Update templates/result.html

Browse files
Files changed (1) hide show
  1. templates/result.html +52 -6
templates/result.html CHANGED
@@ -2,16 +2,62 @@
2
  <html lang="en">
3
  <head>
4
  <meta charset="UTF-8">
5
- <title>Interpolation Result</title>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
6
  </head>
7
  <body>
8
- <h1>Interpolated Frames</h1>
9
- <div style="display: flex; flex-wrap: wrap;">
 
10
 
11
- <img src="data:image/png;base64,{{ frames }}" alt="Interpolated frame" style="margin: 5px; width: 100px; height: auto;">
 
 
 
 
12
 
 
13
  </div>
14
- <br>
15
- <a href="/">Go Back</a>
16
  </body>
17
  </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>Interpolated Frames</title>
7
+ <style>
8
+ body {
9
+ font-family: Arial, sans-serif;
10
+ text-align: center;
11
+ background-color: #f4f4f9;
12
+ }
13
+ .container {
14
+ margin: 20px auto;
15
+ width: 80%;
16
+ }
17
+ h1 {
18
+ color: #333;
19
+ }
20
+ .frame-container {
21
+ display: flex;
22
+ flex-wrap: wrap;
23
+ gap: 10px;
24
+ justify-content: center;
25
+ }
26
+ .frame-container img {
27
+ max-width: 100%;
28
+ height: auto;
29
+ border: 1px solid #ddd;
30
+ padding: 5px;
31
+ background-color: white;
32
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
33
+ border-radius: 8px;
34
+ }
35
+ .back-link {
36
+ margin-top: 20px;
37
+ display: inline-block;
38
+ padding: 10px 15px;
39
+ color: white;
40
+ background-color: #007bff;
41
+ text-decoration: none;
42
+ border-radius: 5px;
43
+ }
44
+ .back-link:hover {
45
+ background-color: #0056b3;
46
+ }
47
+ </style>
48
  </head>
49
  <body>
50
+ <div class="container">
51
+ <h1>Interpolated Frames</h1>
52
+ <p>Here are the frames generated between the two uploaded images:</p>
53
 
54
+ <div class="frame-container">
55
+ {% for frame in frames %}
56
+ <img src="data:image/png;base64,{{ frame }}" alt="Interpolated Frame">
57
+ {% endfor %}
58
+ </div>
59
 
60
+ <a href="/" class="back-link">Back to Upload</a>
61
  </div>
 
 
62
  </body>
63
  </html>