packages/cli/test.html 1.4 K raw
1
<!DOCTYPE html>
2
<html lang="en">
3
<head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Sequoia Comments Test</title>
7
  <!-- Link to a published document - replace with your own AT URI -->
8
  <link rel="site.standard.document" href="at://did:plc:kq6bvkw4sxof3vdinuitehn5/site.standard.document/3mdnztyhoem2v">
9
  <style>
10
    body {
11
      font-family: system-ui, -apple-system, sans-serif;
12
      max-width: 800px;
13
      margin: 2rem auto;
14
      padding: 0 1rem;
15
      line-height: 1.6;
16
      background-color: #1A1A1A;
17
      color: #F5F3EF;
18
    }
19
    h1 {
20
      margin-bottom: 2rem;
21
    }
22
    /* Custom styling example */
23
     :root {
24
      --sequoia-accent-color: #3A5A40;
25
      --sequoia-border-radius: 12px;
26
      --sequoia-bg-color: #1a1a1a;
27
      --sequoia-fg-color: #F5F3EF;
28
      --sequoia-border-color: #333;
29
      --sequoia-secondary-color: #8B7355;
30
    }
31
  </style>
32
</head>
33
<body>
34
  <h1>Blog Post Title</h1>
35
  <p>This is a test page for the sequoia-comments web component.</p>
36
  <p>The component will look for a <code>&lt;link rel="site.standard.document"&gt;</code> tag in the document head to find the AT Protocol document, then fetch and display Bluesky replies as comments.</p>
37
38
  <h2>Comments</h2>
39
  <sequoia-comments></sequoia-comments>
40
41
  <script type="module" src="./src/components/sequoia-comments.js"></script>
42
</body>
43
</html>