Add !important to color rule in .is-loading class in button (#199)

css/bulma.css

@@ -1500,7 +1500,7 @@ a.box:active {
 }
 
 .button.is-loading, .pagination a.is-loading {
-  color: transparent;
+  color: transparent !important;
   pointer-events: none;
 }
 
@@ -5121,15 +5121,15 @@ a.header-item.is-active {
 
 .hero.is-dark .header-icon,
 .hero.is-dark a.header-item,
-.hero.is-dark .header-item > a:not(.button) {
+.hero.is-dark .header-item > a:not(.button):not(.pagination a) {
   color: rgba(255, 255, 255, 0.5);
 }
 
 .hero.is-dark .header-icon:hover, .hero.is-dark .header-icon.is-active,
 .hero.is-dark a.header-item:hover,
 .hero.is-dark a.header-item.is-active,
-.hero.is-dark .header-item > a:not(.button):hover,
-.hero.is-dark .header-item > a:not(.button).is-active {
+.hero.is-dark .header-item > a:not(.button):not(.pagination a):hover,
+.hero.is-dark .header-item > a:not(.button):not(.pagination a).is-active {
   color: white;
 }
 
@@ -5208,15 +5208,15 @@ a.header-item.is-active {
 
 .hero.is-primary .header-icon,
 .hero.is-primary a.header-item,
-.hero.is-primary .header-item > a:not(.button) {
+.hero.is-primary .header-item > a:not(.button):not(.pagination a) {
   color: rgba(255, 255, 255, 0.5);
 }
 
 .hero.is-primary .header-icon:hover, .hero.is-primary .header-icon.is-active,
 .hero.is-primary a.header-item:hover,
 .hero.is-primary a.header-item.is-active,
-.hero.is-primary .header-item > a:not(.button):hover,
-.hero.is-primary .header-item > a:not(.button).is-active {
+.hero.is-primary .header-item > a:not(.button):not(.pagination a):hover,
+.hero.is-primary .header-item > a:not(.button):not(.pagination a).is-active {
   color: white;
 }
 
@@ -5295,15 +5295,15 @@ a.header-item.is-active {
 
 .hero.is-info .header-icon,
 .hero.is-info a.header-item,
-.hero.is-info .header-item > a:not(.button) {
+.hero.is-info .header-item > a:not(.button):not(.pagination a) {
   color: rgba(255, 255, 255, 0.5);
 }
 
 .hero.is-info .header-icon:hover, .hero.is-info .header-icon.is-active,
 .hero.is-info a.header-item:hover,
 .hero.is-info a.header-item.is-active,
-.hero.is-info .header-item > a:not(.button):hover,
-.hero.is-info .header-item > a:not(.button).is-active {
+.hero.is-info .header-item > a:not(.button):not(.pagination a):hover,
+.hero.is-info .header-item > a:not(.button):not(.pagination a).is-active {
   color: white;
 }
 
@@ -5382,15 +5382,15 @@ a.header-item.is-active {
 
 .hero.is-success .header-icon,
 .hero.is-success a.header-item,
-.hero.is-success .header-item > a:not(.button) {
+.hero.is-success .header-item > a:not(.button):not(.pagination a) {
   color: rgba(255, 255, 255, 0.5);
 }
 
 .hero.is-success .header-icon:hover, .hero.is-success .header-icon.is-active,
 .hero.is-success a.header-item:hover,
 .hero.is-success a.header-item.is-active,
-.hero.is-success .header-item > a:not(.button):hover,
-.hero.is-success .header-item > a:not(.button).is-active {
+.hero.is-success .header-item > a:not(.button):not(.pagination a):hover,
+.hero.is-success .header-item > a:not(.button):not(.pagination a).is-active {
   color: white;
 }
 
@@ -5469,15 +5469,15 @@ a.header-item.is-active {
 
 .hero.is-warning .header-icon,
 .hero.is-warning a.header-item,
-.hero.is-warning .header-item > a:not(.button) {
+.hero.is-warning .header-item > a:not(.button):not(.pagination a) {
   color: rgba(0, 0, 0, 0.5);
 }
 
 .hero.is-warning .header-icon:hover, .hero.is-warning .header-icon.is-active,
 .hero.is-warning a.header-item:hover,
 .hero.is-warning a.header-item.is-active,
-.hero.is-warning .header-item > a:not(.button):hover,
-.hero.is-warning .header-item > a:not(.button).is-active {
+.hero.is-warning .header-item > a:not(.button):not(.pagination a):hover,
+.hero.is-warning .header-item > a:not(.button):not(.pagination a).is-active {
   color: rgba(0, 0, 0, 0.5);
 }
 
@@ -5556,15 +5556,15 @@ a.header-item.is-active {
 
 .hero.is-danger .header-icon,
 .hero.is-danger a.header-item,
-.hero.is-danger .header-item > a:not(.button) {
+.hero.is-danger .header-item > a:not(.button):not(.pagination a) {
   color: rgba(255, 255, 255, 0.5);
 }
 
 .hero.is-danger .header-icon:hover, .hero.is-danger .header-icon.is-active,
 .hero.is-danger a.header-item:hover,
 .hero.is-danger a.header-item.is-active,
-.hero.is-danger .header-item > a:not(.button):hover,
-.hero.is-danger .header-item > a:not(.button).is-active {
+.hero.is-danger .header-item > a:not(.button):not(.pagination a):hover,
+.hero.is-danger .header-item > a:not(.button):not(.pagination a).is-active {
   color: white;
 }
 

sass/elements/button.sass

@@ -101,7 +101,7 @@
     display: block
     width: 100%
   &.is-loading
-    color: transparent
+    color: transparent !important
     pointer-events: none
     &:after
       @extend .loader