Improve mixer animations. (#2999)

- Replace stills with .svg files (previously .gif)
- Smooth the transition from still to animated by removing transparent
 borders from images (also removes the need to offset the images by -2px)
- Give gifs a background color rather than transparency. Necessary to prevent jaggies.

app/components/views/PrivacyPage/Privacy/Privacy.module.css

@@ -61,11 +61,10 @@
   font-size: 18px;
   color: var(--privacy-mixer-status-color);
   margin-bottom: 20px;
-  padding-left: 38px;
+  padding-left: 44px;
   height: 34px;
   align-items: center;
-  background-size: 36px;
-  background-position: -2px 0;
+  background-size: 34px;
   background-repeat: no-repeat;
   background-image: var(--decentralized-loop-still);
 }

app/style/themes/darkTheme.js

@@ -243,9 +243,9 @@ const darkTheme = {
   "unmixed-account-icon": "url('style/icons/unmixedAccountDark.svg')",
   "privacy-running-arrows": "url('style/icons/privacyRunningArrowsDark.svg')",
   "decentralized-loop-still":
-    "url('style/icons/decentralizedLoopStillDark.gif')",
+    "url('style/icons/decentralizedLoopStillDark.svg')",
   "decentralized-loop-animation":
-    "url('style/icons/decentralizedLoopAnimationDark.gif')",
+  "url('style/icons/decentralizedLoopAnimationDark.gif')",
   "send-to-self-icon": "url('style/icons/sentToSelfTxDark.svg')"
 };
 

app/style/themes/lightTheme.js

@@ -239,9 +239,9 @@ const lightTheme = {
   "mixed-account-icon": "url('style/icons/mixedAccount.svg')",
   "unmixed-account-icon": "url('style/icons/unmixedAccount.svg')",
   "privacy-running-arrows": "url('style/icons/privacyRunningArrows.svg')",
-  "decentralized-loop-still": "url('style/icons/decentralizedLoopStill.gif')",
+  "decentralized-loop-still": "url('style/icons/decentralizedLoopStill.svg')",
   "decentralized-loop-animation":
-    "url('style/icons/decentralizedLoopAnimation.gif')",
+  "url('style/icons/decentralizedLoopAnimation.gif')",
   "send-to-self-icon": "url('style/icons/sentToSelfTx.svg')"
 };