Kh.add topos zkevm demo (#28)

config.ts

@@ -74,13 +74,17 @@ const config: Config = {
           label: 'Topos Playground',
           path: '/content/module-2/3-topos-playground.html',
         },
+        {
+          label: 'Topos zkEVM Demo',
+          path: '/content/module-2/4-topos-zkevm-demo.html',
+        },
         {
           label: 'Topos CLI',
-          path: '/content/module-2/4-cli.html',
+          path: '/content/module-2/5-cli.html',
         },
         {
           label: 'Topos Testnet',
-          path: '/content/module-2/5-testnet.html',
+          path: '/content/module-2/6-testnet.html',
         },
       ],
     },

content/module-2/3-topos-playground.md

@@ -197,4 +197,4 @@ One thing to mention specifically in relation to the Playground is the [use of t
 
 # Up next
 
-You have now looked at the details of the playground components, one of them being the Topos CLI. In the next section, you will look at the CLI in more depth.
+You have now looked at the details of the playground components. In the next section you will learn how to run the topos-zkevm-demo, which allows you to run and use a zkevm in your local environment.

content/module-2/4-cli.md → content/module-2/5-cli.md

@@ -33,7 +33,7 @@ $ cargo install topos --git https://github.com/topos-protocol/topos --tag v0.0.5
 
 In a new `topos-cli.dockerfile`, put:
 
-```Dockerfile [topos-cli.dockerfile]
+```Dockerfile
 FROM rust:1.72.0-bullseye
 
 RUN apt-get update

content/module-2/index.md

@@ -37,12 +37,17 @@ The second chapter of the Topos Developer Portal brings you into contact with th
     </Card>
   </GridItem>
   <GridItem>
-    <Card title="4: Topos CLI" to={'/content/module-2/4-cli.html'}>
+    <Card title="4: Topos zkEVM Demo" to={'/content/module-2/4-topos-zkevm-demo.html'}>
+      Part of the power of Topos is the zkEVM. This unit shows you how to run the topos-zkevm-demo CLI tool in order to experience the power of the zkEVM on your local system.
+    </Card>
+  </GridItem>
+  <GridItem>
+    <Card title="5: Topos CLI" to={'/content/module-2/5-cli.html'}>
       The Topos CLI is frequently mentioned in this chapter – here you will look at it directly. You will install and test the tool that allows you to collectively start and run the different components you have been exploring.
     </Card>
   </GridItem>
   <GridItem>
-    <Card title="5: Topos Testnet phases" to={'/content/module-2/5-testnet.html'}>
+    <Card title="6: Topos Testnet phases" to={'/content/module-2/6-testnet.html'}>
       The Topos public testnet is there for our developer community to deploy apps and experiment with the novel interaction model the Topos protocol enables. It's an early preview of what is coming. In this section we present the upcoming phases to give interested parties and overview of the remaining phases.
     </Card>
   </GridItem>

package.json

@@ -46,6 +46,7 @@
     "react": "^18.2.0",
     "react-cookie": "^6.1.1",
     "react-dom": "^18.2.0",
+    "react-icons": "^5.0.1",
     "sharp": "^0.32.6",
     "watcher": "^2.3.0"
   },

src/components/layout/Layout.tsx

@@ -19,6 +19,7 @@ import { MdLink } from '../mdx/MdLink';
 import { Heading } from '../Heading';
 import { ZoomImage } from '../mdx/ZoomImage';
 import { MDXProvider } from '@mdx-js/react';
+
 import Base from '../base';
 import formatSlugToImageName from '../../utils/formatSlugToImageName';