github-profile-toolkit/test-pokemon.html at main · junye0l/github-profile-toolkit · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Pokemon Badge Test</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            max-width: 800px;
            margin: 50px auto;
            padding: 20px;
            background: #f5f5f5;
        }
        .test-section {
            background: white;
            padding: 20px;
            margin: 20px 0;
            border-radius: 8px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        h2 {
            color: #333;
            border-bottom: 2px solid #6366f1;
            padding-bottom: 10px;
        }
        img {
            max-width: 100%;
            border-radius: 8px;
            margin: 10px 0;
        }
    </style>
</head>
<body>
    <h1>🎮 Pokemon Badge Display Test</h1>

    <div class="test-section">
        <h2>Test 1: Pikachu Line (junye0l - 892 commits)</h2>
        <img src="http://localhost:3000/api/pokemon?user=junye0l&chain=pikachu" alt="Pikachu Badge">
    </div>

    <div class="test-section">
        <h2>Test 2: Charmander Line (junye0l)</h2>
        <img src="http://localhost:3000/api/pokemon?user=junye0l&chain=charmander" alt="Charmander Badge">
    </div>

    <div class="test-section">
        <h2>Test 3: Eevee Line (junye0l)</h2>
        <img src="http://localhost:3000/api/pokemon?user=junye0l&chain=eevee" alt="Eevee Badge">
    </div>

    <div class="test-section">
        <h2>Markdown Code (Copy this to README):</h2>
        <pre style="background: #f8f8f8; padding: 15px; border-radius: 4px; overflow-x: auto;">
&lt;div align="center"&gt;
  &lt;img src="http://localhost:3000/api/pokemon?user=junye0l&chain=pikachu" alt="My Pokemon" /&gt;
&lt;/div&gt;</pre>
    </div>

    <div class="test-section">
        <h2>✅ Tests to Verify:</h2>
        <ul>
            <li>✓ GIF animation is visible inside the card</li>
            <li>✓ Commit count shows correctly (892)</li>
            <li>✓ Evolution stage indicator is accurate (Stage 1 active)</li>
            <li>✓ Next evolution info shows remaining commits</li>
            <li>✓ Korean and English names display properly</li>
        </ul>
    </div>
</body>
</html>