Feat: settings dark mode (#15184)

web/app/components/billing/progress-bar/index.tsx

@@ -1,18 +1,20 @@
+import cn from '@/utils/classnames'
+
 type ProgressBarProps = {
   percent: number
   color: string
 }
+
 const ProgressBar = ({
   percent = 0,
   color = '#2970FF',
 }: ProgressBarProps) => {
   return (
-    <div className='bg-[#F2F4F7] rounded-[4px] overflow-hidden'>
+    <div className='bg-components-progress-bar-bg rounded-[6px] overflow-hidden'>
       <div
-        className='h-2 rounded-[4px]'
+        className={cn('h-1 rounded-[6px]', color)}
         style={{
           width: `${Math.min(percent, 100)}%`,
-          backgroundColor: color,
         }}
       />
     </div>