From d67ea56f49153da8a5fc58ff15b30aebd04c2dd1 Mon Sep 17 00:00:00 2001
From: fabtreb <70035807+fabtreb@users.noreply.github.com>
Date: Thu, 22 Aug 2024 11:50:14 +0200
Subject: [PATCH] Further styling and cleanups
---
docs/content/build-xdapp/quickstart.md | 2 +-
docs/content/build-xdapp/showcase-dapps.md | 30 +++++++++++++++----
docs/content/build-xdapp/walkthrough.md | 6 +---
docs/website/docusaurus.config.ts | 5 ++++
.../GitHubCodeBlock/GitHubCodeBlock.css | 2 ++
.../src/components/HomepageFeatures/index.tsx | 2 +-
.../src/components/IntroVideo/index.tsx | 5 ++--
docs/website/src/css/custom.css | 17 +++++++++--
docs/website/src/pages/index.tsx | 2 +-
9 files changed, 54 insertions(+), 17 deletions(-)
diff --git a/docs/content/build-xdapp/quickstart.md b/docs/content/build-xdapp/quickstart.md
index e6cc482bc..931e10407 100644
--- a/docs/content/build-xdapp/quickstart.md
+++ b/docs/content/build-xdapp/quickstart.md
@@ -2,7 +2,7 @@
sidebar_position: 1
---
-# First XDapp
+# My First XDapp
This QuickStart guide will run through how to start an Omni XDApp (cross-chain decentralized app) in 5 minutes.
diff --git a/docs/content/build-xdapp/showcase-dapps.md b/docs/content/build-xdapp/showcase-dapps.md
index 41096f994..a1f387ef8 100644
--- a/docs/content/build-xdapp/showcase-dapps.md
+++ b/docs/content/build-xdapp/showcase-dapps.md
@@ -2,17 +2,37 @@
sidebar_position: 1
---
+import GitHubCodeBlock from '@site/src/components/GitHubCodeBlock/GitHubCodeBlock';
+
# Showcase
-TODO
-Awesome Omni Examples and Templates
+## Cross-stake
+
+ An example xchain staking app that allows ERC20 deposits on multiple chains.
+ https://github.com/kevinhalliday/xstake
+
+
+
+
+## Ethereum to Omni bridge
+
+OMNI is an ERC-20 token on Layer 1, and we understand that developers and users need a seamless way to transfer it to the Omni EVM for gas payments. To address this, we've developed a bridge that utilizes the Omni protocol, ensuring smooth and secure token transfers.
+
+
+### Omni to Ethereum
+
+
+### Ethereum to Omni
+
+
-See the Awesome Omni repo for a list of Omni examples and templates that you can use to get started with your Omni projects.
+## What else?
-- Cross-stake
-- Bridge
+:::tip
+Get inspired by the following ideas. Looking forward to seeing your PRs on https://github.com/omni-network/awesome-omni
+:::
diff --git a/docs/content/build-xdapp/walkthrough.md b/docs/content/build-xdapp/walkthrough.md
index 109fd1965..5ea04ddf6 100644
--- a/docs/content/build-xdapp/walkthrough.md
+++ b/docs/content/build-xdapp/walkthrough.md
@@ -6,7 +6,7 @@ import GitHubCodeBlock from '@site/src/components/GitHubCodeBlock/GitHubCodeBloc
# XDapp walkthrough
-Here's an example of a simple cross-chain contract set for setting and getting a string. This contract lets you send greetings from a rollup chain to a global storage contract deployed on Omni. Two main contracts are used in this example:
+Let's see what's happening under the hood. This contract lets you send greetings from a rollup chain to a global storage contract deployed on Omni. Two main contracts are used in this example:
1. `Greeter` - A contract deployed on a rollup that sends greetings to the Omni EVM.
2. `GreetingBook` - A contract deployed on the Omni EVM that stores greetings from all supported chains.
@@ -15,8 +15,6 @@ Here's an example of a simple cross-chain contract set for setting and getting a
-### Walkthrough
-
Let's walk through this step by step.
First, inherit from `XApp`.
@@ -53,8 +51,6 @@ function greet(string calldata greeting) external payable {
-### Walkthrough
-
Similar to `Greeter`, we inherit from `XApp`.
```solidity
diff --git a/docs/website/docusaurus.config.ts b/docs/website/docusaurus.config.ts
index 9d7ff7fd1..2306aace1 100644
--- a/docs/website/docusaurus.config.ts
+++ b/docs/website/docusaurus.config.ts
@@ -58,6 +58,11 @@ const config: Config = {
themeConfig: {
image: "img/omni-banner.png",
+ docs: {
+ sidebar: {
+ autoCollapseCategories: true,
+ },
+ },
navbar: {
title: 'Omni Developers',
logo: {
diff --git a/docs/website/src/components/GitHubCodeBlock/GitHubCodeBlock.css b/docs/website/src/components/GitHubCodeBlock/GitHubCodeBlock.css
index 33dc88059..2abfd3621 100644
--- a/docs/website/src/components/GitHubCodeBlock/GitHubCodeBlock.css
+++ b/docs/website/src/components/GitHubCodeBlock/GitHubCodeBlock.css
@@ -1,6 +1,8 @@
.code-snippet-container {
position: relative;
display: block;
+ height: 200px; /* Set your desired height */
+ overflow-y: auto; /* Enable vertical scrolling if content exceeds height */
}
.code-snippet-footer {
diff --git a/docs/website/src/components/HomepageFeatures/index.tsx b/docs/website/src/components/HomepageFeatures/index.tsx
index 8b219b9a1..274426782 100644
--- a/docs/website/src/components/HomepageFeatures/index.tsx
+++ b/docs/website/src/components/HomepageFeatures/index.tsx
@@ -45,7 +45,7 @@ function Feature({title, Svg, description, link}: FeatureItem) {