Hugging Face's logo

Spaces:
marquesafonso
/
multilang-asr-captioner
Sleeping

App Files Community
marquesafonso commited on
Commit
8a3e157
·
1 Parent(s): 84b4e4e

add footer to html

Browse files
Files changed (2) hide show
  1. static/landing_page.html +38 -0
  2. static/submit_video.html +34 -0
static/landing_page.html CHANGED
@@ -1,6 +1,7 @@
1
  <!DOCTYPE html>
2
  <html>
3
  <head>
 
4
  <style>
5
  /* CSS Styles */
6
  body {
@@ -64,6 +65,37 @@
64
  .button.docs:hover {
65
  background-color: #007BAA;
66
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
67
  /* Responsiveness */
68
  @media (max-width: 768px) {
69
  .container {
@@ -115,5 +147,11 @@
115
  <a href="/submit_video" class="button submit">Submit Video</a>
116
  <a href="/docs" class="button docs">Documentation</a>
117
  </div>
 
 
 
 
 
 
118
  </body>
119
  </html>
 
1
  <!DOCTYPE html>
2
  <html>
3
  <head>
4
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" integrity="sha512-Fo3rlrZj/k7ujTnHg4CGR2D7kSs0v4LLanw2qksYuRlEzO+tcaEPQogQ0KaoGN26/zrn20ImR1DfuLWnOo7aBA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
5
  <style>
6
  /* CSS Styles */
7
  body {
 
65
  .button.docs:hover {
66
  background-color: #007BAA;
67
  }
68
+
69
+ .footer {
70
+ width: 100%;
71
+ background-color: #f0f0f0;
72
+ padding: 20px 0;
73
+ position: absolute;
74
+ bottom: 5rem;
75
+ text-align: center;
76
+ }
77
+
78
+ .footer a {
79
+ margin: 0 10px;
80
+ padding: 5rem;
81
+ text-decoration: none;
82
+ }
83
+ .fa-github:hover {
84
+ transform: scale(1.2)
85
+ }
86
+ .fa-github:hover {
87
+ transform: scale(1.2)
88
+ }
89
+ .fa-github{
90
+ color: #000000
91
+ }
92
+ .fa-linkedin:hover {
93
+ transform: scale(1.2)
94
+ }
95
+ .fa-linkedin {
96
+ color: #0077B5
97
+ }
98
+
99
  /* Responsiveness */
100
  @media (max-width: 768px) {
101
  .container {
 
147
  <a href="/submit_video" class="button submit">Submit Video</a>
148
  <a href="/docs" class="button docs">Documentation</a>
149
  </div>
150
+ <!-- Footer -->
151
+ <div class="footer">
152
+ <p>Created by:</p>
153
+ <a href="https://github.com/marquesafonso" class="github"><i class="fab fa-github fa-4x"></i></a>
154
+ <a href="https://www.linkedin.com/in/marquesafonso" class="linkedin"><i class="fab fa-linkedin fa-4x"></i></a>
155
+ </div>
156
  </body>
157
  </html>
static/submit_video.html CHANGED
@@ -1,6 +1,7 @@
1
  <!DOCTYPE html>
2
  <html>
3
  <head>
 
4
  <style>
5
  /* CSS Styles */
6
  body {
@@ -17,6 +18,7 @@
17
  background: #ffffff;
18
  border-radius: 8px;
19
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
 
20
  }
21
 
22
  input[type=file],
@@ -50,6 +52,32 @@
50
  display: block;
51
  }
52
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
53
  /* Additional Responsiveness */
54
  @media (max-width: 768px) {
55
  form {
@@ -69,5 +97,11 @@
69
  Text color: <input type="text" name="text_color" value="white"><br>
70
  <input type="submit">
71
  </form>
 
 
 
 
 
 
72
  </body>
73
  </html>
 
1
  <!DOCTYPE html>
2
  <html>
3
  <head>
4
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" integrity="sha512-Fo3rlrZj/k7ujTnHg4CGR2D7kSs0v4LLanw2qksYuRlEzO+tcaEPQogQ0KaoGN26/zrn20ImR1DfuLWnOo7aBA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
5
  <style>
6
  /* CSS Styles */
7
  body {
 
18
  background: #ffffff;
19
  border-radius: 8px;
20
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
21
+ padding-bottom: 1rem;
22
  }
23
 
24
  input[type=file],
 
52
  display: block;
53
  }
54
 
55
+ .footer {
56
+ width: 100%;
57
+ background-color: #f0f0f0;
58
+ padding: 0;
59
+ position: absolute;
60
+ text-align: center;
61
+ }
62
+
63
+ .footer a {
64
+ margin: 0 10px;
65
+ padding: 5rem;
66
+ text-decoration: none;
67
+ }
68
+
69
+ .fa-github:hover {
70
+ transform: scale(1.2)
71
+ }
72
+ .fa-github{
73
+ color: #000000
74
+ }
75
+ .fa-linkedin:hover {
76
+ transform: scale(1.2)
77
+ }
78
+ .fa-linkedin {
79
+ color: #0077B5
80
+ }
81
  /* Additional Responsiveness */
82
  @media (max-width: 768px) {
83
  form {
 
97
  Text color: <input type="text" name="text_color" value="white"><br>
98
  <input type="submit">
99
  </form>
100
+ <!-- Footer -->
101
+ <div class="footer">
102
+ <p>Created by:</p>
103
+ <a href="https://github.com/marquesafonso" class="github"><i class="fab fa-github fa-3x"></i></a>
104
+ <a href="https://www.linkedin.com/in/marquesafonso" class="linkedin"><i class="fab fa-linkedin fa-3x"></i></a>
105
+ </div>
106
  </body>
107
  </html>