clean

app.py

@@ -354,83 +354,6 @@ APPLE_CSS = """
     color: #1d1d1f !important;
 }
 
-/* Header — two-column: title left, intro + links right. Compact so the whole
-   form + image fit on one screen without scrolling. */
-#app-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 40px;
-    padding: 28px 8px 18px 8px;
-}
-.header-left { flex-shrink: 0; }
-.header-left h1 {
-    font-size: 46px;
-    font-weight: 700;
-    letter-spacing: -0.025em;
-    margin: 0;
-    /* line-height needs headroom for descenders (g/p/y) — at 1.0 the gradient
-       text mask clips them. 1.2 gives clean rendering without adding extra
-       visual whitespace because the H1 has no following sibling. */
-    line-height: 1.2;
-    padding-bottom: 2px;
-    /* Apple-Intelligence-style gradient: system blue → indigo → purple → pink.
-       Background is animated very slowly for a subtle "alive" feel. */
-    background: linear-gradient(
-        120deg,
-        #0071e3 0%,
-        #5e5ce6 35%,
-        #af52de 70%,
-        #ff375f 100%
-    );
-    background-size: 200% 200%;
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-    background-clip: text;
-    animation: title-shimmer 12s ease-in-out infinite;
-}
-@keyframes title-shimmer {
-    0%, 100% { background-position: 0% 50%; }
-    50%      { background-position: 100% 50%; }
-}
-.header-right {
-    flex: 1;
-    text-align: right;
-    max-width: 640px;
-}
-.header-right .subtitle {
-    color: #6e6e73;
-    font-size: 15px;
-    font-weight: 400;
-    line-height: 1.5;
-    margin: 0 0 10px 0;
-}
-.header-right .links {
-    display: flex;
-    justify-content: flex-end;
-    gap: 22px;
-    flex-wrap: wrap;
-    font-size: 13px;
-}
-.header-right .links a {
-    color: #0071e3;
-    text-decoration: none;
-    font-weight: 500;
-    transition: opacity 0.15s ease;
-}
-.header-right .links a:hover { opacity: 0.7; }
-
-@media (max-width: 820px) {
-    #app-header {
-        flex-direction: column;
-        align-items: flex-start;
-        gap: 14px;
-        padding: 24px 8px 14px 8px;
-    }
-    .header-right { text-align: left; max-width: none; }
-    .header-right .links { justify-content: flex-start; }
-}
-
 /* Cards / panels */
 .panel-card {
     background: #ffffff !important;
@@ -608,17 +531,27 @@ textarea:focus, input:focus,
     color: #0071e3;
     text-decoration: none;
     font-weight: 500;
+    transition: opacity 0.15s ease;
 }
 .tagline a:hover { opacity: 0.7; }
 
+/* Footer links row (HuggingFace / GitHub / Twitter) */
+.footer-links {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 26px;
+    flex-wrap: wrap;
+    font-size: 13px;
+    margin: 24px 0 18px 0;
+}
+
 /* Hide gradio's default footer for a cleaner look */
 footer { display: none !important; }
 
 /* Mobile */
 @media (max-width: 640px) {
-    #app-header { padding: 32px 16px 16px 16px; }
-    #app-header h1 { font-size: 32px; }
-    #app-header p.subtitle { font-size: 15px; }
+    .footer-links { gap: 18px; font-size: 12px; }
 }
 """
 
@@ -673,24 +606,6 @@ def create_ui():
         theme=APPLE_THEME,
         css=APPLE_CSS,
     ) as demo:
-        gr.HTML(
-            """
-            <div id="app-header">
-                <div class="header-left">
-                    <h1>HiDream-O1-Image</h1>
-                </div>
-                <div class="header-right">
-                    <p class="subtitle">A natively unified pixel-space image generative model.</p>
-                    <div class="links">
-                        <a href="https://huggingface.co/HiDream-ai/HiDream-O1-Image" target="_blank">HuggingFace</a>
-                        <a href="https://github.com/HiDream-ai/HiDream-O1-Image" target="_blank">GitHub</a>
-                        <a href="https://x.com/vivago_ai" target="_blank">Twitter</a>
-                    </div>
-                </div>
-            </div>
-            """
-        )
-
         with gr.Row(equal_height=False):
             with gr.Column(scale=1, elem_classes=["panel-card"]):
                 prompt = gr.Textbox(
@@ -852,9 +767,10 @@ def create_ui():
 
         gr.HTML(
             """
-            <div class="tagline">
-                For more features and the full experience, visit
-                <a href="https://vivago.ai/" target="_blank">vivago.ai</a>.
+            <div class="tagline footer-links">
+                <a href="https://huggingface.co/HiDream-ai/HiDream-O1-Image" target="_blank">HuggingFace</a>
+                <a href="https://github.com/HiDream-ai/HiDream-O1-Image" target="_blank">GitHub</a>
+                <a href="https://x.com/vivago_ai" target="_blank">Twitter</a>
             </div>
             """
         )