Add new newsletter form

diff --git a/docs/_includes/footer.html b/docs/_includes/footer.html
index 82543937bf8fe18e17db28fca2437f09cb59909f..f53375b45121bfa9e07de21f552e8c5202be7209 100644 (file)
--- a/docs/_includes/footer.html
+++ b/docs/_includes/footer.html
@@ -2,51 +2,12 @@
 
 {% include bsa.html %}
 
-<section id="newsletter" class="hero is-primary">
-  <div class="hero-body">
-    <div class="container">
-      <!-- Begin MailChimp Signup Form -->
-      <div id="mc_embed_signup" class="columns is-vcentered">
-        <div class="column is-one-third is-left">
-          <p class="title">Bulma <strong>Newsletter</strong></p>
-          <p class="subtitle">Get notified when v1 is ready!</p>
-        </div>
-
-        <div class="column">
-          <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&amp;id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
-            <div id="mc_embed_signup_scroll">
-              <div class="field is-grouped">
-                <div class="control has-icons-left is-expanded">
-                  <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
-                  <span class="icon is-small is-left">
-                    <i class="fas fa-envelope"></i>
-                  </span>
-                </div>
-                <div class="control">
-                  <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
-                </div>
-              </div>
-              <div id="mce-responses">
-                <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
-                <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
-              </div>
-              <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
-              <div style="position: absolute; left: -5000px;" aria-hidden="true">
-                <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
-              </div>
-            </div>
-          </form>
-        </div>
-      </div>
-      <!--End mc_embed_signup-->
-    </div>
-  </div>
-</section>
+{% include newsletter.html %}
 
 <footer class="footer">
   <div class="container">
     <div class="columns">
-      <div class="column is-3">
+      <div class="column is-4">
         <div id="about" class="content">
           <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
           <div class="twitter-container">
@@ -57,7 +18,7 @@
           </p>
         </div>
       </div>
-      <div class="column is-5">
+      <div class="column is-4">
         <div id="share" class="content">
           <div>
             <strong>Support</strong> and share the love!
@@ -103,71 +64,21 @@
       </div>
     </div>
 
-    <div class="columns">
-      <div class="column is-3">
-        <p id="tsp">
-          <a href="{{ site.url }}/made-with-bulma/">
-            <img src="{{ site.url }}/images/made-with-bulma.png" alt="Made with Bulma" width="128" height="24">
-          </a>
-          <small>
-            Get the <a href="{{ site.url }}/made-with-bulma/">badge</a>!
-            <br>
-            Source code licensed <a href="https://opensource.org/licenses/mit-license.php">MIT</a>.
-            <br>
-            Website content licensed <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
-          </small>
-        </p>
-      </div>
+    <div id="tsp">
+      <p>
+        <a href="{{ site.url }}/made-with-bulma/">
+          <img src="{{ site.url }}/images/made-with-bulma.png" alt="Made with Bulma" width="128" height="24">
+        </a>
+        <small>
+          Get the <a href="{{ site.url }}/made-with-bulma/">badge</a>!
+          <br>
+          Source code licensed <a href="https://opensource.org/licenses/mit-license.php">MIT</a>.
+          <br>
+          Website content licensed <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+        </small>
+      </p>
     </div>
   </div>
 </footer>
 
-<script src="{{ site.url }}/vendor/clipboard-1.7.1.min.js"></script>
-<script src="{{ site.url }}/lib/main.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
-
-{% if page.route == 'index' %}
-  <script src="https://player.vimeo.com/api/player.js"></script>
-  <script type="text/javascript" src="{{ site.url }}/lib/index.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
-{% elsif page.doc-subtab == 'navbar' %}
-  {% include examples/navbar-bottom.html %}
-  <script type="text/javascript" src="{{ site.url }}/lib/navbar.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
-{% endif %}
-
-<div id="fb-root"></div>
-
-<script async defer type="text/javascript">(function(d, s, id) {
-  var js, fjs = d.getElementsByTagName(s)[0];
-  if (d.getElementById(id)) return;
-  js = d.createElement(s); js.id = id;
-  js.async = true;
-  js.defer = true;
-  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
-  fjs.parentNode.insertBefore(js, fjs);
-}(document, 'script', 'facebook-jssdk'));</script>
-
-<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
-<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
-
-<script async defer type="text/javascript">
-  (function() {
-    window.fnames = new Array();
-    window.ftypes = new Array();
-    fnames[0]='EMAIL';
-    ftypes[0]='email';
-  }());
-  // var $mcj = window.jQuery.noConflict(true);
-</script>
-
-<script async defer type="text/javascript">
-  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
-
-  ga('create', 'UA-82634666-2', 'auto');
-  ga('send', 'pageview');
-</script>
-
-{% if page.route == 'index' %}
-  <script type="text/javascript" defer="defer" src="https://extend.vimeocdn.com/ga/72160148.js"></script>
-{% endif %}
+{% include scripts.html %}

