Gravity Forms better spinner

app.js

$(".gform_wrapper form").on("submit", function(e){
  $(this).find(".gform_button").attr("disabled", true);
});

forms.scss

.gform_button {
  .spinner-border {
    opacity: 0;
    z-index: 100;
  }

  &:disabled {
    .spinner-border {
      opacity: 1;
      z-index: 100;
    }
  }
}

.gravity-forms-button-text {
  margin-left: $spacer;
}

gravityforms.php

<?php

/**
* Change the GF spinner to a transparent image
*/
add_filter('gform_ajax_spinner_url', function ($image_src, $form) {
    return  'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'; // relative to you theme images folder
}, 10, 2);

/**
 * Customize the submit button
 */
add_filter('gform_submit_button', function ($button_input, $form) {
    //save attribute string to $button_match[1]
    preg_match("/<input([^\/>]*)(\s\/)*>/", $button_input, $button_match);

    //remove value attribute
    $button_atts = str_replace("value='".$form['button']['text']."' ", "", $button_match[1]);

    return '<button '.$button_atts.'><span class="gravity-forms-button-text">'.$form['button']['text'].'</span><span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span></button>';
}, 10, 2);