Move Xylect link to the bottom

Author: laike9m

templates/challenge.html

@@ -107,6 +107,7 @@
       display: flex;
       justify-content: space-between;
       gap: 24px;
+      flex: 0.9 0 auto;
     }
 
     /* Code Editor Area */

templates/components/challenge_area.html

@@ -2,11 +2,6 @@
   <div class="challenge-header__title">
     <span>Challenge - {{ name }}</span>
     {%include 'components/badge.html' with context %}
-    <span style="font-weight: 600; margin-left: auto"
-    >🥰 Like type challenges? I also built
-      <a target="_blank" href="https://xylect.app">Xylect</a>, one-click AI-search for
-      Mac</span></span
-    >
   </div>
   <p class="challenge-header__exerpt">
     Complete code following the instructions, so that lines followed by
@@ -72,6 +67,14 @@
   </div>
 </div>
 
+<div>
+  <span style="font-weight: 400; line-height: 2em; "
+  >🥰 Like type challenges? I also built
+    <a target="_blank" href="https://xylect.app">Xylect</a>, a one-click AI-search app for
+    Mac</span></span
+  >
+</div>
+
 <script type="module">
   import passedState from "{{ url_for('static', filename='js/passed-state.js')}}";