Loader

- Fix color issue (light/dark mode)
appwrite · Nov 16, 2023 · 49c8015 · 49c8015
1 parent 3d2ed52
commit 49c8015
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/apps/pink/src/pages/elements/loader.mdx b/apps/pink/src/pages/elements/loader.mdx
@@ -28,8 +28,8 @@ Work different from the other rotate loaders.
 | ----------------------------- | -------------------------------------------------------------------------------- | -------------------------------------------------- |
 | `--loading`                   | Loading precent                                                                  | `--loading: 65%;`                                  |
 | `-loader-bg-color-light`      | inner circle color (light-mode) that will fit background-color of the container  | `--loader-bg-color-light: var(--color-neutral-5);` |
-| `-loader-bg-color-dark`       | inner circle color (dark-mode) that will fit background-color of the container   | `--loader-bg-color-dark: var(--color-neutral-400);`|
+| `-loader-bg-color-dark`       | inner circle color (dark-mode) that will fit background-color of the container   | `--loader-bg-color-dark: var(--color-neutral-100);`|
 
 <Preview center>
-    <div class="loader is-loading" style="--loading:65%; --loader-bg-color-light:var(--color-neutral-5); --loader-bg-color-dark:var(--color-neutral-400);"></div>
+    <div class="loader is-loading" style="--loading:65%; --loader-bg-color-light:var(--color-neutral-5); --loader-bg-color-dark:var(--color-neutral-100);"></div>
 </Preview>
diff --git a/packages/ui/src/6-elements/_loader.scss b/packages/ui/src/6-elements/_loader.scss
@@ -50,7 +50,8 @@
 
   /* Theme Dark */
   #{$theme-dark} & {
-    --p-base-color: var(--color-neutral-70);
-    --p-base-full-color: var(--color-neutral-20);
+    --p-loader-border-base-color:  var(--color-neutral-20);
+    --p-loader-base-full-color:    var(--color-neutral-100);
+    --p-loader-bg-color-default:   var(--p-loader-bg-color-dark);
   }
 }