rocky-fy the theme

static/rocky/mirrormanager2.css

@@ -31,7 +31,9 @@ form.icon button {
 }
 
 /* Stealed this from bootstrap */
-label, select, button,
+label,
+select,
+button,
 input[type="button"],
 input[type="reset"],
 input[type="submit"],
@@ -41,31 +43,33 @@ input[type="checkbox"] {
 }
 
 .blue {
-    color:#0066CC;
+    color: #0066cc;
 }
 
 #matrixtitle {
-    background-color: #2963A6;
+    background-color: #2963a6;
-    color: #FFFFFF;
+    color: #ffffff;
     text-align: center;
 }
 
-#matrixheadings, #matrixheadings th {
+#matrixheadings,
-    background-color: #DDDDDD;
+#matrixheadings th {
-    border-bottom: 1px solid #BBBBBB;
+    background-color: #dddddd;
+    border-bottom: 1px solid #bbbbbb;
     margin: 0;
     color: #333333;
-    text-align: center;
 }
 
-.matrix_section, .matrix_section td {
+.matrix_section,
-    border-bottom: 1px solid #BBBBBB !important;
+.matrix_section td {
+    border-bottom: 1px solid #bbbbbb !important;
 }
 
-.matrix_even, .matrix_even td {
+.matrix_even,
-    background-color: #F0F0F0;
+.matrix_even td {
-    border-bottom: 1px solid #DDDDDD;
+    background-color: #f0f0f0;
-    border-top: 1px solid #DDDDDD;
+    border-bottom: 1px solid #dddddd;
+    border-top: 1px solid #dddddd;
 }
 
 .centered {
@@ -76,10 +80,9 @@ input[type="checkbox"] {
 }
 
 .bodycontent {
-    min-height:600px
+    min-height: 600px;
 }
 
-
 table.mm2-table-small {
     width: auto;
 }

templates/rocky/_macros.html

@@ -30,9 +30,9 @@
 {% endmacro %}
 
 {% macro footer() %}
-<div class="footer py-5 text-white">
+<div class="footer py-5">
     <div class="container">
-        <div class="row footerlinks justify-content-center">
+        <div class="row footerlinks">
             <div class="col-sm-3 col-4 mt-3">
                 <div>
                     <dl>
@@ -67,17 +67,16 @@
                 </div>
             </div>
         </div>
-        <div class="row footerlinks">
+        <div class="row footerlinks mt-5">
-            <div class="col-12 text-center">
+            <div class="col-12">
                 <p> © 2024 Rocky Enterprise Software Foundation, and others. </p>
             </div>
-            <div class="col-12 text-center">
+            <div class="col-12">
                 {% set noggin_link %}
                     <a href="https://github.com/fedora-infra/noggin">noggin</a>
                 {% endset %}
                 <p>
                 <a href="https://github.com/fedora-infra/mirrormanager2/">mirrormanager</a>
-                -- {{version}}
                 -- <a href="http://mirrormanager.rtfd.org" rel="noopener noreferrer"
                         target="_blank">Documentation</a>
                 -- <a href="http://mirrormanager.readthedocs.org/en/latest/contributors.html">Authors</a></p>
@@ -108,7 +107,6 @@ href="{{ url_for('static', filename='favicon.ico')}}"/>
 <link rel="stylesheet" type="text/css" media="screen"
 href="{{ url_for('static', filename='mirrormanager2.css') }}"/>
 <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='rocky.css') }}"/>
-<link href="{{ url_for('static', filename='fedora-bootstrap/fedora-bootstrap.min.css') }}" rel="stylesheet" />
 <link href="{{ url_for('static', filename='fonts/open-sans.css') }}" rel="stylesheet" />
 <link href="{{ url_for('static', filename='fonts/font-awesome.css') }}" rel="stylesheet" />
 {% endmacro %}
@@ -124,8 +122,8 @@ href="{{ url_for('static', filename='mirrormanager2.css') }}"/>
 {%endmacro%}
 
 {% macro nav(is_admin) %}
