diff --git a/dashboard/app/components/stats/StatsItem.module.css b/dashboard/app/components/stats/StatsItem.module.css
index d0faaf2..fcc5993 100644
--- a/dashboard/app/components/stats/StatsItem.module.css
+++ b/dashboard/app/components/stats/StatsItem.module.css
@@ -4,6 +4,8 @@
padding: 7px 16px;
width: calc(100% - 16px);
+ background-color: transparent;
+ border: none;
border-radius: 8px;
cursor: pointer;
@@ -30,6 +32,22 @@
border: 1px solid var(--violet);
}
+.label {
+ font-size: 14px;
+ text-overflow: ellipsis;
+ user-select: text;
+}
+
+.percentage {
+ font-size: 12px;
+ color: var(--text-muted);
+ margin-right: 4px;
+
+ @media (--lt-xs) {
+ display: none;
+ }
+}
+
.external {
svg {
margin-bottom: -2px;
@@ -41,4 +59,8 @@
&[data-hidden="true"] {
display: none;
}
+
+ @media (--lt-xs) {
+ display: none;
+ }
}
diff --git a/dashboard/app/components/stats/StatsItem.tsx b/dashboard/app/components/stats/StatsItem.tsx
index 7af1202..95a0d64 100644
--- a/dashboard/app/components/stats/StatsItem.tsx
+++ b/dashboard/app/components/stats/StatsItem.tsx
@@ -1,8 +1,8 @@
-import { Group, Text, UnstyledButton } from '@mantine/core';
import React, { useMemo } from 'react';
import isFQDN from 'validator/lib/isFQDN';
import { IconExternal } from '@/components/icons/external';
+import { Group } from '@/components/layout/Flex';
import { useFilter } from '@/hooks/use-filter';
import { useHover } from '@/hooks/use-hover';
@@ -50,46 +50,38 @@ const StatsItem = ({
};
return (
-
-
-
-
- {label}
-
+
+
+ {label}
{tab === 'Referrers' && (
- event.stopPropagation()}
- visibleFrom="xs"
>
-
+
)}
-
-
+
{(percentage * 100).toFixed(1)}%
-
-
- {formattedValue}
-
+
+ {formattedValue}
-
+
);
};
diff --git a/dashboard/app/routes/$hostname._index.tsx b/dashboard/app/routes/$hostname._index.tsx
index f8af8e5..e571e09 100644
--- a/dashboard/app/routes/$hostname._index.tsx
+++ b/dashboard/app/routes/$hostname._index.tsx
@@ -92,8 +92,6 @@ export default function Index() {
},
];
- console.log(stats.properties);
-
return (
<>