Move to top

app.py

@@ -213,8 +213,8 @@ message = "{} <br><br> Generate a phase diagram for a set of elements using LeMa
     warning_message
 )
 
-footer_content = """
-<div style="text-align: center; font-size: 14px; line-height: 1.6; padding: 20px 0">
+message += """
+<div style="font-size: 14px; line-height: 1.6; padding: 20px 0">
     <p>
         This web app is powered by 
         <a href="https://github.com/materialsproject/crystaltoolkit" target="_blank" style="text-decoration: none;">Crystal Toolkit</a>, 
@@ -225,6 +225,11 @@ footer_content = """
         <a href="https://next-gen.materialsproject.org/" target="_blank" style="text-decoration: none;">Materials Project</a>. 
         We are grateful for their open-source software packages. This app is intended for data exploration in LeMat-Bulk and is not affiliated with or endorsed by the Materials Project.
     </p>
+</div>
+"""
+
+footer_content = """
+<div style="font-size: 14px; line-height: 1.6; padding: 20px 0; text-align: center;">
     <hr style="border-top: 1px solid #ddd; margin: 10px 0;">
     <p>
         <strong>CC-BY-4.0</strong> requires proper acknowledgement. If you use materials data with an immutable_id starting with <code>mp-</code>, please cite the 
@@ -243,8 +248,6 @@ footer_content = """
 </div>
 """
 
-footer = gr.Markdown(footer_content)
-
 # Create Gradio interface
 iface = gr.Interface(
     fn=create_phase_diagram,
@@ -259,8 +262,8 @@ iface = gr.Interface(
     outputs=gr.Plot(label="Phase Diagram", elem_classes="plot-out"),
     css=".plot-out {background-color: #ffffff;}",
     title="LeMaterial - Phase Diagram Viewer",
-    article=footer_content,
     description=message,
+    article=footer_content,
 )
 
 # Launch the app