A CLI for publishing standard.site documents to ATProto

chore: update docs

authored by stevedylan.dev and committed by tangled.org 9c1c78f8 2ea975e7

+113 -1
+18
docs/docs/pages/cli-reference.mdx
··· 32 32 33 33 Use this as an alternative to `login` when OAuth isn't available or for CI environments. 34 34 35 + ## `add` 36 + 37 + ```bash [Terminal] 38 + sequoia add <component> 39 + > Add a UI component to your project 40 + 41 + ARGUMENTS: 42 + component - The name of the component to add 43 + 44 + FLAGS: 45 + --help, -h - show help [optional] 46 + ``` 47 + 48 + Available components: 49 + - `sequoia-comments` - Display Bluesky replies as comments on your blog posts 50 + 51 + The component will be installed to the directory specified in `ui.components` (default: `src/components`). See the [Comments guide](/comments) for usage details. 52 + 35 53 ## `init` 36 54 37 55 ```bash [Terminal]
+83
docs/docs/pages/comments.mdx
··· 1 + # Comments 2 + 3 + Sequoia has a small UI trick up its sleve that lets you easily display comments on your blog posts through Bluesky posts. This is the general flow: 4 + 5 + 1. Setup your blog with `sequoia init`, and when prompted at the end to enable BlueSky posts, select `yes`. 6 + 2. When you run `sequoia pubish` the CLI will publish a BlueSky post and link it to your `site.standard.document` record for your post. 7 + 3. As people reply to the BlueSky post, the replies can be rendered as comments below your post using the Sequoia UI web component. 8 + 9 + ## Setup 10 + 11 + Run the following command in your project to install the comments web component. It will ask you where you would like to store the component file. 12 + 13 + ```bash [Terminal] 14 + sequoia add sequoia-comments 15 + ``` 16 + 17 + Then in your HTML or blog post template, import the component with a script tag or module import. 18 + 19 + ```html 20 + <body> 21 + <h1>Blog Post Title</h1> 22 + <!--Content--> 23 + <h2>Comments</h2> 24 + 25 + <sequoia-comments></sequoia-comments> // [!code focus] 26 + <script type="module" src="./src/components/sequoia-comments.js"></script> // [!code focus] 27 + 28 + </body> 29 + </html> 30 + ``` 31 + 32 + The web components will look for the `<link rel="site.standard.document" href="atUri"/>` in your HTML head, then using the `atUri` fetch the post and the replies. 33 + 34 + ::::tip 35 + For more information on the `<link>` tags, check out the [verification guide](/verifying) 36 + :::: 37 + 38 + ## Configuration 39 + 40 + The comments web component has several configuration options available. 41 + 42 + ### Attributes 43 + 44 + The `<sequoia-comments>` component accepts the following attributes: 45 + 46 + | Attribute | Type | Default | Description | 47 + |-----------|------|---------|-------------| 48 + | `document-uri` | `string` | - | AT Protocol URI for the document. Optional if a `<link rel="site.standard.document">` tag exists in the page head. | 49 + | `depth` | `number` | `6` | Maximum depth of nested replies to fetch. | 50 + 51 + ```html 52 + <!-- Use attributes for explicit control --> 53 + <sequoia-comments 54 + document-uri="at://did:plc:example/site.standard.document/abc123" 55 + depth="10"> 56 + </sequoia-comments> 57 + ``` 58 + 59 + ### Styling 60 + 61 + The component uses CSS custom properties for theming. Set these in your `:root` or parent element to customize the appearance: 62 + 63 + | CSS Property | Default | Description | 64 + |--------------|---------|-------------| 65 + | `--sequoia-fg-color` | `#1f2937` | Text color | 66 + | `--sequoia-bg-color` | `#ffffff` | Background color | 67 + | `--sequoia-border-color` | `#e5e7eb` | Border color | 68 + | `--sequoia-accent-color` | `#2563eb` | Accent/link color | 69 + | `--sequoia-secondary-color` | `#6b7280` | Secondary text color (handles, timestamps) | 70 + | `--sequoia-border-radius` | `8px` | Border radius for cards and buttons | 71 + 72 + ### Example: Dark Theme 73 + 74 + ```css 75 + :root { 76 + --sequoia-accent-color: #3A5A40; 77 + --sequoia-border-radius: 12px; 78 + --sequoia-bg-color: #1a1a1a; 79 + --sequoia-fg-color: #F5F3EF; 80 + --sequoia-border-color: #333; 81 + --sequoia-secondary-color: #8B7355; 82 + } 83 + ```
+6 -1
docs/docs/pages/config.mdx
··· 19 19 | `removeIndexFromSlug` | `boolean` | No | `false` | Remove `/index` or `/_index` suffix from slugs | 20 20 | `stripDatePrefix` | `boolean` | No | `false` | Remove `YYYY-MM-DD-` date prefixes from slugs (Jekyll-style) | 21 21 | `bluesky` | `object` | No | - | Bluesky posting configuration | 22 - | `bluesky.enabled` | `boolean` | No | `false` | Post to Bluesky when publishing documents | 22 + | `bluesky.enabled` | `boolean` | No | `false` | Post to Bluesky when publishing documents (also enables [comments](/comments)) | 23 23 | `bluesky.maxAgeDays` | `number` | No | `30` | Only post documents published within this many days | 24 + | `ui` | `object` | No | - | UI components configuration | 25 + | `ui.components` | `string` | No | `"src/components"` | Directory where UI components are installed | 24 26 25 27 ### Example 26 28 ··· 41 43 "bluesky": { 42 44 "enabled": true, 43 45 "maxAgeDays": 30 46 + }, 47 + "ui": { 48 + "components": "src/components" 44 49 } 45 50 } 46 51 ```
+6
docs/docs/pages/publishing.mdx
··· 66 66 } 67 67 ``` 68 68 69 + ## Comments 70 + 71 + When Bluesky posting is enabled, Sequoia links each published document to its corresponding Bluesky post. This enables comments on your blog posts through Bluesky replies. 72 + 73 + To display comments on your site, use the `sequoia-comments` web component. See the [Comments guide](/comments) for setup instructions. 74 + 69 75 ## Troubleshooting 70 76 71 77 - If you have files in your markdown directory that should be ignored, use the [`ignore` array in the config](/config#ignoring-files).