move inline styles to less file

Author: RayBB

openlibrary/templates/covers/external_image.html

@@ -4,14 +4,14 @@
     <div class="label">
         <label>$_("Or, use a cover from %s", source_name)</label>
     </div>
-    <div style="display: flex; flex-direction: row; gap: 5px;">
+    <div class="input-container">
         $for url in [img_url_cover, img_url_title]:
             $if url:
-                <div class="input" style="align-items: center;">
-                    <a href="$url" target="_blank" style="flex-direction: column;">
+                <div class="input">
+                    <a href="$url" target="_blank">
                         <img class="ol-cover-form--external_image" src="$url" style="height: 200px" alt="" />
                     </a>
-                    <button type="submit" class="cta-btn cta-btn--vanilla" name="url" style="flex-direction: column;" value="$url">$_("Upload Image")</button>
+                    <button type="submit" class="cta-btn cta-btn--vanilla" name="url" value="$url">$_("Upload Image")</button>
                 </div>
     </div>
 </form>

static/css/components/cbox.less

@@ -278,7 +278,12 @@ div.floater {
 
   .input {
     flex-direction: column;
-    align-items: flex-start;
+  }
+
+  .input-container {
+    display: flex;
+    flex-direction: row;
+    gap: 5px;
   }
 
   button[type="submit"] {