cli + tui to publish to leaflet (wip) & manage tasks, notes & watch/read lists 🍃
desertthunder.dev
charm
leaflet
readability
golang
1import Heading from "@theme/Heading";
2import clsx from "clsx";
3import type { ReactNode } from "react";
4import styles from "./styles.module.css";
5
6type FeatureItem = { title: string; description: ReactNode; theme: keyof typeof themeClassMap };
7
8const themeClassMap = {
9 primary: styles.featureCardPrimary,
10 info: styles.featureCardInfo,
11 success: styles.featureCardSuccess,
12 warning: styles.featureCardWarning,
13 accent: styles.featureCardAccent,
14 plum: styles.featureCardPlum,
15 danger: styles.featureCardDanger,
16};
17
18const FeatureList: FeatureItem[] = [{
19 title: "Terminal-First Interface",
20 description: (
21 <>Built for the command line with a beautiful, keyboard-driven interface powered by Bubble Tea and Fang.</>
22 ),
23 theme: "primary",
24}, {
25 title: "Task Management",
26 description: (
27 <>Organize your tasks with projects, priorities, tags, contexts, due dates, and recurrence—all from a single CLI.</>
28 ),
29 theme: "danger",
30}, {
31 title: "Leaflet.pub Publishing",
32 description: (
33 <>
34 Sync Markdown notes with leaflet.pub, push updates over AT Protocol, and manage drafts without leaving the
35 terminal.
36 </>
37 ),
38 theme: "accent",
39}, {
40 title: "Articles & Readability",
41 description: (
42 <>
43 Capture the clean content of any article, store Markdown + HTML copies, and enjoy a terminal reader inspired by
44 Readability.
45 </>
46 ),
47 theme: "warning",
48}, {
49 title: "Knowledge Base",
50 description: (
51 <>Keep notes, track books, movies, and TV shows. Link everything together with tags, IDs, and shared metadata.</>
52 ),
53 theme: "info",
54}, {
55 title: "Open Source & MIT Licensed",
56 description: (
57 <>
58 Built in the open on GitHub under the MIT license. Fork it, extend it, and make Noteleaf part of your own
59 workflows.
60 </>
61 ),
62 theme: "plum",
63}];
64
65function Feature({ title, description, theme }: FeatureItem) {
66 const cardClass = themeClassMap[theme] ?? themeClassMap.primary;
67 return (
68 <div className={clsx("col col--4")}>
69 <div className={clsx("text--left padding-horiz--md", styles.featureCard, cardClass)}>
70 <Heading as="h3" className={styles.featureTitle}>{title}</Heading>
71 <p className={styles.featureCopy}>{description}</p>
72 </div>
73 </div>
74 );
75}
76
77export default function HomepageFeatures(): ReactNode {
78 return (
79 <section className={styles.features}>
80 <div className="container">
81 <div className="row">{FeatureList.map((props, idx) => <Feature key={idx} {...props} />)}</div>
82 </div>
83 </section>
84 );
85}