Add new styles

app.py

@@ -100,10 +100,70 @@ def greet(label, video0, video1):
     return results
 
 
-label = gr.outputs.Label(num_top_classes=5)
+label = gr.outputs.Label(num_top_classes=5, label="Top class probabilities")
 demo = gr.Interface(fn=greet, inputs=[gr.Dropdown(["Webcam", "Video"], label="Please select the input type:"), gr.Video(source="webcam", label="Webcam recording"), gr.Video(label="Video upload")], outputs=label,
                     title="SPOTER Sign language recognition",
-                    description="Lightweight and accurate sign langage recogniton right in your browser.",
-                    article="This is joint work of Matyas Bohacek and Zhuo Cao. For more info, visit [our website.](https://www.signlanguagerecognition.com)")
+                    description="",
+                    article="This is joint work of [Matyas Bohacek](https://scholar.google.cz/citations?user=wDy1xBwAAAAJ) and [Zhuo Cao](https://www.linkedin.com/in/zhuo-cao-b0787a1aa/?originalSubdomain=hk). For more info, visit [our website.](https://www.signlanguagerecognition.com)",
+                    css="""
+                            @font-face {
+                                font-family: Graphik;
+                                font-weight: regular;
+                                src: url("https://www.signlanguagerecognition.com/supplementary/GraphikRegular.otf") format("opentype");
+                            }
+
+                            @font-face {
+                                font-family: Graphik;
+                                font-weight: bold;
+                                src: url("https://www.signlanguagerecognition.com/supplementary/GraphikBold.otf") format("opentype");
+                            }
+
+                            @font-face {
+                                font-family: MonumentExpanded;
+                                font-weight: regular;
+                                src: url("https://www.signlanguagerecognition.com/supplementary/MonumentExtended-Regular.otf") format("opentype");
+                            }
+
+                            @font-face {
+                                font-family: MonumentExpanded;
+                                font-weight: bold;
+                                src: url("https://www.signlanguagerecognition.com/supplementary/MonumentExtended-Bold.otf") format("opentype");
+                            }
+
+                            html {
+                                font-family: "Graphik";
+                            }   
+
+                            h1 {
+                                font-family: "MonumentExpanded";
+                            }
+
+                            #12 {
+        -                       background-image: linear-gradient(to left, #61D836, #6CB346) !important;
+                                background-color: #61D836 !important;
+                            }
+
+                            #12:hover {
+        -                       background-image: linear-gradient(to left, #61D836, #6CB346) !important;
+                                background-color: #6CB346 !important;
+                                border: 0 !important;
+                                border-color: 0 !important;
+                            }
+
+                            .dark .gr-button-primary {
+                                --tw-gradient-from: #61D836;
+                                --tw-gradient-to: #6CB346;
+                                border: 0 !important;
+                                border-color: 0 !important;
+                            }
+
+                            .dark .gr-button-primary:hover {
+                                --tw-gradient-from: #64A642;
+                                --tw-gradient-to: #58933B;
+                                border: 0 !important;
+                                border-color: 0 !important;
+                            }
+                           """
+                    )
 
 demo.launch()