src/rocky_man/web/generator.py

@@ -279,14 +279,23 @@ class WebGenerator:
                 except ValueError:
                     continue  # Skip invalid versions
 
-            # Sort majors descending, minors descending within each major
-            major_groups = [
-                (major, sorted(major_to_minors[major], key=int, reverse=True))
-                for major in sorted(major_to_minors, key=int, reverse=True)
-            ]
+            # Sort majors ascending, minors descending within each major
+            sorted_majors = sorted(major_to_minors, key=int)
+            max_minors = max(len(major_to_minors[major]) for major in sorted_majors)
+            num_columns = len(sorted_majors)
+
+            # Create rows of versions for side-by-side display
+            version_rows = []
+            for minor_idx in range(max_minors):
+                row = []
+                for major in sorted_majors:
+                    minors_list = sorted(major_to_minors[major], key=int, reverse=True)
+                    if minor_idx < len(minors_list):
+                        row.append((major, minors_list[minor_idx]))
+                version_rows.append(row)
 
             html = template.render(
-                title="Rocky Linux Man Pages", major_groups=major_groups
+                title="Rocky Linux Man Pages", version_rows=version_rows, num_columns=num_columns
             )
 
             index_path = self.output_dir / "index.html"

templates/root.html

@@ -19,7 +19,7 @@
 
 .version-grid {
     display: grid;
-    grid-template-columns: 1fr;
+    grid-template-columns: repeat({{ num_columns }}, 1fr);
     gap: 1.5rem;
     margin-top: 2rem;
 }
@@ -161,19 +161,20 @@
 
     <div class="version-section">
         <h2>Select Version</h2>
-        {% for major, minors in major_groups %}
         <div class="version-grid">
-            {% for minor in minors %}
-            <a href="{{ major }}.{{ minor }}/index.html" class="version-card{% if not loop.first %} small{% endif %}">
+            {% for row in version_rows %}
+            {% set outer_loop = loop %}
+            {% for major, minor in row %}
+            <a href="{{ major }}.{{ minor }}/index.html" class="version-card{% if not outer_loop.first %} small{% endif %}">
                 <div class="version-number">{{ major }}.{{ minor }}</div>
-                {% if loop.first %}
+                {% if outer_loop.first %}
                 <div class="version-label">Rocky Linux</div>
                 <div class="version-browse">Browse man pages →</div>
                 {% endif %}
             </a>
             {% endfor %}
-        </div>
             {% endfor %}
         </div>
+    </div>
 </div>
 {% endblock %}