rift-js/test-rift.html at main · mfbz/rift-js · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Rift Test Page</title>
    <style>
        body {
            font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
            max-width: 800px;
            margin: 0 auto;
            padding: 2rem;
            line-height: 1.6;
        }
        .rift-link {
            display: inline-block;
            margin: 1rem 0;
            padding: 1rem 2rem;
            background-color: #4361ee;
            color: white;
            text-decoration: none;
            border-radius: 8px;
            font-weight: 600;
        }
        .info-box {
            background-color: #f8f9fa;
            border-left: 4px solid #4361ee;
            padding: 1rem;
            margin: 1rem 0;
            border-radius: 0 8px 8px 0;
        }
    </style>
</head>
<body>
    <h1>Rift Protocol Test Page</h1>

    <p>This page contains a Rift link which should be detected by the Harpoon wallet extension.</p>

    <div class="info-box">
        <p><strong>How it works:</strong></p>
        <ol>
            <li>Make sure your Rift Frame is running on <code>localhost:3000</code></li>
            <li>Make sure you have the Harpoon wallet extension installed</li>
            <li>Click the link below or wait for Harpoon to detect it automatically</li>
            <li>Approve the injection when prompted</li>
            <li>The Rift Frame should appear on this page</li>
        </ol>
    </div>

    rift://localhost:3000?rift-color=4E71FF

    rift://localhost:3000/nft-minter?rift-height=tall&rift-color=8200db

    rift://localhost:3000/nft-carousel?rift-height=standard

    rift://localhost:3000/token-buy?rift-height=compact&rift-color=00EF8B

    <div class="info-box">
        <p><strong>Troubleshooting:</strong></p>
        <ul>
            <li>If nothing happens, check if Harpoon wallet is properly installed</li>
            <li>Ensure your Rift Frame is running at the correct URL</li>
            <li>Check browser console for any errors</li>
        </ul>
    </div>
</body>
</html>