From 5682d6c4a999a54a0ca2aa24f7d8dea0d92c236e Mon Sep 17 00:00:00 2001
From: Sergey Rodin <sergeyrodin.sr@gmail.com>
Date: Wed, 19 Jun 2024 10:11:56 +0700
Subject: [PATCH] feat: add sample blog post

---
 blog/example-post.md                          | 24 +++++++++++++++++++
 docusaurus.config.js                          | 11 +++++++++
 src/components/homepage-features/Features.tsx | 12 +++++++++-
 src/components/homepage-features/blog.svg     | 24 +++++++++++++++++++
 4 files changed, 70 insertions(+), 1 deletion(-)
 create mode 100644 blog/example-post.md
 create mode 100644 src/components/homepage-features/blog.svg

diff --git a/blog/example-post.md b/blog/example-post.md
new file mode 100644
index 0000000..b167c98
--- /dev/null
+++ b/blog/example-post.md
@@ -0,0 +1,24 @@
+---
+title: Welcome Ronin blog
+description: First post on the Ronin technical blog.
+slug: welcome-ronin
+authors:
+  - name: Sergey Rodin
+    title: Technical writer
+    url: https://github.com/RodinGologin
+    image_url: https://github.com/RodinGolodin.png
+  - name: Phuc Thai
+    title: Blockchain researcher
+    url: https://sebastienlorber.comhttps://github.com/phuctd95
+    image_url: https://github.com/phuctd95.png
+tags: [hello]
+hide_table_of_contents: false
+---
+
+Welcome to this blog. This blog is created with [**Docusaurus 3**](https://docusaurus.io/).
+
+<!-- truncate -->
+
+This is my first post on Docusaurus 3.
+
+A whole bunch of exploration to follow.
diff --git a/docusaurus.config.js b/docusaurus.config.js
index 350d91a..4d1e6f8 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -63,6 +63,11 @@ const config = {
           showLastUpdateTime: true,
         },
         blog: {
+          path: 'blog',
+          blogTitle: 'Technical blog',
+          blogDescription: 'Learn about the latest updates on Ronin',
+          routeBasePath: 'blog',
+          blogSidebarTitle: 'Technical blog',
           showReadingTime: true,
         },
         theme: {
@@ -173,6 +178,12 @@ const config = {
             label: 'Bridge operators',
             to: 'bridge-operators',
           },
+          // Blog
+          {
+            label: 'Blog',
+            to: 'blog',
+            position: 'right',
+          },
           // Search
           {
             type: 'search',
diff --git a/src/components/homepage-features/Features.tsx b/src/components/homepage-features/Features.tsx
index e267c14..91f7bea 100644
--- a/src/components/homepage-features/Features.tsx
+++ b/src/components/homepage-features/Features.tsx
@@ -1,7 +1,8 @@
 import React from 'react'
 
-import BoxTickIcon from './box-tick.svg'
 import { Card } from './Card'
+import BlogIcon from './blog.svg'
+import BoxTickIcon from './box-tick.svg'
 import CoinIcon from './coins.svg'
 import AppsIcon from './apps.svg'
 import ListViewIcon from './list-view.svg'
@@ -53,6 +54,15 @@ const featureList = [
       title: 'Bridge operators',
     },
   },
+  {
+    title: 'Technical blog',
+    Icon: BlogIcon,
+    description: <>Stay up to date with the latest technical updates on Ronin.</>,
+    link: {
+      href: '/blog',
+      title: 'Technical blog',
+    },
+  },
 ]
 
 export const Features: React.FC = () => {
diff --git a/src/components/homepage-features/blog.svg b/src/components/homepage-features/blog.svg
new file mode 100644
index 0000000..0cae39d
--- /dev/null
+++ b/src/components/homepage-features/blog.svg
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 24 24">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #0666dc;
+      }
+
+      .cls-1, .cls-2 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #fff;
+      }
+    </style>
+  </defs>
+  <path class="cls-1" d="M21.3,7.4c0-.1-.1-.2-.2-.3L15.2,1.2c0,0-.2-.1-.3-.2-.1,0-.2,0-.3,0H4.3c-.5,0-.9.2-1.2.5-.3.3-.5.8-.5,1.2v18.8c0,.5.2.9.5,1.2.3.3.8.5,1.2.5h15.3c.5,0,.9-.2,1.2-.5s.5-.7.5-1.2V7.8c0-.1,0-.2,0-.3Z"/>
+  <g>
+    <path class="cls-2" d="M11.1,17.3l-3.7-2c-.1,0-.2-.2-.2-.3v-4c0-.2.3-.4.5-.3l3.7,2.1c0,0,.2.2.2.3v4c0,.2-.3.4-.5.3Z"/>
+    <path class="cls-2" d="M8.1,9.4l3.7-2.1c0,0,.2,0,.3,0l3.7,2.1c.2.1.2.4,0,.5l-3.7,2.1c0,0-.2,0-.3,0l-3.7-2.1c-.2-.1-.2-.4,0-.5Z"/>
+    <path class="cls-2" d="M16.6,15.2l-3.8,2.1c-.2.1-.5,0-.5-.3v-4c0-.1,0-.2.2-.3l3.8-2.1c.2-.1.5,0,.5.3v4c0,.1,0,.2-.2.3Z"/>
+  </g>
+</svg>
\ No newline at end of file