GIF Image instead of SVG Spinner

Hello,

I’ve been digging through the forums and tinkering plenty with my code to figure this out, but have had no luck. Below you will see that I am using the <ion-refresher> directive to handle the refreshing of a <ion-list>. Once you pull the refresher down and let go, it defaults to an SVG animation .

My problem is, the SVG spinners are bland and not branded to match the app. My question is, what can I do to the below code to utilize my own GIF animation instead of SVG spinners?

<script id="templates/home.html" type="text/ng-template">        
            <ion-view hide-back-button="true" >
                <ion-header-bar class="bar-assertive">
                    <button class="button button-icon icon ion-gear-b" ng-click="navSettings()"></button>
                    <h1 class="title">Home</h1>
                    <button class="button button-icon icon ion-plus-round" ng-click="navCreateItem()"></button>
                </ion-header-bar>
                <ion-content class="padding">
                    <ion-refresher on-refresh="doRefresh()"></ion-refresher>
                    <ion-list>
                        <div class="item item-divider" ng-hide="!yourNames.length">Your Names</div>
                        <ion-item ng-repeat="yourName in yourNames" ng-click="navYourNameDetails(yourName)">
                            <div style="float: left; width:100%;">
                                <b>{{name}}</b>
                            </div>
                        </ion-item>
                    </ion-list>
                </ion-content>
            </ion-view>
    </script>

I’ve tried updating the CSS, but have had no luck finding anyway to override the SVG spinner.

Any ideas?