-<nav class="navbar navbar-expand-lg navbar-light masthead py-2">
+<nav class="navbar navbar-expand-lg navbar-light masthead py-2 container">
-    <a class="navbar-brand" href="{{url_for('base.index')}}"><img src="{{ url_for('static', filename='mirrormanager-logo.png') }}" alt="Fedora Account System logo" height="40"></a>
+    <a class="navbar-brand" href="{{url_for('base.index')}}"><img src="{{ url_for('static', filename='mirrormanager-logo.png') }}" alt="Fedora Account System logo" height="60"></a>
     <ul class="navbar-nav align-items-center ms-auto">
         <li class="nav-item">
           <a class="nav-link color-white" href="{{url_for('base.list_mirrors')}}">Mirrors</a>
@@ -160,7 +158,7 @@ href="{{ url_for('static', filename='mirrormanager2.css') }}"/>
             </div>
         </li>
         {% else %}
-        <a class="btn btn-primary ml-2" href="{{ url_for('auth.login') }}?next={{request.url}}">Login</a>
+        <a class="btn btn-primary ml-2 py-2 rounded-4" href="{{ url_for('auth.login') }}?next={{request.url}}">Login</a>
         {% endif %}
     </ul>
   </nav>

templates/rocky/index.html

@@ -4,7 +4,7 @@
 {%block tag %}home{% endblock %}
 
 {% block content %}
-<h2>Rocky Public Active Mirrors</h2>
+<h2 class="h1 mb-4">Rocky Public Active Mirrors</h2>
 
 <p>
 Rocky Linux is distributed to millions of systems globally.
@@ -34,14 +34,8 @@ I2 means both Internet2 and its peer high speed research and development
 networks globally.
 </p>
 
-
+<table class="table table-sm mt-5">
-<table class="table table-sm">
+<tr id="matrixheadings">
-<tr id="matrixtitle">
-  <th colspan="{{ arches | length + 2 }}">
-    Mirror list filtering matrix
-  </th>
-</tr>
-<tr id="matrixheadings" >
   <th>Projects</th>
   <th>Versions</th>
   <th colspan="{{ arches | length}}">

templates/rocky/rocky.css

@@ -17,7 +17,7 @@ main {
 /* Prose */
 .prose code,
 .prose strong {
-  @apply dark:text-gray-300;
+    @apply dark:text-gray-300;
 }
 .prose h1,
 .prose h2,
@@ -25,23 +25,36 @@ main {
 .prose h4,
 .prose h5,
 .prose h6 {
-  @apply dark:text-white;
+    @apply dark:text-white;
 }
 .prose a {
-  @apply text-green-600;
+    @apply text-green-600;
 }
 
 .prose blockquote {
-  @apply dark:text-white;
+    @apply dark:text-white;
 }
 
 .prose img {
-  @apply rounded-md;
+    @apply rounded-md;
 }
 
-[type='text'], [type='email'], [type='url'], [type='password'], [type='number'], [type='date'], [type='datetime-local'], [type='month'], [type='search'], [type='tel'], [type='time'], [type='week'], [multiple], textarea, select {
+[type="text"],
-  @apply
+[type="email"],
-    rounded-md bg-gray-100 dark:bg-gray-700
+[type="url"],
+[type="password"],
+[type="number"],
+[type="date"],
+[type="datetime-local"],
+[type="month"],
+[type="search"],
+[type="tel"],
+[type="time"],
+[type="week"],
+[multiple],
+textarea,
+select {
+    @apply rounded-md bg-gray-100 dark:bg-gray-700
     dark:border-gray-600 border-gray-300 border-2
     py-2 px-3
     focus:outline-none focus:ring focus:ring-2 focus:border-green-600 focus:ring-green-500
@@ -49,15 +62,15 @@ main {
 }
 
 .form-group label {
-  @apply text-sm font-medium mb-2;
+    @apply text-sm font-medium mb-2;
 }
 .form-group .check-box input {
-  @apply rounded-md bg-gray-100 dark:bg-gray-700
+    @apply rounded-md bg-gray-100 dark:bg-gray-700
     dark:border-gray-600 border-gray-300 border-2
     p-1 checked:bg-green-600 checked:border-transparent
     focus:outline-none focus:ring focus:ring-1 focus:border-green-600 focus:ring-green-500
     transition duration-300 ease-in-out;
 }
 .form-group .check-box label {
-  @apply mb-0 ml-2;
+    @apply mb-0 ml-2;
 }