fix: styles

package.json

@@ -1,6 +1,6 @@
 {
   "name": "databend-profile-ui",
-  "version": "0.0.9",
+  "version": "0.0.16",
   "description": "A react library developed with dumi",
   "license": "MIT",
   "module": "dist/index.js",

src/QueryProfile/CacheFlowAnalysisGraph.tsx

@@ -355,7 +355,7 @@ const CacheFlowAnalysisGraph: FC<any> = ({
           group.addShape('path', {
             attrs: {
               path: pathMoon,
-              fill: isExistedError ? '#f73920' : '#fff',
+              fill: isExistedError ? '#f73920' : isLight ? '#fff' : '#101',
             },
             name: `circle-path-bg-${Math.random()}`,
           });

src/QueryProfile/index.md

@@ -14,5 +14,5 @@ export default () => (
 ```jsx
 import { TestProfile } from 'databend-profile-ui';
 
-export default () => <TestProfile isDemo isNeedMetrics={true} />;
+export default () => <TestProfile isDemo isNeedMetrics={false} />;
 ```

src/QueryProfile/styles.less

@@ -45,7 +45,7 @@
   .graph {
     flex: 1;
   }
-  > div:first-child {
+  > div {
     background-color: var(--color-bg-1) !important;
   }
   .profile-index-details-info {
@@ -181,6 +181,7 @@
   text-overflow: ellipsis;
   white-space: nowrap;
   font-weight: 600;
+  color: var(--node-heaer-color);
 }
 .profile-common-styles-bcpc {
   border-bottom: 1px solid var(--color-border);

src/assets/css/profile.less

@@ -13,7 +13,9 @@ html[data-prefers-color='light'] {
   --node-heaer-color: #010e29;
 }
 
-:root.theme-dark.dark.dark-theme.dark-mode,
+.theme-dark:root,
+:root.theme-dark,
+html.theme-dark,
 html[data-prefers-color='dark'] {
   --color-bg-1: rgb(18, 24, 38);
   --color-primary: rgb(50, 147, 248);