fix: firefox text overflow issue (#1492)

* Fixed Firefox text overflow / overwriting issue

Tests currently don't work becouse it appears that '@supports' is not supported by cssToObject used within the tests. I currently have no idea how to fix that test but the cards themself appear to not be broken

Fixes anuraghazra/github-readme-stats#664

Fixes anuraghazra/github-readme-stats#1134

* Fixed tests by moving to other css-to-object

Moved the `css-to-object` package to @uppercod's version for test fix. This doesn't seem to have the same issues as the older package

* chore: cleanup test

Co-authored-by: Anurag <hazru.anurag@gmail.com>

src/common/Card.js

@@ -154,6 +154,10 @@ class Card {
             fill: ${this.colors.titleColor};
             animation: fadeInAnimation 0.8s ease-in-out forwards;
           }
+          @supports(-moz-appearance: auto) {
+            /* Selector detects Firefox */
+            .header { font-size: 15.5px; }
+          }
           ${this.css}
 
           ${process.env.NODE_ENV === "test" ? "" : getAnimations()}

src/getStyles.js

@@ -71,6 +71,10 @@ const getStyles = ({
     .stat {
       font: 600 14px 'Segoe UI', Ubuntu, "Helvetica Neue", Sans-Serif; fill: ${textColor};
     }
+    @supports(-moz-appearance: auto) {
+      /* Selector detects Firefox */
+      .stat { font-size:12px; }
+    }
     .stagger {
       opacity: 0;
       animation: fadeInAnimation 0.3s ease-in-out forwards;