diff --git a/docs/_includes/newsletter.html b/docs/_includes/newsletter.html
new file mode 100644 (file)
index 0000000..fcabda7
--- /dev/null
+++ b/docs/_includes/newsletter.html
@@ -0,0 +1,32 @@
+<section id="newsletter" class="hero is-primary">
+  <div class="hero-body">
+    <div class="container">
+      <div class="columns is-vcentered">
+        <div class="column is-one-third is-left">
+          <p class="title">Bulma <strong>Newsletter</strong></p>
+          <p class="subtitle">Get notified when v1 is ready!</p>
+        </div>
+
+        <div class="column">
+          <form action="https://mail.jgthms.com/subscribe" method="POST" accept-charset="utf-8">
+              <div class="field is-grouped">
+                <div class="control has-icons-left is-expanded">
+                  <input type="email" value="" name="email" class="input is-flat required email" placeholder="email address" required>
+                  <span class="icon is-small is-left">
+                    <i class="fas fa-envelope"></i>
+                  </span>
+                </div>
+                <div class="control">
+                  <div class="is-hidden">
+                    <input type="text" name="hp" id="hp">
+                  </div>
+                  <input type="hidden" name="list" value="So5UY3O9gHJkq892bn763Tyf4A">
+                  <input type="submit" value="Subscribe" name="submit" id="mc-embedded-subscribe" class="button is-white is-outlined">
+                </div>
+              </div>
+          </form>
+        </div>
+      </div>
+    </div>
+  </div>
+</section>
\ No newline at end of file

diff --git a/docs/_includes/scripts.html b/docs/_includes/scripts.html
new file mode 100644 (file)
index 0000000..35bd786
--- /dev/null
+++ b/docs/_includes/scripts.html
@@ -0,0 +1,49 @@
+<script src="{{ site.url }}/vendor/clipboard-1.7.1.min.js"></script>
+<script src="{{ site.url }}/lib/main.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
+
+{% if page.route == 'index' %}
+  <script src="https://player.vimeo.com/api/player.js"></script>
+  <script type="text/javascript" src="{{ site.url }}/lib/index.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
+{% elsif page.doc-subtab == 'navbar' %}
+  {% include examples/navbar-bottom.html %}
+  <script type="text/javascript" src="{{ site.url }}/lib/navbar.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
+{% endif %}
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+  var js, fjs = d.getElementsByTagName(s)[0];
+  if (d.getElementById(id)) return;
+  js = d.createElement(s); js.id = id;
+  js.async = true;
+  js.defer = true;
+  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+  fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+  (function() {
+    window.fnames = new Array();
+    window.ftypes = new Array();
+    fnames[0]='EMAIL';
+    ftypes[0]='email';
+  }());
+  // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+  ga('create', 'UA-82634666-2', 'auto');
+  ga('send', 'pageview');
+</script>
+
+{% if page.route == 'index' %}
+  <script type="text/javascript" defer="defer" src="https://extend.vimeocdn.com/ga/72160148.js"></script>
+{% endif %}

diff --git a/docs/_sass/footer.sass b/docs/_sass/footer.sass
index c53f3529d373a550ca1b45306bebb45043b422f5..cd98dd89a927e86d2e64d87e11173e48c993fb2b 100644 (file)
--- a/docs/_sass/footer.sass
+++ b/docs/_sass/footer.sass
@@ -67,6 +67,8 @@
     height: 30px
 
 #tsp
+  margin-top: 3rem
+  text-align: center
   small
     display: block
 

diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css
index d6754cfd771c251e0fcbaf96585b5bb350e4215a..d38a8bf15fe38e27703b048f989e6e42f07950dd 100644 (file)
--- a/docs/css/bulma-docs.css
+++ b/docs/css/bulma-docs.css
@@ -11581,6 +11581,11 @@ svg {
   height: 30px;
 }
 
+#tsp {
+  margin-top: 3rem;
+  text-align: center;
+}
+
 #tsp small {
   display: block;
 }

diff --git a/docs/thank-you.html b/docs/thank-you.html
index 0f1d3bf44356832f57067d4ba5a1f68ea18a1c69..9bc74c4a268d575952c47bbb64f959de11f8385d 100644 (file)
--- a/docs/thank-you.html
+++ b/docs/thank-you.html
@@ -4,15 +4,28 @@ layout: default
 route: index
 ---
 
-<section class="hero is-fullheight is-success has-text-centered">
+{% include navbar.html id="ThankYou" fixed=true has_container=true boxed=true transparent=true %}
+
+<section class="hero is-large has-text-centered">
   <div class="hero-body">
     <div class="container">
-      <h1 class="title">
-        Thank you!
-      </h1>
-      <h2 class="subtitle">
-        Go back to the <a href="{{ site.url }}">homepage</a>
-      </h2>
+      <div class="columns">
+        <div class="column is-offset-3 is-6">
+          <h1 class="title">
+            📫 😃
+            <br>
+            Thanks for subscribing!
+          </h1>
+          <div class="content is-medium">
+            <p>
+              You'll occasionally receive news about new features, documentation updates, and beautiful websites made with Bulma!
+            </p>
+            <p>
+              <a onclick="window.history.back();">Go back</a>
+            </p>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 </section>