Migrate email subscription form to ConvertKit (#8)

assets/css/extended/footer.css

@@ -12,18 +12,20 @@ form.mailing-list {
 }
 
 form.mailing-list label {
+  display: block;
   font-weight: bold;
 }
 
-form.mailing-list input[type="text"] {
+form.mailing-list input[type="email"] {
   background: var(--theme);
   border-radius: 4px;
   color: var(--primary);
   margin: 8px;
   padding: 4px;
+  min-width: 50%;
 }
 
-form.mailing-list input[type="submit"]  {
+form.mailing-list button {
   background: var(--primary);
   border-radius: 18px;
   color: var(--theme);

layouts/partials/extend_footer.html

@@ -3,19 +3,32 @@
 </a>
 
 <div class="mailing-list-container">
+  <script src="https://f.convertkit.com/ckjs/ck.5.js"></script>
   <form
-      class="mailing-list"
-      action="https://yanirseroussi.us17.list-manage.com/subscribe/post?u=3c08aa3ff27dd92978019febd&amp;id=bc3ab705af"
+      class="mailing-list seva-form formkit-form"
+      action="https://app.convertkit.com/forms/6549537/subscriptions"
       method="post"
-      target="_blank"
-      novalidate
+      data-sv-form="6549537"
+      data-uid="9157759fce"
+      data-format="inline"
+      data-version="5"
+      data-options="{&quot;settings&quot;:{&quot;after_subscribe&quot;:{&quot;action&quot;:&quot;message&quot;,&quot;success_message&quot;:&quot;Success! Now check your email to confirm your subscription.&quot;,&quot;redirect_url&quot;:&quot;&quot;},&quot;analytics&quot;:{&quot;google&quot;:null,&quot;fathom&quot;:null,&quot;facebook&quot;:null,&quot;segment&quot;:null,&quot;pinterest&quot;:null,&quot;sparkloop&quot;:null,&quot;googletagmanager&quot;:null},&quot;modal&quot;:{&quot;trigger&quot;:&quot;timer&quot;,&quot;scroll_percentage&quot;:null,&quot;timer&quot;:5,&quot;devices&quot;:&quot;all&quot;,&quot;show_once_every&quot;:15},&quot;powered_by&quot;:{&quot;show&quot;:true,&quot;url&quot;:&quot;https://convertkit.com/features/forms?utm_campaign=poweredby&amp;utm_content=form&amp;utm_medium=referral&amp;utm_source=dynamic&quot;},&quot;recaptcha&quot;:{&quot;enabled&quot;:false},&quot;return_visitor&quot;:{&quot;action&quot;:&quot;show&quot;,&quot;custom_content&quot;:&quot;&quot;},&quot;slide_in&quot;:{&quot;display_in&quot;:&quot;bottom_right&quot;,&quot;trigger&quot;:&quot;timer&quot;,&quot;scroll_percentage&quot;:null,&quot;timer&quot;:5,&quot;devices&quot;:&quot;all&quot;,&quot;show_once_every&quot;:15},&quot;sticky_bar&quot;:{&quot;display_in&quot;:&quot;top&quot;,&quot;trigger&quot;:&quot;timer&quot;,&quot;scroll_percentage&quot;:null,&quot;timer&quot;:5,&quot;devices&quot;:&quot;all&quot;,&quot;show_once_every&quot;:15}},&quot;version&quot;:&quot;5&quot;}"
   >
-    <label for="mailing-list-email">Get new posts in your mailbox</label>
-    <input type="text" name="EMAIL" id="mailing-list-email" placeholder="Email address" />
-    <div style="position: absolute; left: -5000px;" aria-hidden="true">
-      <input type="text" name="b_3c08aa3ff27dd92978019febd_bc3ab705af" tabindex="-1" value="" />
+    <div data-style="clean">
+      <ul class="formkit-alert formkit-alert-error" data-element="errors" data-group="alert"></ul>
+      <div data-element="fields" data-stacked="false">
+        <label for="mailing-list-email">Get weekly posts in your mailbox</label>
+        <input
+            id="mailing-list-email"
+            name="email_address"
+            aria-label="Email address"
+            placeholder="Email address"
+            required=""
+            type="email"
+        >
+        <button data-element="submit">Subscribe</button>
+      </div>
     </div>
-    <input type="submit" value="Subscribe" />
   </form>
 
   <div class="footer">