Merge branch 'main' into feat/example-sveltekit

Author: s-petey

_includes/layout.tsx

@@ -62,7 +62,7 @@ export default function Layout(data: Lume.Data) {
         <link rel="stylesheet" href="/gfm.css" />
         <link rel="stylesheet" href="/styles.css" />
         <link rel="stylesheet" href="/overrides.css" />
-        <script src="/darkmode.client.js"></script>
+        <script src="/js/darkmode.client.js"></script>
         <link rel="stylesheet" href="/style.css" />
         <link rel="stylesheet" href="/components.css" />
         <script type="module" src="/sidebar.client.js"></script>

examples/_components/SnippetComponent.tsx

@@ -1,5 +1,5 @@
-import { ExampleSnippet } from "../types.ts";
 import Prism from "prismjs";
+import { ExampleSnippet } from "../types.ts";
 
 export default function SnippetComponent(props: {
   filename: string;
@@ -13,9 +13,11 @@ export default function SnippetComponent(props: {
   return (
     <div class="grid grid-cols-1 sm:grid-cols-10 gap-x-8">
       <div
-        class={`italic text-right select-none text-sm ${
+        class={`italic select-none text-sm text-balance ${
           props.snippet.text ? "pb-4 mt-4 md:pb-0 " : " "
-        } ${props.snippet.code ? "col-span-3" : "mt-4 col-span-full"}`}
+        } ${
+          props.snippet.code ? "col-span-5 sm:col-span-3" : "mt-4 col-span-full"
+        }`}
       >
         {props.snippet.text}
       </div>

examples/_pages/ExamplePage.tsx

@@ -17,7 +17,7 @@ export default function ExamplePage({ example }: Props) {
   }`;
 
   return (
-    <>
+    <div data-content="example">
       <div class="flex flex-col gap-4 md:flex-row justify-between items-start md:items-center relative">
         <div class="flex flex-col gap-2">
           {example.parsed.description && (
@@ -37,7 +37,7 @@ export default function ExamplePage({ example }: Props) {
           Edit on Github
         </a>
       </div>
-      <div class="relative block">
+      <div class="relative block mt-8">
         <CopyButton text={contentNoCommentary} />
       </div>
       {example.parsed.files.map((file) => (
@@ -122,6 +122,6 @@ export default function ExamplePage({ example }: Props) {
           </div>
         )}
       </div>
-    </>
+    </div>
   );
 }

overrides.css

@@ -34,6 +34,10 @@ that are generated by deno_doc, the tool that powers the API reference documenta
     @apply -mx-4 !important;
   }
 
+  [data-content="example"] .markdown-body .highlight {
+    @apply m-0 !important;
+  }
+
   .ddoc .markdown-body pre > code:first-child {
     @apply px-4 !important;
   }

runtime/_data.ts

@@ -58,18 +58,22 @@ export const sidebar = [
             label: "deno bench",
             id: "/runtime/reference/cli/bench/",
           },
-          {
-            label: "deno completions",
-            id: "/runtime/reference/cli/completions/",
-          },
           {
             label: "deno check",
             id: "/runtime/reference/cli/check/",
           },
+          {
+            label: "deno clean",
+            id: "/runtime/reference/cli/clean/",
+          },
           {
             label: "deno compile",
             id: "/runtime/reference/cli/compile/",
           },
+          {
+            label: "deno completions",
+            id: "/runtime/reference/cli/completions/",
+          },
           {
             label: "deno coverage",
             id: "/runtime/reference/cli/coverage/",

runtime/getting_started/command_line_interface.md

@@ -91,17 +91,16 @@ below.
 
 ### Watch mode
 
-You can supply the `--watch` flag to `deno run`, `deno test`, `deno compile`,
-and `deno fmt` to enable the built-in file watcher. The watcher enables
-automatic reloading of your application whenever changes are detected in the
-source files. This is particularly useful during development, as it allows you
-to see the effects of your changes immediately without manually restarting the
-application.
+You can supply the `--watch` flag to `deno run`, `deno test`, and `deno fmt` to
+enable the built-in file watcher. The watcher enables automatic reloading of
+your application whenever changes are detected in the source files. This is
+particularly useful during development, as it allows you to see the effects of
+your changes immediately without manually restarting the application.
 
 The files that are watched will depend on the subcommand used:
 
-- for `deno run`, `deno test`, and `deno compile` the entrypoint, and all local
-  files that the entrypoint statically imports will be watched.
+- for `deno run` and `deno test` the entrypoint, and all local files that the
+  entrypoint statically imports will be watched.
 - for `deno fmt` all local files and directories specified as command line
   arguments (or the working directory if no specific files/directories is
   passed) are watched.

runtime/reference/cli/clean.md

@@ -0,0 +1,4 @@
+---
+title: "deno clean"
+command: clean
+---