Update app.py

app.py

@@ -66,7 +66,7 @@ class PaperManager:
         <tr>
             <td colspan="2"></td>
             <td class="subtext">
-                <span class="score">{upvotes} points</span> by {authors} | {time_ago} | <a href="#">{comments} comments</a>
+                <span class="score">{upvotes} upvotes</span> by {authors} | {time_ago} | <a href="#">{comments} comments</a>
             </td>
         </tr>
         <tr style="height:5px"></tr>
@@ -137,15 +137,17 @@ table {
     width: 100%;
 }
 
-.title {
+.header-table {
+    width: 100%;
     background-color: #ff6600;
     padding: 2px 10px;
 }
 
-.title a {
+.header-table a {
     color: black;
     font-weight: bold;
     font-size: 14pt;
+    text-decoration: none;
 }
 
 .itemlist .athing {
@@ -186,14 +188,13 @@ table {
     text-decoration: none;
 }
 
-.more-link button {
+#refresh-button {
     background: none;
     border: none;
-    color: #0000ff;
-    text-decoration: underline;
+    color: black;
+    font-weight: bold;
+    font-size: 14pt;
     cursor: pointer;
-    font-size: 10pt;
-    padding: 0;
 }
 
 .no-papers {
@@ -203,17 +204,8 @@ table {
     font-size: 14pt;
 }
 
-#refresh-button {
-    background: none;
-    border: none;
-    color: black;
-    font-weight: bold;
-    font-size: 14pt;
-    cursor: pointer;
-}
-
 @media (max-width: 640px) {
-    .title a {
+    .header-table a {
         font-size: 12pt;
     }
 
@@ -234,32 +226,42 @@ with demo:
         # Header with Refresh Button
         with gr.Row():
             gr.HTML("""
-            <table border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="#ff6600">
+            <table border="0" cellpadding="0" cellspacing="0" class="header-table">
                 <tr>
-                    <td style="padding: 8px;">
+                    <td>
                         <span class="pagetop">
-                            <b class="hnname"><a href="#" style="color: black; text-decoration: none;">Daily Papers</a></b>
+                            <b class="hnname"><a href="#">Daily Papers</a></b>
                         </span>
                     </td>
+                    <td align="right">
+                        <button id="refresh-button">Refresh</button>
+                    </td>
                 </tr>
             </table>
             """)
-            refresh_button = gr.Button("Refresh", elem_id="refresh-button")
         # Paper list
         paper_list = gr.HTML()
         # Navigation Buttons
         with gr.Row():
             prev_button = gr.Button("Prev")
             next_button = gr.Button("Next")
-            more_button = gr.Button("More", elem_classes="more-link")
-
+    
     # Load papers on app start
     demo.load(initialize_app, outputs=[paper_list])
 
     # Button clicks
     prev_button.click(paper_manager.prev_page, outputs=[paper_list])
     next_button.click(paper_manager.next_page, outputs=[paper_list])
-    more_button.click(paper_manager.next_page, outputs=[paper_list])
+    refresh_button = gr.Button("Refresh", visible=False, elem_id="refresh-hidden")
     refresh_button.click(refresh_papers, outputs=[paper_list])
 
+    # Bind the visible Refresh button to the hidden one using JavaScript
+    gr.HTML("""
+    <script>
+    document.getElementById('refresh-button').addEventListener('click', function() {
+        document.getElementById('refresh-hidden').click();
+    });
+    </script>
+    """)
+
 demo.launch()