fix hr on smaller screens

canonical · Jan 31, 2025 · 60cb246 · 60cb246
1 parent f7a9661
commit 60cb246
Showing 1 changed file with 12 additions and 12 deletions.
diff --git a/templates/docs/juju-ecosystem-docs.html b/templates/docs/juju-ecosystem-docs.html
@@ -65,10 +65,10 @@ <h1>Juju ecosystem</h1>
         </button>
       </form>
     </div>
+    <div class="u-fixed-width">
+      <hr class="is-muted">
+    </div>
   </section>
-  <div class="u-fixed-width">
-    <hr class="is-muted">
-  </div>
   <section class="p-section--shallow">
     <div class="p-equal-height-row">
       <div class="p-equal-height-row__col">
@@ -79,12 +79,12 @@ <h1>Juju ecosystem</h1>
               <img class="p-image-container__image" src="https://assets.ubuntu.com/v1/57c99e47-1%20What%20is%20Juju.svg"
                 alt="1. what is juju" width="100%" height="100%">
             </div>
+            <div class="u-fixed-width">
+              <hr>
+            </div>
           </a>
         </div>
         <div class="p-equal-height-row__item">
-          <div class="u-fixed-width">
-            <hr>
-          </div>
           <h4 style="font-weight: 500">
             <a href="https://canonical-juju.readthedocs-hosted.com/en/latest/">What is Juju?</a>
           </h4>
@@ -100,11 +100,11 @@ <h4 style="font-weight: 500">
                 alt="2. install juju" width="100%" height="100%">
             </div>
           </a>
-        </div>
-        <div class="p-equal-height-row__item">
           <div class="u-fixed-width">
             <hr>
           </div>
+        </div>
+        <div class="p-equal-height-row__item">
           <h4 style="font-weight: 500">
             <a href="https://canonical-juju.readthedocs-hosted.com/en/latest/user/howto/manage-juju/#install-juju">Install
               Juju</a>
@@ -122,11 +122,11 @@ <h4 style="font-weight: 500">
                 width="100%" height="100%">
             </div>
           </a>
-        </div>
-        <div class="p-equal-height-row__item">
           <div class="u-fixed-width">
             <hr>
           </div>
+        </div>
+        <div class="p-equal-height-row__item">
           <h4 style="font-weight: 500">
             <a href="https://canonical-juju.readthedocs-hosted.com/en/latest/user/howto/manage-clouds/#add-a-cloud">Connect
               a cloud</a>
@@ -184,11 +184,11 @@ <h4 style="font-weight: 500">
                 alt="4. use charmed applications" width="100%" height="100%">
             </div>
           </a>
-        </div>
-        <div class="p-equal-height-row__item">
           <div class="u-fixed-width">
             <hr>
           </div>
+        </div>
+        <div class="p-equal-height-row__item">
           <h4 style="font-weight: 500">
             <a href="https://canonical-juju.readthedocs-hosted.com/en/latest/user/howto/manage-applications/">Use
               charmed applications</a>