packages/cli/test.html 2.3 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>Subscribe Buttons</h2>
39
  <div style="display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-bottom: 2rem;">
40
    <sequoia-subscribe publication-uri="at://did:plc:kq6bvkw4sxof3vdinuitehn5/site.standard.publication/self"></sequoia-subscribe>
41
    <sequoia-subscribe publication-uri="at://did:plc:kq6bvkw4sxof3vdinuitehn5/site.standard.publication/self" button-type="bluesky"></sequoia-subscribe>
42
    <sequoia-subscribe publication-uri="at://did:plc:kq6bvkw4sxof3vdinuitehn5/site.standard.publication/self" button-type="blacksky"></sequoia-subscribe>
43
    <sequoia-subscribe publication-uri="at://did:plc:kq6bvkw4sxof3vdinuitehn5/site.standard.publication/self" button-type="atmosphere"></sequoia-subscribe>
44
    <sequoia-subscribe publication-uri="at://did:plc:kq6bvkw4sxof3vdinuitehn5/site.standard.publication/self" button-type="plain"></sequoia-subscribe>
45
  </div>
46
47
  <h2>Comments</h2>
48
  <sequoia-comments></sequoia-comments>
49
50
  <script type="module" src="./src/components/sequoia-subscribe.js"></script>
51
  <script type="module" src="./src/components/sequoia-comments.js"></script>
52
</body>
53
</html>