interactive code moved to the top (#6867)

Co-authored-by: Junaid <[email protected]>

Author: sarthak1dev

docs/docs/guides/getting_started/getting_started.md

@@ -6,6 +6,11 @@ sidebar_label: Quickstart
 
 # Quickstart
 
+
+## Live code editor
+
+<iframe width="100%" height="700px"  src="https://stackblitz.com/edit/vitejs-vite-aksddx?embed=1&file=main.js&showSidebar=1"></iframe> 
+
 ## Installation
 
 If NPM is being used as package manager, use the following for installing the web3.js library. 
@@ -247,7 +252,3 @@ const subscription = uniswapToken.events.Transfer();
 subscription.on('data',console.log);
 // ↳ [{...},{...}, ...] live events will be printed in the console
 ```
-
-## Live code editor
-
-<iframe width="100%" height="700px"  src="https://stackblitz.com/edit/vitejs-vite-aksddx?embed=1&file=main.js&showSidebar=1"></iframe> 

docs/docs/guides/wallet/index.md

@@ -5,6 +5,11 @@ sidebar_label: 'Mastering Wallets & Accounts'
 
 # Wallets and Accounts Overview
 
+
+## Live code editor 
+
+<iframe width="100%" height="700px" src="https://stackblitz.com/edit/vitejs-vite-mhuwrk?embed=1&file=main.js&showSidebar=1"></iframe>  
+
 ## Introduction
 
 A Web3.js `Wallet` is your main entry point if you want to use a private key directly to do any blockchain operations (transactions), also called `Signer` in other libraries.
@@ -220,7 +225,3 @@ The following is a list of `Accounts` [methods](/libdocs/Wallet) in the `web3.et
 - [sign](/libdocs/Accounts#sign)
 - [signTransaction](/libdocs/Accounts#signtransaction)
 
-
-## Live code editor 
-
-<iframe width="100%" height="700px" src="https://stackblitz.com/edit/vitejs-vite-mhuwrk?embed=1&file=main.js&showSidebar=1"></iframe>  

docs/docs/guides/web3_providers_guide/index.md

@@ -5,6 +5,11 @@ sidebar_label: 'Mastering Providers'
 
 # Web3js providers overview
 
+
+## Live code editor
+
+<iframe width="100%" height="700px" src="https://stackblitz.com/edit/vitejs-vite-zfusfd?embed=1&file=main.js&showSidebar=1"></iframe>   
+
 ## Introduction
 
 web3.js providers are objects responsible for enabling connectivity with the Ethereum network in various ways. Connecting your web application to an Ethereum node is necessary for sending transactions, querying data, and interacting with smart contracts on the network. In this guide, we will explore the different types of providers available in web3.js, how to set them up, and how to use them in your code.
@@ -375,7 +380,3 @@ provider.on('error', (error) => {
 ```
 
 
-
-## Live code editor
-
-<iframe width="100%" height="700px" src="https://stackblitz.com/edit/vitejs-vite-zfusfd?embed=1&file=main.js&showSidebar=1"></iframe>