diff --git a/lint/_data.ts b/lint/_data.ts
index a7d426ad..df994d47 100644
--- a/lint/_data.ts
+++ b/lint/_data.ts
@@ -1,7 +1,7 @@
-import { Sidebar, SidebarLink } from "../types.ts";
+import { extractYaml } from "jsr:@std/front-matter@1.0.5";
import { walk } from "jsr:@std/fs";
import { basename } from "jsr:@std/path";
-import { extractYaml } from "jsr:@std/front-matter@1.0.5";
+import { Sidebar, SidebarLink } from "../types.ts";
async function generateSidebarItems() {
const sidebarItems = [];
@@ -43,9 +43,9 @@ export const lintRulePages = await generateSidebarItems();
export const sidebar = [
{
- title: "Lint rules",
+ title: "Deno lint rules",
items: lintRulePages,
},
] satisfies Sidebar;
-export const sectionTitle = "Lint rules";
+export const sectionTitle = "Deno lint rules";
diff --git a/lint/index.md b/lint/index.md
deleted file mode 100644
index 7a4b1dcd..00000000
--- a/lint/index.md
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Lint rules
-templateEngine: [vto, md]
----
-
-
-
-{{ for lintRule of lintRulePages }}
-
-
-
-{{ /for }}
-
-
diff --git a/lint/index.tsx b/lint/index.tsx
new file mode 100644
index 00000000..71ccc36c
--- /dev/null
+++ b/lint/index.tsx
@@ -0,0 +1,65 @@
+type LintIconType = "jsr" | "react" | "jsx" | "recommended" | "fresh";
+
+export const title = "Lint rules";
+export const toc = [];
+
+const getReadableIconName = (iconType: LintIconType) => {
+ if (["jsx", "jsr"].includes(iconType)) {
+ return iconType.toUpperCase();
+ }
+ return iconType.charAt(0).toUpperCase() + iconType.slice(1);
+};
+
+const getLintIcon = (
+ type: LintIconType,
+) => {
+ const svgFileName = type === "recommended" ? "checkmark" : type;
+ return (
+
+ );
+};
+
+export default function LintRulesIndex(
+ data: Lume.Data,
+ _helpers: Lume.Helpers,
+) {
+ const TYPES = [
+ "recommended",
+ "fresh",
+ "jsx",
+ "react",
+ "jsr",
+ ] as LintIconType[];
+ return (
+
+
+ {TYPES.map((iconType) => (
+ -
+ {getLintIcon(iconType)} = {getReadableIconName(iconType)}
+
+ ))}
+
+
+
+ {data.lintRulePages.map((lintRule) => (
+ -
+
+
+ Lorem ipsum dolor sit amet,
consectetur
{" "}
+ adipiscing elit, sed do eiusmod tempor.
+
+
+ ))}
+
+
+ );
+}
diff --git a/static/img/checkmark.svg b/static/img/checkmark.svg
new file mode 100644
index 00000000..931ce25c
--- /dev/null
+++ b/static/img/checkmark.svg
@@ -0,0 +1,10 @@
+
\ No newline at end of file
diff --git a/static/img/fresh.svg b/static/img/fresh.svg
new file mode 100644
index 00000000..8ae349e1
--- /dev/null
+++ b/static/img/fresh.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/static/img/jsr.svg b/static/img/jsr.svg
new file mode 100644
index 00000000..663024d6
--- /dev/null
+++ b/static/img/jsr.svg
@@ -0,0 +1,6 @@
+
diff --git a/static/img/jsx.svg b/static/img/jsx.svg
new file mode 100644
index 00000000..f6e65f7c
--- /dev/null
+++ b/static/img/jsx.svg
@@ -0,0 +1,7 @@
+
\ No newline at end of file
diff --git a/static/img/react.svg b/static/img/react.svg
new file mode 100644
index 00000000..e07b1011
--- /dev/null
+++ b/static/img/react.svg
@@ -0,0 +1,9 @@
+
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
index 88a6b36c..f33c565a 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -2,7 +2,7 @@
/** @type {import('npm:tailwindcss').Config} */
export default {
content: [
- "{by-example,deploy,_components,_includes,runtime,static,subhosting,404,examples}/**/*.{md,ts,tsx}",
+ "{by-example,deploy,_components,_includes,runtime,static,subhosting,404,examples,lint}/**/*.{md,ts,tsx}",
"*.{ts,tsx}",
],
corePlugins: {