From e96a19154affa99e15b87583333269eccc3ea761 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?nicole=20miko=C5=82ajczyk?= <git@mkljczk.pl>
Date: Sat, 21 Mar 2026 18:39:47 +0100
Subject: [PATCH] nicolium: dark mode spinner style improvement
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
---
 .../src/components/ui/{spinner.css => spinner.scss} | 13 ++++++++++++-
 packages/nicolium/src/components/ui/spinner.tsx     |  2 +-
 2 files changed, 13 insertions(+), 2 deletions(-)
 rename packages/nicolium/src/components/ui/{spinner.css => spinner.scss} (88%)

diff --git a/packages/nicolium/src/components/ui/spinner.css b/packages/nicolium/src/components/ui/spinner.scss
similarity index 88%
rename from packages/nicolium/src/components/ui/spinner.css
rename to packages/nicolium/src/components/ui/spinner.scss
index 70ce8ac90..58e844e2e 100644
--- a/packages/nicolium/src/components/ui/spinner.css
+++ b/packages/nicolium/src/components/ui/spinner.scss
@@ -14,12 +14,23 @@
 }
 
 .spinner > div::after {
-  @apply block absolute rounded-full bg-gray-700 dark:bg-gray-400;
+  display: block;
+  position: absolute;
+  border-radius: 9999px;
   content: ' ';
   top: 3.75%;
   left: 46.25%;
   width: 7.5%;
   height: 22.5%;
+  background: rgb(var(--color-gray-700));
+
+  .dark & {
+    background: rgb(var(--color-gray-400));
+  }
+
+  .dark button & {
+    background: white;
+  }
 }
 
 .spinner > div:nth-child(1) {
diff --git a/packages/nicolium/src/components/ui/spinner.tsx b/packages/nicolium/src/components/ui/spinner.tsx
index 2deceb8f9..627862028 100644
--- a/packages/nicolium/src/components/ui/spinner.tsx
+++ b/packages/nicolium/src/components/ui/spinner.tsx
@@ -3,7 +3,7 @@ import { FormattedMessage } from 'react-intl';
 
 import Text from './text';
 
-import './spinner.css';
+import './spinner.scss';
 
 interface ISpinner {
   /** Width and height of the spinner in pixels. */