Merge pull request #7 from scroll-tech/develop

Update from main repo

Author: Turupawn

.nvmrc

@@ -1 +1 @@
-v16.15.0
+v20.13.1

.tool-versions

@@ -1 +1 @@
-nodejs 16.16.0
+nodejs 18.14.1

README.md

@@ -16,6 +16,24 @@ npm install && npm run dev
 - All articles are markdown and stored in `/src/content/docs/`.
 - Navigation is JSON in `/src/config/sidebar.ts`
 
+## Tooling on Scroll
+
+If you'd like to add an entry to our [tooling list](http://docs.scroll.xyz/en/developers/scroll-contracts), create a PR to add a new `mdx` file in the [tooling content folder](src/content/tools), using the following template. You can also refer to other existing entries for reference.
+
+```
+---
+name: "Safe"
+category: ["Identity", "Wallet"]
+excerpt: "Safe allows you to create smart wallet on chain."
+logo: { src: "https://app.safe.global/images/safe-logo-green.png", alt: "Safe Logo" }
+website: "https://app.safe.global"
+network: ["Mainnet", "Testnet]
+noAdditionalInfo: false
+---
+
+Add additional info here about how to access this tool on Scroll (ex. contract addresses, tutorials, API URLs)
+```
+
 ## Credits
 
 - Special thanks to the Chainlink team whose documentation we forked. Their repo is available [here](https://github.com/smartcontractkit/documentation) and viewable at [https://docs.chain.link/](https://docs.chain.link/).

astro-i18next.config.ts

@@ -2,6 +2,6 @@
 export default {
   defaultLocale: "en",
   showDefaultLocale: true,
-  locales: ["en", "zh", "es"],
+  locales: ["en", "es", "zh", "tr"],
   load: ["server", "client"],
 }

astro.config.ts

@@ -1,27 +1,29 @@
 import { defineConfig } from "astro/config"
 import preact from "@astrojs/preact"
 import react from "@astrojs/react"
+import svgr from "vite-plugin-svgr"
 import astroI18next from "astro-i18next"
 import { astroCallouts, asideAutoImport } from "./integrations/astro-callouts"
 import { solidityRemixCode, codeSampleAutoImport } from "./integrations/solidity-remix"
-import { youtubeEmbed } from "./integrations/youtube-embed"
 import mdx from "@astrojs/mdx"
 import rehypeSlug from "rehype-slug"
 import rehypeAutolinkHeadings from "rehype-autolink-headings"
 import rehypeKatex from "rehype-katex"
 import rehypeMermaid from "rehype-mermaidjs"
 import remarkGfm from "remark-gfm"
 import remarkMath from "remark-math"
-import image from "@astrojs/image"
 import AutoImport from "astro-auto-import"
 
 import sitemap from "@astrojs/sitemap"
 
 import tailwind from "@astrojs/tailwind"
 
+import expressiveCode from "astro-expressive-code"
+
 // https://astro.build/config
 export default defineConfig({
   site: "https://docs.scroll.io",
+  scopedStyleStrategy: "where",
   legacy: {
     astroFlavoredMarkdown: true,
   },
@@ -32,21 +34,38 @@ export default defineConfig({
     preact({
       compat: true,
     }),
+
     sitemap({
       changefreq: "daily",
     }),
     astroCallouts(),
     solidityRemixCode(),
-    youtubeEmbed(),
+    expressiveCode({
+      themes: ["dark-plus"],
+      defaultProps: {
+        frame: "code",
+      },
+      styleOverrides: {
+        borderRadius: "27px",
+        borderColor: "transparent",
+        frames: {
+          shadowColor: "transparent",
+          editorTabBorderRadius: "0.5rem",
+          editorBackground: "#2b2b2b",
+        },
+      },
+    }),
     mdx(),
-    image(),
     tailwind({
-      // Example: Disable injecting a basic `base.css` import on every page.
-      // Useful if you need to define and/or import your own custom `base.css`.
-      config: { applyBaseStyles: false },
+      applyBaseStyles: false,
+      nesting: true,
     }),
+
     astroI18next(),
   ],
+  vite: {
+    plugins: [svgr()],
+  },
   markdown: {
     drafts: true,
     remarkPlugins: [remarkMath, remarkGfm],
@@ -56,7 +75,14 @@ export default defineConfig({
       [
         rehypeAutolinkHeadings,
         {
-          behavior: "append",
+          behavior: "wrap",
+          properties: {},
+          content: {
+            type: "element",
+            tagName: "span",
+            properties: { className: ["icon", "icon-link"] },
+            children: [],
+          },
         },
       ],
       [

integrations/utils/makeComponentNode.ts

@@ -21,7 +21,7 @@ export function makeComponentNode(
     type: "mdxJsxFlowElement",
     name,
     attributes: Object.entries(attributes)
-      // Filter out non-truthy attributes to avoid empty attrs being parsed as `true`.
+      // Filter out non-truthy attributes to avoid empty attributes being parsed as `true`.
       .filter(([_k, v]) => v !== false && Boolean(v))
       .map(([name, value]) => ({
         type: "mdxJsxAttribute",