Project installation indicator (#3023)

* Add indicator for project installation

* fix lint

---------

Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
Co-authored-by: Jai A <jaiagr+gpg@pm.me>

packages/assets/icons/spinner.svg

@@ -0,0 +1,19 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  fill="none"
+  viewBox="0 0 24 24"
+>
+  <circle
+    class="opacity-25"
+    cx="12"
+    cy="12"
+    r="10"
+    stroke="currentColor"
+    stroke-width="4"
+  />
+  <path
+    class="opacity-75"
+    fill="currentColor"
+    d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+  />
+</svg>

packages/assets/index.ts

@@ -145,6 +145,7 @@ import _SlashIcon from './icons/slash.svg?component'
 import _SortAscendingIcon from './icons/sort-asc.svg?component'
 import _SortDescendingIcon from './icons/sort-desc.svg?component'
 import _SparklesIcon from './icons/sparkles.svg?component'
+import _SpinnerIcon from './icons/spinner.svg?component'
 import _StarIcon from './icons/star.svg?component'
 import _StopCircleIcon from './icons/stop-circle.svg?component'
 import _SunIcon from './icons/sun.svg?component'
@@ -333,6 +334,8 @@ export const ShieldIcon = _ShieldIcon
 export const SlashIcon = _SlashIcon
 export const SortAscendingIcon = _SortAscendingIcon
 export const SortDescendingIcon = _SortDescendingIcon
+export const SparklesIcon = _SparklesIcon
+export const SpinnerIcon = _SpinnerIcon
 export const StarIcon = _StarIcon
 export const StopCircleIcon = _StopCircleIcon
 export const SunIcon = _SunIcon
@@ -378,4 +381,3 @@ export const DBIcon = _DBIcon
 export const LoaderIcon = _LoaderIcon
 export const ImportIcon = _ImportIcon
 export const CardIcon = _CardIcon
-export const SparklesIcon = _SparklesIcon

packages/assets/styles/variables.scss

@@ -222,12 +222,6 @@ html {
 
   --tab-underline-hovered: initial !important;
 
-  --color-button-text: initial !important;
-  --color-button-bg-hover: initial !important;
-  --color-button-text-hover: initial !important;
-  --color-button-bg-active: initial !important;
-  --color-button-text-active: initial !important;
-
   --color-grey-link: inherit !important;
   --color-grey-link-hover: inherit !important; // DEPRECATED, use filters in future
   --color-grey-link-active: inherit !important; // DEPRECATED, use filters in future