forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-04-20 13:36:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improved welcome screen

Browse Source
This commit is contained in:
Alejandro Celaya
2020-12-20 12:17:12 +01:00
parent fa949cde12
commit 260a6c4940
14 changed files with 203 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/visits/helpers/DefaultChart.tsx
View File

@@ -7,6 +7,7 @@ import { fillTheGaps } from '../../utils/helpers/visits';
import { Stats } from '../types';
import { prettify } from '../../utils/helpers/numbers';
import { pointerOnHover, renderDoughnutChartLabel, renderNonDoughnutChartLabel } from '../../utils/helpers/charts';
import { HIGHLIGHTED_COLOR, HIGHLIGHTED_COLOR_ALPHA, MAIN_COLOR, MAIN_COLOR_ALPHA } from '../../utils/theme';
import './DefaultChart.scss';
export interface DefaultChartProps {
@@ -33,7 +34,7 @@ const generateGraphData = (
title,
label: highlightedData ? 'Non-selected' : 'Visits',
data,
backgroundColor: isBarChart ? 'rgba(70, 150, 229, 0.4)' : [
backgroundColor: isBarChart ? MAIN_COLOR_ALPHA : [
'#97BBCD',
'#F7464A',
'#46BFBD',
@@ -46,15 +47,15 @@ const generateGraphData = (
'#DCDCDC',
'#463730',
],
borderColor: isBarChart ? 'rgba(70, 150, 229, 1)' : 'white',
borderColor: isBarChart ? MAIN_COLOR : 'white',
borderWidth: 2,
},
highlightedData && {
title,
label: highlightedLabel ?? 'Selected',
data: highlightedData,
backgroundColor: 'rgba(247, 127, 40, 0.4)',
borderColor: '#F77F28',
backgroundColor: HIGHLIGHTED_COLOR_ALPHA,
borderColor: HIGHLIGHTED_COLOR,
borderWidth: 2,
},
].filter(Boolean) as ChartDataSets[],

5
src/visits/helpers/LineChartCard.tsx
View File

@@ -19,6 +19,7 @@ import { rangeOf } from '../../utils/utils';
import ToggleSwitch from '../../utils/ToggleSwitch';
import { prettify } from '../../utils/helpers/numbers';
import { pointerOnHover, renderNonDoughnutChartLabel } from '../../utils/helpers/charts';
import { HIGHLIGHTED_COLOR, MAIN_COLOR } from '../../utils/theme';
import './LineChartCard.scss';
interface LineChartCardProps {
@@ -173,8 +174,8 @@ const LineChartCard = (
const data: ChartData = {
labels,
datasets: [
generateDataset(groupedVisits, 'Visits', '#4696e5'),
highlightedVisits.length > 0 && generateDataset(groupedHighlighted, highlightedLabel, '#F77F28'),
generateDataset(groupedVisits, 'Visits', MAIN_COLOR),
highlightedVisits.length > 0 && generateDataset(groupedHighlighted, highlightedLabel, HIGHLIGHTED_COLOR),
].filter(Boolean) as ChartDataSets[],
};
const options: ChartOptions = {