Add swe-smith details

Author: carlosejimenez

css/components.css

@@ -434,6 +434,22 @@ button:focus,
   border-left: 4px solid transparent;
 }
 
+/* Announcement container */
+.announcement-container {
+  background-color: var(--color-accent-light);
+  border: 1.5px solid var(--color-accent);
+  padding: 1rem;
+  margin-bottom: 1.5rem;
+  border-radius: 0.25rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.announcement-container p {
+  margin-bottom: 0;
+}
+
 .alert-info {
   background-color: var(--color-accent-light);
   border-left-color: var(--color-accent);

css/pages.css

@@ -100,6 +100,17 @@
   display: none;
 }
 
+.tabcontent .table-responsive {
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+@media (max-height: 700px) {
+  .tabcontent .table-responsive {
+    max-height: 50vh;
+  }
+}
+
 .leaderboard-tab-list {
   display: flex;
   gap: 0.5rem;
@@ -659,4 +670,27 @@ code {
   -webkit-filter: none;
   -moz-filter: none;
   transform: none;
+}
+
+/* Contact page styles */
+.contact-container {
+    max-width: 600px;
+    margin: 3rem auto;
+    text-align: center;
+}
+
+.contact-container p {
+    font-size: 1.1rem;
+    margin-bottom: 1.5rem;
+    line-height: 1.6;
+}
+
+.contact-container a {
+    color: var(--color-primary);
+    text-decoration: none;
+    font-weight: bold;
+}
+
+.contact-container a:hover {
+    text-decoration: underline;
 } 

img/swe-smith-icon.svg

@@ -26,6 +26,7 @@
             <li><a href="citations.html" class="nav-link" data-page="citations">Citations</a></li>
             <li class="nav-section-title">The SWE-bench Family</li>
             <li><a href="https://swe-agent.com/latest/" class="nav-link" data-page="swe-agent"><img src="img/swe-agent-icon.svg" alt="SWE-agent icon" class="sidebar-family-icon">SWE-agent <i class="fas fa-external-link-alt"></i></a></li>
+            <li><a href="https://swesmith.com/" class="nav-link" data-page="swe-smith"><img src="img/swe-smith-icon.svg" alt="SWE-smith icon" class="sidebar-family-icon">SWE-smith <i class="fas fa-external-link-alt"></i></a></li>
             <li><a href="https://swe-rex.com/latest/" class="nav-link" data-page="swe-rex"><img src="img/swe-rex-icon.svg" alt="SWE-ReX icon" class="sidebar-family-icon">SWE-ReX <i class="fas fa-external-link-alt"></i></a></li>
             <li><a href="https://swebench.com/sb-cli/" class="nav-link" data-page="sb-cli"><img src="img/sb-cli-icon.svg" alt="SWE-bench CLI icon" class="sidebar-family-icon">SWE-bench CLI <i class="fas fa-external-link-alt"></i></a></li>
         </ul>

templates/_sidebar.html

@@ -4,29 +4,6 @@
 
 {% block head_extra %}
     <link rel="icon" href="favicon.ico" type="image/x-icon">
-    <style>
-        .contact-container {
-            max-width: 600px;
-            margin: 3rem auto;
-            text-align: center;
-        }
-        
-        .contact-container p {
-            font-size: 1.1rem;
-            margin-bottom: 1.5rem;
-            line-height: 1.6;
-        }
-        
-        .contact-container a {
-            color: var(--color-primary);
-            text-decoration: none;
-            font-weight: bold;
-        }
-        
-        .contact-container a:hover {
-            text-decoration: underline;
-        }
-    </style>
 {% endblock %}
 
 {% block content %}

templates/pages/contact.html

@@ -4,18 +4,6 @@
 
 {% block head_extra %}
     <link rel="icon" href="favicon.ico" type="image/x-icon">
-    <style>
-        .tabcontent .table-responsive {
-            max-height: 60vh;
-            overflow-y: auto;
-        }
-        
-        @media (max-height: 700px) {
-            .tabcontent .table-responsive {
-                max-height: 50vh;
-            }
-        }
-    </style>
 {% endblock %}
 
 {% block js_files %}
@@ -39,6 +27,19 @@
     </header>
 
     <section class="container">
+
+        <a href="https://swesmith.com/">
+            <div class="announcement-container">
+                <p><img src="img/swe-smith-icon.svg" alt="SWE-smith icon" class="sidebar-family-icon"> Our new paper SWE-smith is out! Train your own models for software engineering agents. </p>
+            </div>
+        </a>
+
+        <a href="https://github.com/SWE-agent/SWE-agent">
+            <div class="announcement-container">
+                <p><img src="img/swe-agent-icon.svg" alt="SWE-agent icon" class="sidebar-family-icon"> SWE-agent 1.0 is the open source SOTA on SWE-bench Lite!</p>
+            </div>
+        </a>
+
         <div class="content-section" id="leaderboard">
             <h2>All Leaderboards</h2>
             <div class="leaderboard-tabs">