chore: update with staging

content/10.quick-start/5.paymaster.md

@@ -3,153 +3,83 @@ title: Paymaster
 description: Learn how to write and customize your documentation.
 ---
 
-This is only a basic example of what you can achieve with [Nuxt UI Pro](https://ui.nuxt.com/pro/guide), you can tweak it
-to match your needs. The template uses several Nuxt modules underneath like [`@nuxt/content`](https://content.nuxt.com)
-for the content, [`@nuxtjs/fontaine`](https://github.com/nuxt-modules/fontaine) and
-[`@nuxtjs/google-fonts`](https://github.com/nuxt-modules/google-fonts) to change the font and
-[`nuxt-og-image`](https://nuxtseo.com/og-image/getting-started/installation) for social previews.
+WWelcome back to our Quickstart Series on mastering zkSync development! In this guide, we move beyond the basics
+of smart contract deployment and the creation of contract factories to explore the innovative concept of paymasters
+in the zkSync ecosystem. This guide will illuminate the power of paymasters to revolutionize transaction
+fee management and enhance user experiences within your dApps.
 
-## ::callout
+:check-icon Delving deeper into zkSync development with the introduction of paymasters.
 
-icon: i-heroicons-light-bulb target: \_blank to: [nuxt guide](https://ui.nuxt.com/pro/guide/usage#structure)
+:check-icon Learning how paymasters can cover transaction fees for your dApp users, enhancing accessibility and user experience.
 
----
+:check-icon Discovering the flexibility of fee payment with paymasters, including the ability to pay
+fees in ERC20 tokens on zkSync Era, using Hardhat or Foundry.
 
-Learn more on how to customize and structure a Nuxt UI Pro app! ::
-
-## Writing content
-
-You can just start writing `.md` or `.yml` files in the [`content/`](https://content.nuxt.com/usage/content-directory)
-directory to have your pages updated. The navigation will be automatically generated in the left aside and in the mobile
-menu. You will also be able to go through your content with full-text search.
-
-::callout{icon="i-heroicons-light-bulb"} This template relies on a
-[catch-all route](https://nuxt.com/docs/guide/directory-structure/pages#catch-all-route) but you can achieve the same
-thing with the [document-driven mode](https://content.nuxt.com/document-driven/introduction). ::
-
-## App Configuration
-
-In addition to `@nuxt/ui-pro` configuration through the `app.config.ts`, this template lets you customize the `Header`,
-`Footer` and the `Table of contents` components.
-
-### Header
-
-```ts [app.config.ts]
-export default defineAppConfig({
-  header: {
-    // Logo configuration
-    logo: {
-      // Light mode
-      light: {
-        src: '',
-        alt: '',
-        class: '',
-      },
-      // Dark mode
-      dark: {
-        src: '',
-        alt: '',
-        class: '',
-      },
-    },
-    // Show or hide the search bar
-    search: true,
-    // Show or hide the color mode button
-    colorMode: true,
-    // Customize links
-    links: [
-      {
-        icon: 'i-simple-icons-github',
-        to: 'https://github.com/nuxt-ui-pro/docs',
-        target: '_blank',
-        'aria-label': 'Docs template on GitHub',
-      },
-    ],
-  },
-});
-```
-
-### Footer
-
-```ts [app.config.ts]
-export default defineAppConfig({
-  footer: {
-    // Update bottom left credits
-    credits: 'Copyright © 2023',
-    // Show or hide the color mode button
-    colorMode: false,
-    // Customize links
-    links: [
-      {
-        icon: 'i-simple-icons-nuxtdotjs',
-        to: 'https://nuxt.com',
-        target: '_blank',
-        'aria-label': 'Nuxt Website',
-      },
-      {
-        icon: 'i-simple-icons-discord',
-        to: 'https://discord.com/invite/ps2h6QT',
-        target: '_blank',
-        'aria-label': 'Nuxt UI on Discord',
-      },
-      {
-        icon: 'i-simple-icons-x',
-        to: 'https://x.com/nuxt_js',
-        target: '_blank',
-        'aria-label': 'Nuxt on X',
-      },
-      {
-        icon: 'i-simple-icons-github',
-        to: 'https://github.com/nuxt/ui',
-        target: '_blank',
-        'aria-label': 'Nuxt UI on GitHub',
-      },
-    ],
-  },
-});
-```
-
-### Table of contents
-
-```ts [app.config.ts]
-export default defineAppConfig({
-  toc: {
-    // Title of the main table of contents
-    title: 'Table of Contents',
-    // Bottom TOC configuration
-    bottom: {
-      // Title of the bottom table of contents
-      title: 'Community',
-      // URL of your repository content folder
-      edit: '',
-      // Customize links
-      links: [
-        {
-          icon: 'i-heroicons-star',
-          label: 'Star on GitHub',
-          to: 'https://github.com/nuxt/ui',
-          target: '_blank',
-        },
-        {
-          icon: 'i-heroicons-book-open',
-          label: 'Nuxt UI Pro docs',
-          to: 'https://ui.nuxt.com/pro/guide',
-          target: '_blank',
-        },
-        {
-          icon: 'i-simple-icons-nuxtdotjs',
-          label: 'Purchase a license',
-          to: 'https://ui.nuxt.com/pro/purchase',
-          target: '_blank',
-        },
-      ],
-    },
-  },
-});
-```
-
-icon: i-heroicons-light-bulb target: \_blank to: [app-config](https://nuxt.studio/docs/developers/app-config)
+Embark on this journey to understand how paymasters can add a new layer of functionality and user-friendliness
+to your decentralized applications.
 
----
+### What are Paymasters?
+
+Paymasters in the zkSync ecosystem represent a groundbreaking approach to handling transaction fees.
+They are special accounts designed to subsidize transaction costs for other accounts, potentially making
+certain transactions free for end-users. This feature is particularly useful for dApp developers looking
+to improve their platform's accessibility and user experience by covering transaction fees on behalf of their users.
+
+### Built-in Paymaster Flows
+
+Paymasters can operate under various flows, some of which may require user interaction, such as setting allowances
+for token swaps. These flows enable paymasters to support a wide range of use cases, from simple fee subsidies
+to more complex scenarios involving ERC20 token exchanges for transaction fees.
+
+- **General Paymaster Flow:** This default flow requires no preliminary actions from users, allowing paymasters
+to interpret transaction data as needed to cover fees.
+
+- **Approval-Based Paymaster Flow:** For operations requiring user permissions, such as token allowances,
+this flow provides a structured approach. It ensures that user tokens can be seamlessly exchanged for transaction
+fees, subject to user-approved limits.
 
-A dedicated interface is provided to edit those configurations on Nuxt Studio. ::
+As we delve into paymasters, remember that while they offer enhanced flexibility for fee management, their
+implementation should always prioritize security and user trust. This guide aims to equip you with the knowledge
+to effectively incorporate paymasters into your zkSync projects, paving the way for more user-friendly and accessible dApps.
+
+## Framework selection
+
+Select the framework you want to get started using zkSync Era with.
+
+::content-switcher
+---
+items: [{
+  label: 'Hardhat',
+  partial: '_deploy_factory/_hardhat_deploy_contract_factory'
+}, {
+  label: 'Foundry',
+  partial: '_deploy_factory/_foundry_deploy_contract_factory'
+}]
+---
+::
+
+## Takeaways
+
+- **Contract Factories:** Utilizing contract factories significantly streamlines
+the deployment process, allowing for the creation of multiple instances of a
+contract, like the `CrowdfundingCampaign`, with varied parameters.
+- **Scalability and Management:** Contract factories offer a scalable solution to manage
+numerous contract instances, enhancing project organization and efficiency.
+- **Event-Driven Insights:** The `CampaignCreated` event in the factory contract provides
+a transparent mechanism to track each crowdfunding campaign's deployment, useful for
+off-chain monitoring and interaction.
+
+## Next steps
+
+With the contract factory in your zkSync development arsenal, you're set to elevate
+your smart contract projects. Here's how you can further your journey:
+
+- **Contract Testing:** Progress to the next guide focused on testing your contracts.
+Ensuring the reliability and security of your `CrowdfundingCampaign` through
+comprehensive tests is critical.
+- **Advanced zkSync Integrations:** Explore deeper into zkSync's ecosystem by
+implementing features like account abstraction and paymasters to enhance user
+experience and contract flexibility.
+- **Community Engagement and Contribution:** Join the vibrant zkSync community.
+Participate in forums, Discord, or GitHub discussions. Sharing insights, asking queries,
+and contributing can enrich the ecosystem and your understanding of zkSync.

content/10.quick-start/_deploy_factory/_foundry_deploy_contract_factory.md

@@ -147,7 +147,7 @@ contractAddress         0x95f83473b88B5599cdB273F976fB3DC66DEA1c1D
 ...
 ```
 
-Key Components:
+**Key Components:**
 
 **Deployment Workflow:**
 

content/10.quick-start/_deploy_factory/_hardhat_deploy_contract_factory.md

@@ -148,7 +148,7 @@ export default async function (hre: HardhatRuntimeEnvironment) {
 }
 ```
 
-Key Components:
+**Key Components:**
 
 **Deployment Workflow:**
 

content/10.quick-start/_index/_foundry_deploy_contract.md

@@ -143,7 +143,7 @@ contract DeployCrowdfundContract is Script {
 }
 ```
 
-Key Components:
+**Key Components:**
 
 - **contractArtifactName:** Identifies the `CrowdfundingCampaign` contract for deployment.
 - **constructorArguments:** Sets initialization parameters for the contract.

content/10.quick-start/_index/_hardhat_deploy_contract.md

@@ -141,7 +141,7 @@ export default async function () {
 }
 ```
 
-Key Components:
+**Key Components:**
 
 - **contractArtifactName:** Identifies the `CrowdfundingCampaign` contract for deployment.
 - **constructorArguments:** Sets initialization parameters for the contract. In this case,

content/10.quick-start/_testing/_hardhat_contract_testing.md

@@ -202,7 +202,7 @@ describe("CrowdfundingCampaign", function () {
 });
 ```
 
-Key Components:
+**Key Components:**
 
 **Testing Workflow:**