I'm currently working on centering a spinner inside a button. The purpose of the spinner is to indicate that the system is processing a response. Despite my efforts to adjust margins and padding in the code, the spinner remains at the bottom of the button without moving up as intended.
Below is the Jade code I am using:
div.form-group
div.col-sm-4
button.form-control.btn.btn-success.strong-button(type='submit' ng-model='pressed' ng-disabled="pressed") Delete
spinner(ng-show="submitDelete")
The CSS styling for the spinner is as follows:
.font-awesome-spinner{
width: 100%;
text-align: center;
}
A snippet from the page source shows how the spinner element creates a div inside the button element:
<button (all the stuff here)>
<div class="font-awesome-spinner ng-isolate-scope" ng-show="submitDelete">
<i class="fa fa-circle-o-notch fa-spin"
::before
</i>
</div>
</button>