login

app.py

@@ -231,93 +231,6 @@ def generate_graphs_btn(annotations):
     frequency_graph = detection.generate_frequency_graph(annotations)
     return individual_graphs
 
-css = """
-
-@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&family=Montserrat:wght@700&family=Open+Sans&family=Poppins:wght@300;400;500;600;700;800&display=swap');
-
-header{
-    padding: 0 80px;
-    height: calc(100vh-80px);
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-}
-
-header .left h1 {
-    font-size: 80px;
-    display: flex;
-    justify-content: center;
-    margin-top: 17rem;
-    
-}
-
-header .left span{
-    font-size: 80px;
-    color: #083484;
-    display: flex;
-    justify-content: center;
-
-}
-header .left .second-line{
-    font-size: 80px;
-    color: #083484;
-    display: flex;
-    justify-content: center;
-    font-weight: 400;
-
-}
-
-header .left p{
-    margin-top: 35px;
-    font-stretch: ultra-condensed;
-    color: #777;
-    display: flex;
-    justify-content: center;
-    text-align: center;
-    margin-bottom: 10px;
-}
-
-header .left a{
-    display: flex;
-    align-items: center;
-    background: #083484;
-    width: 150px;
-    padding: 8px;
-    border-radius: 60px;
-}
-
-header .left a i{
-    background-color: #fff;
-    font-size: 24px;
-    border-radius: 50%;
-    padding: 8px;
-}
-
-header .left a span{
-    color: #fff;
-    margin-left: 22px;
-}
-
-.container {
-    padding:30px;
-    text-align: center;
-    overflow: auto;
-    margin-top: 500px;
-}
-
-.sub-header {
-    font-size: 4em;
-    text-align: center;
-    color: #083484;
-    font-family: 'Montserrat',sans-serif;
-}
-
-
-
-
-"""
-
-
 
 js_func = """
 function refresh() {
@@ -341,7 +254,7 @@ def login_auth(username, password):
 
 
 # Gradio interface components
-with gr.Blocks(css=css,js=js_func) as demo:
+with gr.Blocks(js=js_func) as demo:
 
      # State variable to track login status
     login_successful = gr.State(value=False)  
@@ -349,7 +262,92 @@ with gr.Blocks(css=css,js=js_func) as demo:
     
 
     with gr.Row(visible=False) as header_row:
-        gr.HTML("""             
+        gr.HTML("""     
+
+
+        <style>
+            @import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&family=Montserrat:wght@700&family=Open+Sans&family=Poppins:wght@300;400;500;600;700;800&display=swap');
+
+            header{
+                padding: 0 80px;
+                height: calc(100vh-80px);
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+            }
+
+            header .left h1 {
+                font-size: 80px;
+                display: flex;
+                justify-content: center;
+                margin-top: 17rem;
+                
+            }
+
+            header .left span{
+                font-size: 80px;
+                color: #083484;
+                display: flex;
+                justify-content: center;
+
+            }
+            header .left .second-line{
+                font-size: 80px;
+                color: #083484;
+                display: flex;
+                justify-content: center;
+                font-weight: 400;
+
+            }
+
+            header .left p{
+                margin-top: 35px;
+                font-stretch: ultra-condensed;
+                color: #777;
+                display: flex;
+                justify-content: center;
+                text-align: center;
+                margin-bottom: 10px;
+            }
+
+            header .left a{
+                display: flex;
+                align-items: center;
+                background: #083484;
+                width: 150px;
+                padding: 8px;
+                border-radius: 60px;
+            }
+
+            header .left a i{
+                background-color: #fff;
+                font-size: 24px;
+                border-radius: 50%;
+                padding: 8px;
+            }
+
+            header .left a span{
+                color: #fff;
+                margin-left: 22px;
+            }
+
+            .container {
+                padding:30px;
+                text-align: center;
+                overflow: auto;
+                margin-top: 500px;
+            }
+
+            .sub-header {
+                font-size: 4em;
+                text-align: center;
+                color: #083484;
+                font-family: 'Montserrat',sans-serif;
+            }
+                            
+        
+                
+        </style>        
 
         <header>
             <div class="left">
@@ -461,6 +459,10 @@ with gr.Blocks(css=css,js=js_func) as demo:
 
                 with gr.Column(scale=2):
                     gr.Markdown("")
+     # Footer Row
+    with gr.Row():
+        with gr.Column(scale=4):
+            gr.HTML('<center><i>© 2024 OIS AI Defect Detection Model</center>')