📱 Improve mobile responsiveness of conference rail (#16196)

docs/en/docs/css/custom.css

@@ -507,7 +507,34 @@ Inspired by Termynal's CSS tricks with modifications
   outline-offset: 2px;
 }
 
-.md-sidebar--primary:has(.fastapi-conf-rail) { position: static; }
+.fastapi-conf-rail--mobile {
+  display: none;
+}
+
+@media screen and (max-width: 76.234375em) {
+  .fastapi-conf-rail:not(.fastapi-conf-rail--mobile) {
+    display: none;
+  }
+
+  .md-typeset .fastapi-conf-rail--mobile {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) auto;
+    margin: 0 0 1.25rem;
+    text-decoration: none;
+  }
+
+  .fastapi-conf-rail--mobile .fastapi-conf-rail__summary {
+    display: none;
+  }
+
+  .fastapi-conf-rail--mobile .fastapi-conf-rail__cta {
+    grid-column: 2;
+    grid-row: 1 / 4;
+    align-self: center;
+    margin: 0 0 0 0.8rem;
+    white-space: nowrap;
+  }
+}
 
 .fastapi-feature-banner {
   display: block;

docs/en/overrides/main.html

@@ -44,6 +44,14 @@
   {% endif %}
 {% endblock %}
 
+{% block content %}
+  {% if not page.url %}
+    {% set conf_rail_mobile = true %}
+    {% include "partials/conf-rail.html" %}
+  {% endif %}
+  {% include "partials/content.html" %}
+{% endblock %}
+
 {% block announce %}
 <div class="announce-wrapper">
   <div id="announce-left">

docs/en/overrides/partials/conf-rail.html

@@ -1,4 +1,4 @@
-<a class="fastapi-conf-rail no-link-icon" href="https://fastapiconf.com" target="_blank" rel="noopener">
+<a class="fastapi-conf-rail{% if conf_rail_mobile | default(false) %} fastapi-conf-rail--mobile{% endif %} no-link-icon" href="https://fastapiconf.com" target="_blank" rel="noopener">
   <span class="fastapi-conf-rail__eyebrow">FastAPI Conf '26</span>
   <span class="fastapi-conf-rail__date">October 28, 2026</span>
   <span class="fastapi-conf-rail__place">Amsterdam, NL</span>