diff --git a/assets/files-toml.png b/assets/files-toml.png new file mode 100644 index 0000000..d5c6247 Binary files /dev/null and b/assets/files-toml.png differ diff --git a/assets/zsh-integration.png b/assets/zsh-integration.png new file mode 100644 index 0000000..3c25116 Binary files /dev/null and b/assets/zsh-integration.png differ diff --git a/justfile b/justfile index f42da33..8d92843 100644 --- a/justfile +++ b/justfile @@ -150,3 +150,7 @@ bump-version kind='patch': fi git add Cargo.toml echo "Done" + +# Start a local development server for the project's website +@start-website: + cd website && pnpm install && pnpm start diff --git a/website/src/components/HomepageFeatures/index.tsx b/website/src/components/HomepageFeatures/index.tsx index a052595..ae3b4a4 100644 --- a/website/src/components/HomepageFeatures/index.tsx +++ b/website/src/components/HomepageFeatures/index.tsx @@ -5,46 +5,39 @@ import styles from "./styles.module.css"; type FeatureItem = { title: string; - Svg: React.ComponentType>; + imgSrc: string; description: ReactNode; }; const FeatureList: FeatureItem[] = [ { - title: "Integrates with your shell", - Svg: require("@site/static/img/integrate_icon.svg").default, + title: "Create your own channels", + imgSrc: require("@site/static/img/files-toml.png").default, description: ( <> - Television integrates with your shell and lets you quickly search - through any kind of data source (files, git repositories, environment - variables, docker images, you name it) using a fuzzy matching algorithm - and is designed to be extensible. + Create your own channels in a simple TOML file and search through + files, git repositories, environment variables, docker images, and more. + ), }, { - title: "Insipred by great tools", - Svg: require("@site/static/img/inspired_icon.svg").default, + title: "Integrates with your shell", + imgSrc: require("@site/static/img/zsh-integration.png").default, description: ( <> - It is inspired by the neovim{" "} - telescope{" "} - plugin and leverages{" "} - tokio and the{" "} - nucleo matcher used - by the helix editor - to ensure optimal performance. + + Television integrates with your shell and provides autocompletion that is both + extensible and configurable to use your own channels. + ), }, ]; -function Feature({ title, Svg, description }: FeatureItem) { +function Feature({ title, imgSrc, description }: FeatureItem) { return (
-
- -
{title}

{description}

+
+ {title} +
); } diff --git a/website/src/components/HomepageFeatures/styles.module.css b/website/src/components/HomepageFeatures/styles.module.css index 1a8e136..92b05d0 100644 --- a/website/src/components/HomepageFeatures/styles.module.css +++ b/website/src/components/HomepageFeatures/styles.module.css @@ -5,6 +5,22 @@ width: 100%; } +.featureImageContainer { + display: flex; + flex-direction: column; + align-items: center; + width: 100%; +} + +.featureImage { + display: flex; + width: 80%; + justify-content: center; + margin: 0 auto; + border-radius: 6px; + border: 3px dotted var(--ifm-font-color-secondary); +} + .featureSvg { height: 120px; width: 120px; @@ -23,4 +39,4 @@ html[data-theme='dark'] .featureSvg { display: flex; flex-direction: column; align-items: center; -} \ No newline at end of file +} diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css index 1b3d0ce..1533fc4 100644 --- a/website/src/pages/index.module.css +++ b/website/src/pages/index.module.css @@ -18,6 +18,7 @@ justify-content: center; gap: 2rem; margin-top: 2rem; + margin-bottom: 2rem; padding: 0 2rem; } @@ -155,4 +156,4 @@ .main { margin-bottom: 3rem; -} \ No newline at end of file +} diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx index b9f4270..c64f259 100644 --- a/website/src/pages/index.tsx +++ b/website/src/pages/index.tsx @@ -4,6 +4,7 @@ import Link from "@docusaurus/Link"; import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; import Layout from "@theme/Layout"; import Heading from "@theme/Heading"; +import HomepageFeatures from "@site/src/components/HomepageFeatures"; import styles from "./index.module.css"; @@ -21,7 +22,7 @@ function HomepageHeader() { export default function Home(): ReactNode { return ( - +
@@ -65,6 +66,7 @@ export default function Home(): ReactNode {
+
diff --git a/website/static/img/files-toml.png b/website/static/img/files-toml.png new file mode 100644 index 0000000..d5c6247 Binary files /dev/null and b/website/static/img/files-toml.png differ diff --git a/website/static/img/zsh-integration.png b/website/static/img/zsh-integration.png new file mode 100644 index 0000000..3c25116 Binary files /dev/null and b/website/static/img/zsh-integration.png differ