style: Lucide TrendingUp/Down icons for rank change arrows

2026-04-12 16:07:02 +02:00
parent 4dd63a6818
commit 34be6546b1
1 changed files with 3 additions and 2 deletions
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
+import { TrendingUp, TrendingDown } from 'lucide-react';
 import { api, DashboardData, Match } from '../api/client';
 import TipModal from '../components/TipModal';
 import styles from './DashboardPage.module.css';
@@ -157,8 +158,8 @@ export default function DashboardPage(_props: Props) {
        <div className={`card ${styles.statTile}`}>
          <span className={styles.statValue}>
            {stats.rank !== null ? stats.rank : '—'}
-            {rankDiff > 0 && <span className={styles.rankUp}>↑{rankDiff}</span>}
-            {rankDiff < 0 && <span className={styles.rankDown}>↓{Math.abs(rankDiff)}</span>}
+            {rankDiff > 0 && <span className={styles.rankUp}><TrendingUp size={14} strokeWidth={2.5} /></span>}
+            {rankDiff < 0 && <span className={styles.rankDown}><TrendingDown size={14} strokeWidth={2.5} /></span>}
          </span>
          <span className={styles.statLabel}>Dein Rang</span>
        </div>