m/umami
1
0
Fork 0
mirror of https://github.com/kremalicious/umami.git synced 2025-02-06 01:15:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

Update event property styles.

Browse Source
This commit is contained in:
Mike Cao 2024-08-09 01:41:21 -07:00
parent 8ee37d1246
commit 67874a6282
2 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/app/(main)/websites/[websiteId]/events/EventProperties.module.css
View File

@ -1,7 +1,8 @@
.container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
gap: 30px;
grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
gap: 60px;
margin-bottom: 40px;
}
.table {
@ -12,3 +13,13 @@
cursor: pointer;
color: var(--primary400);
}
.title {
text-align: center;
font-weight: bold;
margin: 20px 0;
}
.chart {
min-height: 620px;
}

8
src/app/(main)/websites/[websiteId]/events/EventProperties.tsx
View File

@ -1,10 +1,10 @@
import { GridColumn, GridTable } from 'react-basics';
import { useEventDataProperties, useEventDataValues, useMessages } from 'components/hooks';
import { LoadingPanel } from 'components/common/LoadingPanel';
import styles from './EventProperties.module.css';
import PieChart from 'components/charts/PieChart';
import { useState } from 'react';
import { CHART_COLORS } from 'lib/constants';
import styles from './EventProperties.module.css';
export function EventProperties({ websiteId }: { websiteId: string }) {
const [propertyName, setPropertyName] = useState('');
@ -36,11 +36,11 @@ export function EventProperties({ websiteId }: { websiteId: string }) {
</div>
)}
</GridColumn>
<GridColumn name="total" label={formatMessage(labels.count)} />
<GridColumn name="total" label={formatMessage(labels.count)} alignment="end" />
</GridTable>
{propertyName && (
<div>
<strong>{propertyName}</strong>
<div className={styles.chart}>
<div className={styles.title}>{propertyName}</div>
<PieChart key={propertyName} type="doughnut" data={chartData} />
</div>
)}