Improve loading

Author: steve8708

chrome-extension/webpack.dev.js

@@ -3,5 +3,4 @@ const common = require("./webpack.common.js");
 
 module.exports = merge(common, {
   mode: "development",
-  devtool: "inline-source-map"
 });

plugin/components/loading.tsx

@@ -47,7 +47,7 @@ export function Loading(props: { content?: CheckListContent[] | undefined }) {
     <Box
       border={1}
       style={{
-        padding: 5,
+        padding: 15,
         backgroundColor: "#F4F8FF",
         borderRadius: 4,
         borderColor: "#F4F8FF",

plugin/ui.css

@@ -12,63 +12,6 @@ a {
   color: rgba(26, 115, 231, 1);
 }
 
-[role=tooltip] a {
+[role="tooltip"] a {
   color: rgb(7, 178, 215);
 }
-
-/* Loading animation */
-.lds-ellipsis {
-  display: inline-block;
-  margin: auto;
-  position: relative;
-  width: 64px;
-  height: 48px;
-}
-.lds-ellipsis div {
-  position: absolute;
-  top: 27px;
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  animation-timing-function: cubic-bezier(0, 1, 1, 0);
-}
-.lds-ellipsis div:nth-child(1) {
-  left: 6px;
-  animation: lds-ellipsis1 0.6s infinite;
-}
-.lds-ellipsis div:nth-child(2) {
-  left: 6px;
-  animation: lds-ellipsis2 0.6s infinite;
-}
-.lds-ellipsis div:nth-child(3) {
-  left: 26px;
-  animation: lds-ellipsis2 0.6s infinite;
-}
-.lds-ellipsis div:nth-child(4) {
-  left: 45px;
-  animation: lds-ellipsis3 0.6s infinite;
-}
-@keyframes lds-ellipsis1 {
-  0% {
-    transform: scale(0);
-  }
-  100% {
-    transform: scale(1);
-  }
-}
-@keyframes lds-ellipsis3 {
-  0% {
-    transform: scale(1);
-  }
-  100% {
-    transform: scale(0);
-  }
-}
-@keyframes lds-ellipsis2 {
-  0% {
-    transform: translate(0, 0);
-  }
-  100% {
-    transform: translate(19px, 0);
-  }
-}