homepage video

src/.vitepress/theme/index.ts

@@ -3,12 +3,14 @@ import { h } from 'vue'
 import type { Theme } from 'vitepress'
 import DefaultTheme from 'vitepress/theme-without-fonts'  // WITHOUT fonts
 import './style.css'
+import IntroVideo from "../../components/IntroVideo.vue";
 
 export default {
   extends: DefaultTheme,
   Layout: () => {
     return h(DefaultTheme.Layout, null, {
       // https://vitepress.dev/guide/extending-default-theme#layout-slots
+      'home-hero-actions-after': () => h(IntroVideo),
     })
   },
   enhanceApp({ app, router, siteData }) {

src/components/IntroVideo.vue

@@ -0,0 +1,13 @@
+<template>
+  <div style="margin-top: 1.5em; margin-bottom: 1.5em;">
+    <iframe width="560" height="315" src="https://www.youtube.com/embed/_sqzehuqWXw?si=SY04mCk9MhiBPFLP" title="Dexorder on YouTube" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+  </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/index.md

@@ -14,7 +14,7 @@ hero:
     - theme: alt
       text: Documentation
       link: /introduction
-  image: /dexorder-diag-hero.png
+#  image: /dexorder-diag-hero.png
 #    light: /dexorder_full_lightmode.svg
 #    dark: /dexorder_full_darkmode.svg
 
@@ -45,4 +45,3 @@ features:
     details: Running on Arbitrum One means orders trade fast with cheap gas. More L2's coming soon.
     
 ---
-<iframe width="560" height="315" src="https://www.youtube.com/embed/hY0zFFLjsUI?si=1ws5B_JiAtt0d5I9" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="margin:auto;margin-top:2em"></iframe>

src/introduction.md

@@ -1,6 +1,9 @@
+<script setup>
+import IntroVideo from "./components/IntroVideo.vue"
+</script>
 # What is Dexorder?
 
-<iframe width="560" height="315" src="https://www.youtube.com/embed/hY0zFFLjsUI?si=1ws5B_JiAtt0d5I9" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+<IntroVideo/>
 
 Dexorder is an on-chain system providing advanced order management for DeFi traders. Dexorder is noncustodial and runs on the [Arbitrum One](https://arbitrum.io/) network (more L2's coming soon).
 
@@ -43,7 +46,8 @@ See [Gas Fees](/fees#gas-fees) for more.
 
 ## Web Interface
 
-Creating dexorders couldn't be easier, using the charts you know and love by [TradingView](https://tradingview.com/). What you see on the chart is the order you get on-chain.
+Creating dexorders couldn't be easier, using the charts you know and love by 
+<a href="https://tradingview.com/" target="_blank">TradingView</a>. What you see on the chart is the order you get on-chain.
 
 When you place orders from the website, your wallet signs your order, putting it into your trading vault on-chain. Similarly, actions like Cancel or Cancel All are also signed by your web wallet and sent directly to the blockchain. Dexorder's servers are not involved with any of these interactions, which are made directly from your web wallet to your on-chain vault.