chore: add release tag ci pipeline to push to docker hub

2023-08-31 14:59:10 +05:30
35 changed files with 1522 additions and 1210 deletions
--- a/.github/workflows/release-push-docker.yml
+++ b/.github/workflows/release-push-docker.yml
@@ -29,8 +29,8 @@ jobs:
          target: backend
          push: true
          tags: |
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_BACKEND_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_BACKEND_CONTAINER_NAME }}:latest
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_BACKEND_CONTAINER_NAME }}:${{ github.ref_name }}
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_BACKEND_CONTAINER_NAME }}:${{ github.ref }}
      - name: Build and push `${{ secrets.DOCKER_FRONTEND_CONTAINER_NAME }}`
        uses: docker/build-push-action@v4
@@ -40,8 +40,8 @@ jobs:
          target: app
          push: true
          tags: |
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_FRONTEND_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_FRONTEND_CONTAINER_NAME }}:latest
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_FRONTEND_CONTAINER_NAME }}:${{ github.ref_name }}
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_FRONTEND_CONTAINER_NAME }}:${{ github.ref }}
      - name: Build and push `${{ secrets.DOCKER_SH_ADMIN_CONTAINER_NAME }}`
        uses: docker/build-push-action@v4
@@ -51,8 +51,8 @@ jobs:
          target: sh_admin
          push: true
          tags: |
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_SH_ADMIN_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_SH_ADMIN_CONTAINER_NAME }}:latest
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_SH_ADMIN_CONTAINER_NAME }}:${{ github.ref_name }}
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_SH_ADMIN_CONTAINER_NAME }}:${{ github.ref }}
      - name: Build and push `${{ secrets.DOCKER_AIO_CONTAINER_NAME }}`
        uses: docker/build-push-action@v4
@@ -62,5 +62,5 @@ jobs:
          target: aio
          push: true
          tags: |
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_AIO_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_AIO_CONTAINER_NAME }}:latest
-            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_AIO_CONTAINER_NAME }}:${{ github.ref_name }}
+            ${{ secrets.DOCKER_USERNAME }}/${{ secrets.DOCKER_AIO_CONTAINER_NAME }}:${{ github.ref }}
--- a/CODE_OF_CONDUCT.md
+++ b/CODE_OF_CONDUCT.md
@@ -6,8 +6,8 @@ We as members, contributors, and leaders pledge to make participation in our
 community a harassment-free experience for everyone, regardless of age, body
 size, visible or invisible disability, ethnicity, sex characteristics, gender
 identity and expression, level of experience, education, socio-economic status,
-nationality, personal appearance, race, caste, color, religion, or sexual
+nationality, personal appearance, race, religion, or sexual identity
-identity and orientation.
+and orientation.
 We pledge to act and interact in ways that contribute to an open, welcoming,
 diverse, inclusive, and healthy community.
@@ -22,17 +22,17 @@ community include:
 * Giving and gracefully accepting constructive feedback
 * Accepting responsibility and apologizing to those affected by our mistakes,
  and learning from the experience
-* Focusing on what is best not just for us as individuals, but for the overall
+* Focusing on what is best not just for us as individuals, but for the
-  community
+  overall community
 Examples of unacceptable behavior include:
-* The use of sexualized language or imagery, and sexual attention or advances of
+* The use of sexualized language or imagery, and sexual attention or
-  any kind
+  advances of any kind
 * Trolling, insulting or derogatory comments, and personal or political attacks
 * Public or private harassment
-* Publishing others' private information, such as a physical or email address,
+* Publishing others' private information, such as a physical or email
-  without their explicit permission
+  address, without their explicit permission
 * Other conduct which could reasonably be considered inappropriate in a
  professional setting
@@ -82,15 +82,15 @@ behavior was inappropriate. A public apology may be requested.
 ### 2. Warning
-**Community Impact**: A violation through a single incident or series of
+**Community Impact**: A violation through a single incident or series
-actions.
+of actions.
 **Consequence**: A warning with consequences for continued behavior. No
 interaction with the people involved, including unsolicited interaction with
 those enforcing the Code of Conduct, for a specified period of time. This
 includes avoiding interactions in community spaces as well as external channels
-like social media. Violating these terms may lead to a temporary or permanent
+like social media. Violating these terms may lead to a temporary or
-ban.
+permanent ban.
 ### 3. Temporary Ban
@@ -106,27 +106,23 @@ Violating these terms may lead to a permanent ban.
 ### 4. Permanent Ban
 **Community Impact**: Demonstrating a pattern of violation of community
-standards, including sustained inappropriate behavior, harassment of an
+standards, including sustained inappropriate behavior,  harassment of an
 individual, or aggression toward or disparagement of classes of individuals.
-**Consequence**: A permanent ban from any sort of public interaction within the
+**Consequence**: A permanent ban from any sort of public interaction within
-community.
+the community.
 ## Attribution
 This Code of Conduct is adapted from the [Contributor Covenant][homepage],
-version 2.1, available at
+version 2.0, available at
-[https://www.contributor-covenant.org/version/2/1/code_of_conduct.html][v2.1].
+https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
-Community Impact Guidelines were inspired by
+Community Impact Guidelines were inspired by [Mozilla's code of conduct
-[Mozilla's code of conduct enforcement ladder][Mozilla CoC].
+enforcement ladder](https://github.com/mozilla/diversity).
 For answers to common questions about this code of conduct, see the FAQ at
 [https://www.contributor-covenant.org/faq][FAQ]. Translations are available at
 [https://www.contributor-covenant.org/translations][translations].
 [homepage]: https://www.contributor-covenant.org
-[v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html
+
-[Mozilla CoC]: https://github.com/mozilla/diversity
+For answers to common questions about this code of conduct, see the FAQ at
-[FAQ]: https://www.contributor-covenant.org/faq
+https://www.contributor-covenant.org/faq. Translations are available at
-[translations]: https://www.contributor-covenant.org/translations
+https://www.contributor-covenant.org/translations.
--- a/README.md
+++ b/README.md
@@ -2,18 +2,23 @@
  <a href="https://hoppscotch.io">
    <img
      src="https://avatars.githubusercontent.com/u/56705483"
-      alt="Hoppscotch"
+      alt="Hoppscotch Logo"
      height="64"
    />
  </a>
-  <h3>
+  <br />
  <p>
    <h3>
      <b>
        Hoppscotch
      </b>
    </h3>
  </p>
  <p>
    <b>
-      Hoppscotch
+      Open source API development ecosystem
    </b>
-  </h3>
+  </p>
  <b>
    Open Source API Development Ecosystem
  </b>
  <p>
 [![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen?logo=github)](CODE_OF_CONDUCT.md) [![Website](https://img.shields.io/website?url=https%3A%2F%2Fhoppscotch.io&logo=hoppscotch)](https://hoppscotch.io) [![Tests](https://github.com/hoppscotch/hoppscotch/actions/workflows/tests.yml/badge.svg)](https://github.com/hoppscotch/hoppscotch/actions) [![Tweet](https://img.shields.io/twitter/url?url=https%3A%2F%2Fhoppscotch.io%2F)](https://twitter.com/share?text=%F0%9F%91%BD%20Hoppscotch%20%E2%80%A2%20Open%20source%20API%20development%20ecosystem%20-%20Helps%20you%20create%20requests%20faster,%20saving%20precious%20time%20on%20development.&url=https://hoppscotch.io&hashtags=hoppscotch&via=hoppscotch_io)
@@ -29,18 +34,23 @@
  </p>
  <br />
  <p>
-    <a href="https://hoppscotch.io">
+    <a href="https://hoppscotch.io/#gh-light-mode-only" target="_blank">
-      <picture>
+      <img
-        <source media="(prefers-color-scheme: dark)" srcset="./packages/hoppscotch-common/public/images/banner-dark.png">
+        src="./packages/hoppscotch-common/public/images/banner-light.png"
-        <source media="(prefers-color-scheme: light)" srcset="./packages/hoppscotch-common/public/images/banner-light.png">
+        alt="Hoppscotch"
-        <img alt="Hoppscotch" src="./packages/hoppscotch-common/public/images/banner-dark.png">
+        width="100%"
-      </picture>
+      />
    </a>
    <a href="https://hoppscotch.io/#gh-dark-mode-only" target="_blank">
      <img
        src="./packages/hoppscotch-common/public/images/banner-dark.png"
        alt="Hoppscotch"
        width="100%"
      />
    </a>
  </p>
 </div>
 _We highly recommend you take a look at the [**Hoppscotch Documentation**](https://docs.hoppscotch.io) to learn more about the app._
 #### **Support**
 [![Chat on Discord](https://img.shields.io/badge/chat-Discord-7289DA?logo=discord)](https://hoppscotch.io/discord) [![Chat on Telegram](https://img.shields.io/badge/chat-Telegram-2CA5E0?logo=telegram)](https://hoppscotch.io/telegram) [![Discuss on GitHub](https://img.shields.io/badge/discussions-GitHub-333333?logo=github)](https://github.com/hoppscotch/hoppscotch/discussions)
@@ -49,9 +59,9 @@ _We highly recommend you take a look at the [**Hoppscotch Documentation**](https
 ❤️ **Lightweight:** Crafted with minimalistic UI design.
-⚡️ **Fast:** Send requests and get responses in real time.
+⚡️ **Fast:** Send requests and get/copy responses in real-time.
-🗄️ **HTTP Methods:** Request methods define the type of action you are requesting to be performed.
+**HTTP Methods**
 - `GET` - Requests retrieve resource information
 - `POST` - The server creates a new entry in a database
@@ -64,15 +74,17 @@ _We highly recommend you take a look at the [**Hoppscotch Documentation**](https
 - `TRACE` - Performs a message loop-back test along the path to the target resource
 - `<custom>` - Some APIs use custom request methods such as `LIST`. Type in your custom methods.
-🌈 **Theming:** Customizable combinations for background, foreground, and accent colors — [customize now](https://hoppscotch.io/settings).
+🌈 **Make it yours:** Customizable combinations for background, foreground, and accent colors — [customize now](https://hoppscotch.io/settings).
- Choose a theme: System preference, Light, Dark, and Black
+**Theming**
- Choose accent colors: Green, Teal, Blue, Indigo, Purple, Yellow, Orange, Red, and Pink
+
 - Choose a theme: System (default), Light, Dark, and Black
 - Choose accent color: Green (default), Teal, Blue, Indigo, Purple, Yellow, Orange, Red, and Pink
 - Distraction-free Zen mode
-_Customized themes are synced with your cloud/local session._
+_Customized themes are synced with cloud / local session_
-🔥 **PWA:** Install as a [Progressive Web App](https://web.dev/progressive-web-apps) on your device.
+🔥 **PWA:** Install as a [PWA](https://web.dev/what-are-pwas/) on your device.
 - Instant loading with Service Workers
 - Offline support
@@ -95,7 +107,7 @@ _Customized themes are synced with your cloud/local session._
 📡 **Server-Sent Events:** Receive a stream of updates from a server over an HTTP connection without resorting to polling.
-🌩 **Socket.IO:** Send and Receive data with the SocketIO server.
+🌩 **Socket.IO:** Send and Receive data with SocketIO server.
 🦟 **MQTT:** Subscribe and Publish to topics of an MQTT Broker.
@@ -115,7 +127,7 @@ _Customized themes are synced with your cloud/local session._
 - OAuth 2.0
 - OIDC Access Token/PKCE
-📢 **Headers:** Describes the format the body of your request is being sent in.
+📢 **Headers:** Describes the format the body of your request is being sent as.
 📫 **Parameters:** Use request parameters to set varying parts in simulated requests.
@@ -125,14 +137,14 @@ _Customized themes are synced with your cloud/local session._
 - FormData, JSON, and many more
 - Toggle between key-value and RAW input parameter list
-📮 **Response:** Contains the status line, headers, and the message/response body.
+👋 **Response:** Contains the status line, headers, and the message/response body.
- Copy the response to the clipboard
+- Copy response to clipboard
- Download the response as a file
+- Download response as a file
 - View response headers
- View raw and preview HTML, image, JSON, and XML responses
+- View raw and preview of HTML, image, JSON, XML responses
-⏰ **History:** Request entries are synced with your cloud/local session storage.
+⏰ **History:** Request entries are synced with cloud / local session storage to restore with a single click.
 📁 **Collections:** Keep your API requests organized with collections and folders. Reuse them with a single click.
@@ -140,32 +152,7 @@ _Customized themes are synced with your cloud/local session._
 - Nested folders
 - Export and import as a file or GitHub gist
-_Collections are synced with your cloud/local session storage._
+_Collections are synced with cloud / local session storage_
 📜 **Pre-Request Scripts:** Snippets of code associated with a request that is executed before the request is sent.
 - Set environment variables
 - Include timestamp in the request headers
 - Send a random alphanumeric string in the URL parameters
 - Any JavaScript functions
 👨‍👩‍👧‍👦 **Teams:** Helps you collaborate across your teams to design, develop, and test APIs faster.
 - Create unlimited teams
 - Create unlimited shared collections
 - Create unlimited team members
 - Role-based access control
 - Cloud sync
 - Multiple devices
 👥 **Workspaces:** Organize your personal and team collections environments into workspaces. Easily switch between workspaces to manage multiple projects.
 - Create unlimited workspaces
 - Switch between personal and team workspaces
 ⌨️ **Keyboard Shortcuts:** Optimized for efficiency.
 > **[Read our documentation on Keyboard Shortcuts](https://docs.hoppscotch.io/documentation/features/shortcuts)**
 🌐 **Proxy:** Enable Proxy Mode from Settings to access blocked APIs.
@@ -174,31 +161,60 @@ _Collections are synced with your cloud/local session storage._
 - Access APIs served in non-HTTPS (`http://`) endpoints
 - Use your Proxy URL
-_Official proxy server is hosted by Hoppscotch - **[GitHub](https://github.com/hoppscotch/proxyscotch)** - **[Privacy Policy](https://docs.hoppscotch.io/support/privacy)**._
+_Official proxy server is hosted by Hoppscotch - **[GitHub](https://github.com/hoppscotch/proxyscotch)** - **[Privacy Policy](https://docs.hoppscotch.io/support/privacy)**_
 📜 **Pre-Request Scripts β:** Snippets of code associated with a request that is executed before the request is sent.
 - Set environment variables
 - Include timestamp in the request headers
 - Send a random alphanumeric string in the URL parameters
 - Any JavaScript functions
 📄 **API Documentation:** Create and share dynamic API documentation easily, quickly.
 1. Add your requests to Collections and Folders
 2. Export Collections and easily share your APIs with the rest of your team
 3. Import Collections and Generate Documentation on-the-go
 ⌨️ **Keyboard Shortcuts:** Optimized for efficiency.
 > **[Read our documentation on Keyboard Shortcuts](https://docs.hoppscotch.io/documentation/features/shortcuts)**
 🌎 **i18n:** Experience the app in your language.
-Help us to translate Hoppscotch. Please read [`TRANSLATIONS`](TRANSLATIONS.md) for details on our [`CODE OF CONDUCT`](CODE_OF_CONDUCT.md) and the process for submitting pull requests to us.
+Help us to translate Hoppscotch. Please read [`TRANSLATIONS`](TRANSLATIONS.md) for details on our [`CODE OF CONDUCT`](CODE_OF_CONDUCT.md), and the process for submitting pull requests to us.
-☁️ **Auth + Sync:** Sign in and sync your data in real-time across all your devices.
+📦 **Add-ons:** Official add-ons for hoppscotch.
-**Sign in with:**
+- **[Proxy](https://github.com/hoppscotch/proxyscotch)** - A simple proxy server created for Hoppscotch
 - **[CLI β](https://github.com/hoppscotch/hopp-cli)** - A CLI solution for Hoppscotch
 - **[Browser Extensions](https://github.com/hoppscotch/hoppscotch-extension)** - Browser extensions that simplifies access to Hoppscotch
  [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_16x16.png) **Firefox**](https://addons.mozilla.org/en-US/firefox/addon/hoppscotch) &nbsp;|&nbsp; [![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_16x16.png) **Chrome**](https://chrome.google.com/webstore/detail/hoppscotch-extension-for-c/amknoiejhlmhancpahfcfcfhllgkpbld)
  > **Extensions fixes `CORS` issues.**
 - **[Hopp-Doc-Gen](https://github.com/hoppscotch/hopp-doc-gen)** - An API doc generator CLI for Hoppscotch
 _Add-ons are developed and maintained under **[Hoppscotch Organization](https://github.com/hoppscotch)**._
 ☁️ **Auth + Sync:** Sign in and sync your data in real-time.
 **Sign in with**
 - GitHub
 - Google
 - Microsoft
 - Email
 - SSO (Single Sign-On)[^EE]
-**🔄 Synchronize your data:** Handoff to continue tasks on your other devices.
+**Synchronize your data**
 - Workspaces
 - History
 - Collections
 - Environments
 - Settings
-✅ **Post-Request Tests:** Write tests associated with a request that is executed after the request's response.
+✅ **Post-Request Tests β:** Write tests associated with a request that is executed after the request's response.
 - Check the status code as an integer
 - Filter response headers
@@ -206,7 +222,7 @@ Help us to translate Hoppscotch. Please read [`TRANSLATIONS`](TRANSLATIONS.md) f
 - Set environment variables
 - Write JavaScript code
-🌱 **Environments:** Environment variables allow you to store and reuse values in your requests and scripts.
+🌱 **Environments** : Environment variables allow you to store and reuse values in your requests and scripts.
 - Unlimited environments and variables
 - Initialize through the pre-request script
@@ -225,31 +241,22 @@ Help us to translate Hoppscotch. Please read [`TRANSLATIONS`](TRANSLATIONS.md) f
 </details>
 👨‍👩‍👧‍👦 **Teams β:** Helps you collaborate across your team to design, develop, and test APIs faster.
 - Unlimited teams
 - Unlimited shared collections
 - Unlimited team members
 - Role-based access control
 - Cloud sync
 - Multiple devices
 🚚 **Bulk Edit:** Edit key-value pairs in bulk.
 - Entries are separated by newline
 - Keys and values are separated by `:`
 - Prepend `#` to any row you want to add but keep disabled
-🎛️ **Admin dashboard:** Manage your team and invite members.
+**For more features, please read our [documentation](https://docs.hoppscotch.io).**
 - Insights
 - Manage users
 - Manage teams
 📦 **Add-ons:** Official add-ons for hoppscotch.
 - **[Hoppscotch CLI](https://github.com/hoppscotch/hopp-cli)** - Command-line interface for Hoppscotch.
 - **[Proxy](https://github.com/hoppscotch/proxyscotch)** - A simple proxy server created for Hoppscotch.
 - **[Browser Extensions](https://github.com/hoppscotch/hoppscotch-extension)** - Browser extensions that enhance your Hoppscotch experience.
  [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_16x16.png) **Firefox**](https://addons.mozilla.org/en-US/firefox/addon/hoppscotch) &nbsp;|&nbsp; [![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_16x16.png) **Chrome**](https://chrome.google.com/webstore/detail/hoppscotch-extension-for-c/amknoiejhlmhancpahfcfcfhllgkpbld)
  > **Extensions fix `CORS` issues.**
 _Add-ons are developed and maintained under **[Hoppscotch Organization](https://github.com/hoppscotch)**._
 **For a complete list of features, please read our [documentation](https://docs.hoppscotch.io).**
 ## **Demo**
@@ -261,9 +268,18 @@ _Add-ons are developed and maintained under **[Hoppscotch Organization](https://
 2. Click "Send" to simulate the request
 3. View the response
 ## **Built with**
 - [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML)
 - [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS), [SCSS](https://sass-lang.com), [Windi CSS](https://windicss.org)
 - [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
 - [TypeScript](https://www.typescriptlang.org)
 - [Vue](https://vuejs.org)
 - [Vite](https://vitejs.dev)
 ## **Developing**
-Follow our [self-hosting documentation](https://docs.hoppscotch.io/documentation/self-host/getting-started) to get started with the development environment.
+Follow our [self-hosting guide](https://docs.hoppscotch.io/documentation/self-host/getting-started) to get started with the development environment.
 ## **Contributing**
@@ -281,7 +297,7 @@ See the [`CHANGELOG`](CHANGELOG.md) file for details.
 ## **Authors**
-This project owes its existence to the collective efforts of all those who contribute — [contribute now](CONTRIBUTING.md).
+This project exists thanks to all the people who contribute — [contribute](CONTRIBUTING.md).
 <div align="center">
  <a href="https://github.com/hoppscotch/hoppscotch/graphs/contributors">
@@ -293,6 +309,4 @@ This project owes its existence to the collective efforts of all those who contr
 ## **License**
-This project is licensed under the [MIT License](https://opensource.org/licenses/MIT) — see the [`LICENSE`](LICENSE) file for details.
+This project is licensed under the [MIT License](https://opensource.org/licenses/MIT) - see the [`LICENSE`](LICENSE) file for details.
 [^EE]: Enterprise edition feature. [Learn more](https://docs.hoppscotch.io/documentation/self-host/getting-started).
--- a/SECURITY.md
+++ b/SECURITY.md
@@ -2,9 +2,8 @@
 This document outlines security procedures and general policies for the Hoppscotch project.
- [Security Policy](#security-policy)
+1. [Reporting a security vulnerability](#reporting-a-security-vulnerability)
-  - [Reporting a security vulnerability](#reporting-a-security-vulnerability)
+3. [Incident response process](#incident-response-process)
  - [Incident response process](#incident-response-process)
 ## Reporting a security vulnerability
--- a/TRANSLATIONS.md
+++ b/TRANSLATIONS.md
@@ -9,24 +9,26 @@ Before you start working on a new language, please look through the [open pull r
 if there is no existing translation, you can create a new one by following these steps:
 1. **[Fork the repository](https://github.com/hoppscotch/hoppscotch/fork).**
-2. **Checkout the `main` branch for latest translations.**
+2. **Checkout the `i18n` branch for latest translations.**
-3. **Create a new branch for your translation with base branch `main`.**
+3. **Create a new branch for your translation with base branch `i18n`.**
 4. **Create target language file in the [`/packages/hoppscotch-common/locales`](https://github.com/hoppscotch/hoppscotch/tree/main/packages/hoppscotch-common/locales) directory.**
 5. **Copy the contents of the source file [`/packages/hoppscotch-common/locales/en.json`](https://github.com/hoppscotch/hoppscotch/blob/main/packages/hoppscotch-common/locales/en.json) to the target language file.**
 6. **Translate the strings in the target language file.**
 7. **Add your language entry to [`/packages/hoppscotch-common/languages.json`](https://github.com/hoppscotch/hoppscotch/blob/main/packages/hoppscotch-common/languages.json).**
-8. **Save and commit changes.**
+8. **Save & commit changes.**
 9. **Send a pull request.**
 _You may send a pull request before all steps above are complete: e.g., you may want to ask for help with translations, or getting tests to pass. However, your pull request will not be merged until all steps above are complete._
 `i18n` branch will be merged into `main` branch once every week.
 Completing an initial translation of the whole site is a fairly large task. One way to break that task up is to work with other translators through pull requests on your fork. You can also [add collaborators to your fork](https://help.github.com/en/github/setting-up-and-managing-your-github-user-account/inviting-collaborators-to-a-personal-repository) if you'd like to invite other translators to commit directly to your fork and share responsibility for merging pull requests.
 ## Updating a translation
 ### Corrections
-If you notice spelling or grammar errors, typos, or opportunities for better phrasing, open a pull request with your suggested fix. If you see a problem that you aren't sure of or don't have time to fix, [open an issue](https://github.com/hoppscotch/hoppscotch/issues/new/choose).
+If you notice spelling or grammar errors, typos, or opportunities for better phrasing, open a pull request with your suggested fix. If you see a problem that you aren't sure of or don't have time to fix, open an issue.
 ### Broken links
--- a/packages/hoppscotch-cli/CODE_OF_CONDUCT.md
+++ b/packages/hoppscotch-cli/CODE_OF_CONDUCT.md
@@ -0,0 +1,128 @@
 # Contributor Covenant Code of Conduct
 ## Our Pledge
 We as members, contributors, and leaders pledge to make participation in our
 community a harassment-free experience for everyone, regardless of age, body
 size, visible or invisible disability, ethnicity, sex characteristics, gender
 identity and expression, level of experience, education, socio-economic status,
 nationality, personal appearance, race, religion, or sexual identity
 and orientation.
 We pledge to act and interact in ways that contribute to an open, welcoming,
 diverse, inclusive, and healthy community.
 ## Our Standards
 Examples of behavior that contributes to a positive environment for our
 community include:
 - Demonstrating empathy and kindness toward other people
 - Being respectful of differing opinions, viewpoints, and experiences
 - Giving and gracefully accepting constructive feedback
 - Accepting responsibility and apologizing to those affected by our mistakes,
  and learning from the experience
 - Focusing on what is best not just for us as individuals, but for the
  overall community
 Examples of unacceptable behavior include:
 - The use of sexualized language or imagery, and sexual attention or
  advances of any kind
 - Trolling, insulting or derogatory comments, and personal or political attacks
 - Public or private harassment
 - Publishing others' private information, such as a physical or email
  address, without their explicit permission
 - Other conduct which could reasonably be considered inappropriate in a
  professional setting
 ## Enforcement Responsibilities
 Community leaders are responsible for clarifying and enforcing our standards of
 acceptable behavior and will take appropriate and fair corrective action in
 response to any behavior that they deem inappropriate, threatening, offensive,
 or harmful.
 Community leaders have the right and responsibility to remove, edit, or reject
 comments, commits, code, wiki edits, issues, and other contributions that are
 not aligned to this Code of Conduct, and will communicate reasons for moderation
 decisions when appropriate.
 ## Scope
 This Code of Conduct applies within all community spaces, and also applies when
 an individual is officially representing the community in public spaces.
 Examples of representing our community include using an official e-mail address,
 posting via an official social media account, or acting as an appointed
 representative at an online or offline event.
 ## Enforcement
 Instances of abusive, harassing, or otherwise unacceptable behavior may be
 reported to the community leaders responsible for enforcement at
 support@hoppscotch.io.
 All complaints will be reviewed and investigated promptly and fairly.
 All community leaders are obligated to respect the privacy and security of the
 reporter of any incident.
 ## Enforcement Guidelines
 Community leaders will follow these Community Impact Guidelines in determining
 the consequences for any action they deem in violation of this Code of Conduct:
 ### 1. Correction
 **Community Impact**: Use of inappropriate language or other behavior deemed
 unprofessional or unwelcome in the community.
 **Consequence**: A private, written warning from community leaders, providing
 clarity around the nature of the violation and an explanation of why the
 behavior was inappropriate. A public apology may be requested.
 ### 2. Warning
 **Community Impact**: A violation through a single incident or series
 of actions.
 **Consequence**: A warning with consequences for continued behavior. No
 interaction with the people involved, including unsolicited interaction with
 those enforcing the Code of Conduct, for a specified period of time. This
 includes avoiding interactions in community spaces as well as external channels
 like social media. Violating these terms may lead to a temporary or
 permanent ban.
 ### 3. Temporary Ban
 **Community Impact**: A serious violation of community standards, including
 sustained inappropriate behavior.
 **Consequence**: A temporary ban from any sort of interaction or public
 communication with the community for a specified period of time. No public or
 private interaction with the people involved, including unsolicited interaction
 with those enforcing the Code of Conduct, is allowed during this period.
 Violating these terms may lead to a permanent ban.
 ### 4. Permanent Ban
 **Community Impact**: Demonstrating a pattern of violation of community
 standards, including sustained inappropriate behavior, harassment of an
 individual, or aggression toward or disparagement of classes of individuals.
 **Consequence**: A permanent ban from any sort of public interaction within
 the community.
 ## Attribution
 This Code of Conduct is adapted from the [Contributor Covenant][homepage],
 version 2.0, available at
 https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
 Community Impact Guidelines were inspired by [Mozilla's code of conduct
 enforcement ladder](https://github.com/mozilla/diversity).
 [homepage]: https://www.contributor-covenant.org
 For answers to common questions about this code of conduct, see the FAQ at
 https://www.contributor-covenant.org/faq. Translations are available at
 https://www.contributor-covenant.org/translations.
--- a/packages/hoppscotch-cli/LICENSE
+++ b/packages/hoppscotch-cli/LICENSE
@@ -0,0 +1,21 @@
 MIT License
 Copyright (c) 2022
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
 in the Software without restriction, including without limitation the rights
 to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 copies of the Software, and to permit persons to whom the Software is
 furnished to do so, subject to the following conditions:
 The above copyright notice and this permission notice shall be included in all
 copies or substantial portions of the Software.
 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
--- a/packages/hoppscotch-cli/README.md
+++ b/packages/hoppscotch-cli/README.md
@@ -1,19 +1,29 @@
 <div align="center">
  <a href="https://hoppscotch.io">
    <img
      src="https://avatars.githubusercontent.com/u/56705483"
      alt="Hoppscotch Logo"
      height="64"
    />
  </a>
 </div>
 <div align="center">
 # Hoppscotch CLI <font size=2><sup>ALPHA</sup></font>
-A CLI to run Hoppscotch Test Scripts in CI environments.
+</div>
 A CLI to run Hoppscotch test scripts in CI environments.
 ### **Commands:**
 - `hopp test [options] [file]`: testing hoppscotch collection.json file
 ### **Usage:**
-
+```
 ```bash
 hopp [options or commands] arguments
 ```
 ### **Options:**
 - `-v`, `--ver`: see the current version of the CLI
 - `-h`, `--help`: display help for command
@@ -35,21 +45,17 @@ hopp [options or commands] arguments
   - Executes and outputs test-script response.
    #### Options:
    ##### `-e <file_path>` / `--env <file_path>`
    - Accepts path to env.json with contents in below format:
        ```json
        {
            "ENV1":"value1",
            "ENV2":"value2"
        }
        ```
    - You can now access those variables using `pw.env.get('<var_name>')`
-		Taking the above example, `pw.env.get("ENV1")` will return `"value1"`
+			Taking the above example, `pw.env.get("ENV1")` will return `"value1"`
 ## Install
@@ -69,59 +75,4 @@ npm i -g @hoppscotch/cli
 ## **Contributing:**
-When contributing to this repository, please first discuss the change you wish to make via issue,
+To get started contributing to the repository, please read **[CONTRIBUTING.md](./CONTRIBUTING.md)**
 email, or any other method with the owners of this repository before making a change.
 Please note we have a code of conduct, please follow it in all your interactions with the project.
 ## Pull Request Process
 1. Ensure any install or build dependencies are removed before the end of the layer when doing a
   build.
 2. Update the README.md with details of changes to the interface, this includes new environment
   variables, exposed ports, useful file locations and container parameters.
 3. Increase the version numbers in any examples files and the README.md to the new version that this
   Pull Request would represent. The versioning scheme we use is [SemVer](https://semver.org).
 4. You may merge the Pull Request once you have the sign-off of two other developers, or if you
   do not have permission to do that, you may request the second reviewer merge it for you.
 ## Set Up The Development Environment
 1. After cloning the repository, execute the following commands:
    ```bash
    pnpm install
    pnpm run build
    ```
 2. In order to test locally, you can use two types of package linking:
    1. The 'pnpm exec' way (preferred since it does not hamper your original installation of the CLI):
        ```bash
        pnpm link @hoppscotch/cli
        // Then to use or test the CLI:
        pnpm exec hopp
        // After testing, to remove the package linking:
        pnpm rm @hoppscotch/cli
        ```
    2. The 'global' way (warning: this might override the globally installed CLI, if exists):
        ```bash
        sudo pnpm link --global
        // Then to use or test the CLI:
        hopp
        // After testing, to remove the package linking:
        sudo pnpm rm --global @hoppscotch/cli
        ```
 3. To use the Typescript watch scripts:
      ```bash
      pnpm run dev
      ```
--- a/packages/hoppscotch-common/assets/scss/themes.scss
+++ b/packages/hoppscotch-common/assets/scss/themes.scss
@@ -2,20 +2,7 @@
  --font-sans: "Inter Variable", sans-serif;
  --font-icon: "Material Symbols Rounded Variable";
  --font-mono: "Roboto Mono Variable", monospace;
-  --font-size-body: 0.75rem;
+  --font-size-tiny: calc(var(--font-size-body) - 0.062rem);
  --font-size-tiny: 0.688rem;
  --line-height-body: 1rem;
  --upper-primary-sticky-fold: 4.125rem;
  --upper-secondary-sticky-fold: 6.188rem;
  --upper-tertiary-sticky-fold: 8.25rem;
  --upper-mobile-primary-sticky-fold: 6.625rem;
  --upper-mobile-secondary-sticky-fold: 8.688rem;
  --upper-mobile-sticky-fold: 10.75rem;
  --upper-mobile-tertiary-sticky-fold: 8.25rem;
  --lower-primary-sticky-fold: 3rem;
  --lower-secondary-sticky-fold: 5.063rem;
  --lower-tertiary-sticky-fold: 7.125rem;
  --sidebar-primary-sticky-fold: 2rem;
 }
@mixin dark-theme {
@@ -213,8 +200,8 @@
 :root {
  @include base-theme;
  @include dark-theme;
  @include dark-editor-theme;
  @include green-theme;
  @include dark-editor-theme;
 }
 :root.light {
@@ -270,3 +257,63 @@
 :root[data-accent="yellow"] {
  @include yellow-theme;
 }
@mixin font-small {
  --font-size-body: 0.75rem;
  --line-height-body: 1rem;
  --upper-primary-sticky-fold: 4.125rem;
  --upper-secondary-sticky-fold: 6.188rem;
  --upper-tertiary-sticky-fold: 8.25rem;
  --upper-mobile-primary-sticky-fold: 6.625rem;
  --upper-mobile-secondary-sticky-fold: 8.688rem;
  --upper-mobile-sticky-fold: 10.75rem;
  --upper-mobile-tertiary-sticky-fold: 8.25rem;
  --lower-primary-sticky-fold: 3rem;
  --lower-secondary-sticky-fold: 5.063rem;
  --lower-tertiary-sticky-fold: 7.125rem;
  --sidebar-primary-sticky-fold: 2rem;
 }
@mixin font-medium {
  --font-size-body: 0.875rem;
  --line-height-body: 1.25rem;
  --upper-primary-sticky-fold: 4.375rem;
  --upper-secondary-sticky-fold: 6.688rem;
  --upper-tertiary-sticky-fold: 9rem;
  --upper-mobile-primary-sticky-fold: 7.125rem;
  --upper-mobile-secondary-sticky-fold: 9.438rem;
  --upper-mobile-sticky-fold: 11.75rem;
  --upper-mobile-tertiary-sticky-fold: 9rem;
  --lower-primary-sticky-fold: 3.25rem;
  --lower-secondary-sticky-fold: 5.563rem;
  --lower-tertiary-sticky-fold: 7.875rem;
  --sidebar-primary-sticky-fold: 2.25rem;
 }
@mixin font-large {
  --font-size-body: 1rem;
  --line-height-body: 1.5rem;
  --upper-primary-sticky-fold: 4.625rem;
  --upper-secondary-sticky-fold: 7.188rem;
  --upper-tertiary-sticky-fold: 9.75rem;
  --upper-mobile-primary-sticky-fold: 7.625rem;
  --upper-mobile-secondary-sticky-fold: 10.188rem;
  --upper-mobile-sticky-fold: 12.75rem;
  --upper-mobile-tertiary-sticky-fold: 9.75rem;
  --lower-primary-sticky-fold: 3.5rem;
  --lower-secondary-sticky-fold: 6.063rem;
  --lower-tertiary-sticky-fold: 8.625rem;
  --sidebar-primary-sticky-fold: 2.5rem;
 }
 :root[data-font-size="small"] {
  @include font-small;
 }
 :root[data-font-size="medium"] {
  @include font-medium;
 }
 :root[data-font-size="large"] {
  @include font-large;
 }
--- a/packages/hoppscotch-common/locales/id.json
+++ b/packages/hoppscotch-common/locales/id.json
@@ -118,22 +118,22 @@
  },
  "collection": {
    "created": "Koleksi dibuat",
-    "different_parent": "Tidak dapat mengubah urutan koleksi dengan induk yang berbeda",
+    "different_parent": "Cannot reorder collection with different parent",
    "edit": "Mengubah Koleksi",
    "invalid_name": "Berikan nama untuk Koleksi",
-    "invalid_root_move": "Koleksi sudah berada di akar direktori",
+    "invalid_root_move": "Collection already in the root",
-    "moved": "Berhasil Dipindahkan",
+    "moved": "Moved Successfully",
    "my_collections": "Koleksi Saya",
    "name": "Koleksi Baru Saya",
    "name_length_insufficient": "Nama koleksi harus minimal 3 karakter",
    "new": "Koleksi baru",
-    "order_changed": "Pembaruan Urutan Koleksi",
+    "order_changed": "Collection Order Updated",
    "renamed": "Koleksi berganti nama",
    "request_in_use": "Permintaan sedang digunakan",
    "save_as": "Simpan Sebagai",
    "select": "Pilih Koleksi",
    "select_location": "Pilih lokasi",
-    "select_team": "Pilih tim",
+    "select_team": "Pilih team",
    "team_collections": "Koleksi Tim"
  },
  "confirm": {
@@ -147,7 +147,7 @@
    "remove_team": "Apakah Anda yakin ingin menghapus tim ini?",
    "remove_telemetry": "Apakah Anda yakin ingin menyisih dari Telemetri?",
    "request_change": "Apakah Anda yakin ingin membuang permintaan saat ini, perubahan yang belum disimpan akan hilang.",
-    "save_unsaved_tab": "Apakah Anda ingin menyimpan perubahan yang dibuat di tab ini?",
+    "save_unsaved_tab": "Do you want to save changes made in this tab?",
    "sync": "Apakah Anda ingin memulihkan ruang kerja Anda dari cloud? Ini akan membuang kemajuan lokal Anda."
  },
  "count": {
@@ -180,8 +180,8 @@
    "profile": "Masuk untuk melihat profil Anda",
    "protocols": "Protokol kosong",
    "schema": "Hubungkan ke endpoint GraphQL untuk melihat skema",
-    "shortcodes": "Shortcodes kosong",
+    "shortcodes": "Shortcodes are empty",
-    "subscription": "Langganan kosong",
+    "subscription": "Subscriptions are empty",
    "team_name": "Nama team kosong",
    "teams": "Kamu bukan di team manapun",
    "tests": "Tidak ada tes untuk permintaan ini"
@@ -189,19 +189,19 @@
  "environment": {
    "add_to_global": "Tambahkan ke Global",
    "added": "Tambahan Environment",
-    "create_new": "Membuat environment baru",
+    "create_new": "Membuat baru environment",
    "created": "Environment dibuat",
    "deleted": "Environment dihapus",
    "edit": "Sunting Environment",
    "invalid_name": "Tolong beri nama untuk environment",
-    "my_environments": "Environment Saya",
+    "my_environments": "My Environments",
-    "nested_overflow": "Variabel environment bersarang dibatasi hingga 10 level",
+    "nested_overflow": "variabel environment bersarang dibatasi hingga 10 level",
    "new": "Environment Baru",
    "no_environment": "No environment",
    "no_environment_description": "Tidak ada environment yang dipilih. Pilih apa yang harus dilakukan dengan variabel berikut.",
    "select": "Pilih environment",
-    "team_environments": "Environment Tim",
+    "team_environments": "Team Environments",
-    "title": "Environment",
+    "title": "Environments",
    "updated": "Environment diperbarui",
    "variable_list": "Daftar Variable"
  },
@@ -210,8 +210,8 @@
    "check_console_details": "Periksa console log untuk detailnya.",
    "curl_invalid_format": "cURL tidak diformat dengan benar",
    "danger_zone": "Danger zone",
-    "delete_account": "Akun Anda saat ini merupakan pemilik dalam tim-tim ini:",
+    "delete_account": "Your account is currently an owner in these teams:",
-    "delete_account_description": "Anda harus menghapus diri Anda dari tim-tim ini, mentransfer kepemilikan, atau menghapus tim-tim ini sebelum Anda dapat menghapus akun Anda.",
+    "delete_account_description": "You must either remove yourself, transfer ownership, or delete these teams before you can delete your account.",
    "empty_req_name": "Nama Permintaan Kosong",
    "f12_details": "(F12 untuk detailnya)",
    "gql_prettify_invalid_query": "Tidak dapat prettify kueri yang tidak valid, menyelesaikan kesalahan sintaksis kueri, dan coba lagi",
@@ -294,7 +294,7 @@
    "from_json_description": "Impor dari Hoppscotch berkas koleksi",
    "from_my_collections": "Impor dari Koleksi Saya",
    "from_my_collections_description": "Impor dari Berkas Koleksi Saya",
-    "from_openapi": "Impor dari OpenAPI",
+    "from_openapi": "Import dari OpenAPI",
    "from_openapi_description": "Impor dari OpenAPI syarat berkas (YML/JSON)",
    "from_postman": "Impor dari Postman",
    "from_postman_description": "Impor dari Koleksi Postman",
@@ -316,23 +316,23 @@
    "zen_mode": "Zen mode"
  },
  "modal": {
-    "close_unsaved_tab": "Anda memiliki perubahan yang belum disimpan",
+    "close_unsaved_tab": "You have unsaved changes",
    "collections": "Koleksi",
    "confirm": "Mengonfirmasi",
    "edit_request": "Edit Request",
    "import_export": "Impor / Ekspor"
  },
  "mqtt": {
-    "already_subscribed": "Anda sudah berlangganan topik ini.",
+    "already_subscribed": "You are already subscribed to this topic.",
-    "clean_session": "Sesi Bersih",
+    "clean_session": "Clean Session",
-    "clear_input": "Hapus input",
+    "clear_input": "Clear input",
-    "clear_input_on_send": "Hapus input saat mengirim",
+    "clear_input_on_send": "Clear input on send",
    "client_id": "Client ID",
-    "color": "Pilih warna",
+    "color": "Pick a color",
    "communication": "Komunikasi",
-    "connection_config": "Konfigurasi Koneksi",
+    "connection_config": "Connection Config",
-    "connection_not_authorized": "Koneksi MQTT ini tidak menggunakan otentikasi",
+    "connection_not_authorized": "This MQTT connection does not use any authentication.",
-    "invalid_topic": "Harap berikan topik untuk langganan",
+    "invalid_topic": "Please provide a topic for the subscription",
    "keep_alive": "Keep Alive",
    "log": "Log",
    "lw_message": "Last-Will Message",
@@ -340,8 +340,8 @@
    "lw_retain": "Last-Will Retain",
    "lw_topic": "Last-Will Topic",
    "message": "Pesan",
-    "new": "Langganan Baru",
+    "new": "New Subscription",
-    "not_connected": "Mulai koneksi MQTT terlebih dahulu",
+    "not_connected": "Please start a MQTT connection first.",
    "publish": "Menerbitkan",
    "qos": "QoS",
    "ssl": "SSL",
@@ -396,19 +396,19 @@
      "text": "Text"
    },
    "copy_link": "Salin tautan",
-    "different_collection": "Tidak dapat mengubah urutan permintaan dari koleksi yang berbeda",
+    "different_collection": "Cannot reorder requests from different collections",
    "duplicated": "Request duplicated",
    "duration": "Durasi",
    "enter_curl": "Masukkan cURL",
-    "generate_code": "Hasilkan kode",
+    "generate_code": "Generate code",
-    "generated_code": "Hasilkan kode",
+    "generated_code": "Generated code",
    "header_list": "Daftar Header",
    "invalid_name": "Harap berikan nama untuk request",
    "method": "Method",
    "moved": "Request moved",
    "name": "Request nama",
    "new": "Request baru",
-    "order_changed": "Urutan Request Diperbarui",
+    "order_changed": "Request Order Updated",
    "override": "Membatalkan",
    "override_help": "Set <kbd>Content-Type</kbd> in Headers",
    "overriden": "Diganti",
@@ -453,7 +453,7 @@
  "settings": {
    "accent_color": "Accent color",
    "account": "Akun",
-    "account_deleted": "Akun Anda telah dihapus",
+    "account_deleted": "Your account has been deleted",
    "account_description": "Sesuaikan pengaturan akun Anda.",
    "account_email_description": "Alamat surel utama Anda.",
    "account_name_description": "Ini adalah nama tampilan Anda.",
@@ -609,7 +609,7 @@
    "file_imported": "File diimpor",
    "finished_in": "Selesai dalam {duration} ms",
    "history_deleted": "Riwayat dihapus",
-    "linewrap": "Bungkus baris",
+    "linewrap": "Wrap lines",
    "loading": "Memuat...",
    "message_received": "Pesan: {message} tiba di topik: {topic}",
    "mqtt_subscription_failed": "Terjadi masalah saat berlangganan topik: {topic}",
@@ -666,7 +666,7 @@
    "email_do_not_match": "Surel tidak cocok dengan detail akun Anda. Hubungi pemilik tim Anda.",
    "exit": "Keluar dari Tim",
    "exit_disabled": "Hanya pemilik yang tidak dapat keluar dari tim",
-    "invalid_coll_id": "ID koleksi tidak valid",
+    "invalid_coll_id": "Invalid collection ID",
    "invalid_email_format": "Format surel tidak valid",
    "invalid_id": "ID tim tidak valid. Hubungi pemilik tim Anda.",
    "invalid_invite_link": "Tautan undangan tidak valid",
@@ -690,7 +690,7 @@
    "member_removed": "Pengguna dihapus",
    "member_role_updated": "Peran pengguna diperbarui",
    "members": "Anggota",
-    "more_members": "+{count} lebih",
+    "more_members": "+{count} more",
    "name_length_insufficient": "Nama tim harus setidaknya 6 karakter",
    "name_updated": "Nama tim diperbarui",
    "new": "Tim Baru",
@@ -698,13 +698,13 @@
    "new_name": "Tim baru saya",
    "no_access": "Anda tidak memiliki akses edit ke collections ini",
    "no_invite_found": "Undangan tidak ditemukan. Hubungi pemilik tim Anda.",
-    "no_request_found": "Request tidak ditemukan.",
+    "no_request_found": "Request not found.",
    "not_found": "Tim tidak ditemukan. Hubungi pemilik tim Anda.",
    "not_valid_viewer": "Anda bukan penonton yang valid. Hubungi pemilik tim Anda.",
-    "parent_coll_move": "Tidak dapat memindahkan koleksi ke dalam koleksi anak",
+    "parent_coll_move": "Cannot move collection to a child collection",
    "pending_invites": "Undangan tertunda",
    "permissions": "Izin",
-    "same_target_destination": "Sama tujuan dan destinasi",
+    "same_target_destination": "Same target and destination",
    "saved": "Tim disimpan",
    "select_a_team": "Pilih tim",
    "title": "tim",
@@ -712,9 +712,9 @@
    "we_sent_invite_link_description": "Minta semua undangan untuk memeriksa kotak masuk mereka. Klik tautan untuk bergabung dengan tim."
  },
  "team_environment": {
-    "deleted": "Environment dihapus",
+    "deleted": "Environment Deleted",
-    "duplicate": "Environment diduplikasi",
+    "duplicate": "Environment Duplicated",
-    "not_found": "Environment tidak ditemukan."
+    "not_found": "Environment not found."
  },
  "test": {
    "failed": "Tes gagal",
@@ -734,9 +734,9 @@
    "url": "URL"
  },
  "workspace": {
-    "change": "Beralih workspace",
+    "change": "Change workspace",
-    "personal": "Workspace Saya",
+    "personal": "My Workspace",
-    "team": "Workspace Tim",
+    "team": "Team Workspace",
    "title": "Workspaces"
  }
 }
--- a/packages/hoppscotch-common/locales/ru.json
+++ b/packages/hoppscotch-common/locales/ru.json
@@ -1,50 +1,48 @@
 {
  "action": {
-    "autoscroll": "Автоскрол",
+    "autoscroll": "Autoscroll",
    "cancel": "Отменить",
    "choose_file": "Выберите файл",
    "clear": "Очистить",
    "clear_all": "Очистить все",
-    "clear_history": "Очистить всю историю",
+    "close": "Close",
    "close": "Закрыть",
    "connect": "Подключиться",
-    "connecting": "Соединение...",
+    "connecting": "Connecting",
    "copy": "Скопировать",
    "delete": "Удалить",
    "disconnect": "Отключиться",
    "dismiss": "Скрыть",
-    "dont_save": "Не сохранять",
+    "dont_save": "Don't save",
    "download_file": "Скачать файл",
-    "drag_to_reorder": "Перетягивайте для сортировки",
+    "drag_to_reorder": "Drag to reorder",
    "duplicate": "Дублировать",
    "edit": "Редактировать",
-    "filter": "Фильтр",
+    "filter": "Filter",
    "go_back": "Вернуться",
-    "go_forward": "Вперёд",
+    "go_forward": "Go forward",
-    "group_by": "Сгруппировать по",
+    "group_by": "Group by",
    "label": "Название",
    "learn_more": "Узнать больше",
-    "less": "Меньше",
+    "less": "Less",
    "more": "Больше",
    "new": "Создать новый",
    "no": "Нет",
-    "open_workspace": "Открыть пространство",
+    "open_workspace": "Open workspace",
-    "paste": "Вставить",
+    "paste": "Paste",
    "prettify": "Форматировать",
    "rename": "Переименовать",
    "remove": "Удалить",
    "restore": "Восстановить",
    "save": "Сохранить",
-    "scroll_to_bottom": "Вниз",
+    "scroll_to_bottom": "Scroll to bottom",
-    "scroll_to_top": "Вверх",
+    "scroll_to_top": "Scroll to top",
    "search": "Поиск",
    "send": "Отправить",
    "start": "Начать",
-    "starting": "Запускаю",
+    "starting": "Starting",
    "stop": "Стоп",
-    "to_close": "что бы закрыть",
+    "to_close": "to close",
-    "to_navigate": "для навигации",
+    "to_navigate": "to navigate",
-    "to_select": "выборать",
+    "to_select": "to select",
    "turn_off": "Выключить",
    "turn_on": "Включить",
    "undo": "Отменить",
@@ -58,9 +56,9 @@
    "chat_with_us": "Связаться с нами",
    "contact_us": "Свяжитесь с нами",
    "copy": "Копировать",
-    "copy_user_id": "Копировать токен пользователя",
+    "copy_user_id": "Copy User Auth Token",
-    "developer_option": "Настройки разработчика",
+    "developer_option": "Developer options",
-    "developer_option_description": "Инструмент разработчика помогает обслуживить и развивить Hoppscotch",
+    "developer_option_description": "Developer tools which helps in development and maintenance of Hoppscotch.",
    "discord": "Discord",
    "documentation": "Документация",
    "github": "GitHub",
@@ -69,13 +67,11 @@
    "invite": "Пригласить",
    "invite_description": "В Hoppscotch мы разработали простой и интуитивно понятный интерфейс для создания и управления вашими API. Hoppscotch - это инструмент, который помогает создавать, тестировать, документировать и делиться своими API.",
    "invite_your_friends": "Пригласить своих друзей",
    "social_links": "Социальные сети",
    "social_description": "Подписывайся на наши соц. сети и оставайся всегда в курсе последних новостей, обновлений и релизов.",
    "join_discord_community": "Присоединяйтесь к нашему сообществу Discord",
    "keyboard_shortcuts": "Горячие клавиши",
    "name": "Hoppscotch",
    "new_version_found": "Найдена новая версия. Перезагрузите для обновления.",
-    "options": "Настройки",
+    "options": "Options",
    "proxy_privacy_policy": "Политика конфиденциальности прокси",
    "reload": "Перезагрузить",
    "search": "Поиск",
@@ -83,7 +79,7 @@
    "shortcuts": "Ярлыки",
    "spotlight": "Прожектор",
    "status": "Статус",
-    "status_description": "Проверить состояние сайта",
+    "status_description": "Check the status of the website",
    "terms_and_privacy": "Условия и конфиденциальность",
    "twitter": "Twitter",
    "type_a_command_search": "Введите команду или выполните поиск…",
@@ -97,7 +93,7 @@
    "continue_with_email": "Продолжить с электронной почтой",
    "continue_with_github": "Продолжить с GitHub",
    "continue_with_google": "Продолжить с Google",
-    "continue_with_microsoft": "Продолжить с Microsoft",
+    "continue_with_microsoft": "Continue with Microsoft",
    "email": "Электронное письмо",
    "logged_out": "Вышли из",
    "login": "Авторизоваться",
@@ -122,20 +118,19 @@
  },
  "collection": {
    "created": "Коллекция создана",
-    "different_parent": "Нельзя сортировать коллекцию с разной родительской коллекцией",
+    "different_parent": "Cannot reorder collection with different parent",
    "edit": "Редактировать коллекцию",
    "invalid_name": "Укажите допустимое название коллекции",
-    "invalid_root_move": "Коллекция уже в корне",
+    "invalid_root_move": "Collection already in the root",
-    "moved": "Перемещено успешно",
+    "moved": "Moved Successfully",
    "my_collections": "Мои коллекции",
    "name": "Новая коллекция",
-    "name_length_insufficient": "Имя коллекции должно иметь 3 или более символов",
+    "name_length_insufficient": "Collection name should be at least 3 characters long",
    "new": "Создать коллекцию",
-    "order_changed": "Порядок коллекции обновлён",
+    "order_changed": "Collection Order Updated",
    "renamed": "Коллекция переименована",
    "request_in_use": "Запрос обрабатывается",
    "save_as": "Сохранить как",
    "save_to_collection": "Сохранить в коллекцию",
    "select": "Выбрать коллекцию",
    "select_location": "Выберите местоположение",
    "select_team": "Выберите команду",
@@ -151,17 +146,10 @@
    "remove_request": "Вы уверены, что хотите навсегда удалить этот запрос?",
    "remove_team": "Вы уверены, что хотите удалить эту команду?",
    "remove_telemetry": "Вы действительно хотите отказаться от телеметрии?",
-    "request_change": "Вы уверены что хотите сбросить текущий запрос, все не сохранённые данные будт утеряны?",
+    "request_change": "Are you sure you want to discard current request, unsaved changes will be lost.",
-    "save_unsaved_tab": "Вы хотите сохранить изменения в этой вкладке?",
+    "save_unsaved_tab": "Do you want to save changes made in this tab?",
    "close_unsaved_tab": "Вы уверены что хотите закрыть эту вкладку?",
    "close_unsaved_tabs": "ВЫ уверены что хотите закрыть все эти вкладки? Несохранённые данные {count} вкладок будут утеряны.",
    "sync": "Вы уверены, что хотите синхронизировать это рабочее пространство?"
  },
  "context_menu": {
    "set_environment_variable": "Назначить как переменную",
    "add_parameters": "Добавить в параметры",
    "open_request_in_new_tab": "Открыть в новой вкладке"
  },
  "count": {
    "header": "Заголовок {count}",
    "message": "Тело {count}",
@@ -192,102 +180,83 @@
    "profile": "Войдите, чтобы просмотреть свой профиль",
    "protocols": "Протоколы пустые",
    "schema": "Подключиться к конечной точке GraphQL",
-    "shortcodes": "Нет коротких ссылок",
+    "shortcodes": "Shortcodes are empty",
-    "subscription": "Нет подписок",
+    "subscription": "Subscriptions are empty",
    "team_name": "Название команды пусто",
    "teams": "Команды пустые",
    "tests": "Для этого запроса нет тестов"
  },
  "environment": {
-    "add_to_global": "Добавить в глобальное окружение",
+    "add_to_global": "Add to Global",
-    "added": "Окружение добавлено",
+    "added": "Environment addition",
-    "create_new": "Создать новое окружение",
+    "create_new": "Создать новую среду",
-    "created": "Окружение создано",
+    "created": "Environment created",
-    "deleted": "Окружение удалено",
+    "deleted": "Environment deletion",
-    "duplicated": "Окружение скопировано",
+    "edit": "Редактировать среду",
-    "global": "Глобальное окружение",
+    "invalid_name": "Укажите допустимое имя для среды",
-    "empty_variables": "Нет переменных",
+    "my_environments": "My Environments",
-    "global_variables": "Глобальные переменные",
+    "nested_overflow": "nested environment variables are limited to 10 levels",
    "edit": "Редактировать окружение",
    "invalid_name": "Укажите допустимое имя для окружения",
    "list": "Переменные окружения",
    "my_environments": "Мои окружения",
    "name": "Название",
    "nested_overflow": "максимальный уровень вложения переменных окружения - 10",
    "new": "Новая среда",
-    "no_active_environment": "Нет активных окружений",
+    "no_environment": "Нет окружающей среды",
-    "no_environment": "Нет окружения",
+    "no_environment_description": "No environments were selected. Choose what to do with the following variables.",
    "no_environment_description": "Не выбрано окружение, выберите что делать с переменными.",
    "quick_peek": "Быстрый просмотр окружения",
    "replace_with_variable": "Заменить переменной",
    "scope": "Scope",
    "select": "Выберите среду",
-    "set": "Выбрать окружение",
+    "team_environments": "Team Environments",
-    "set_as_environment": "Установить как окружение",
+    "title": "Среды",
-    "team_environments": "Окружения команды",
+    "updated": "Environment updation",
    "title": "Окружения",
    "updated": "Окружение обновлено",
    "value": "Значение",
    "variable": "Переменная",
    "variable_list": "Список переменных"
  },
  "error": {
    "browser_support_sse": "Похоже, в этом браузере нет поддержки событий, отправленных сервером.",
    "check_console_details": "Подробности смотрите в журнале консоли.",
    "curl_invalid_format": "cURL неправильно отформатирован",
-    "danger_zone": "Опасная зона",
+    "danger_zone": "Danger zone",
-    "delete_account": "Вы являетесь владельцем этой команды:",
+    "delete_account": "Your account is currently an owner in these teams:",
-    "delete_account_description": "Прежде чем удалить аккаунт вам необходимо либо назначить владельцом другого пользователя, либо удалить команды в которых вы являетесь владельцем.",
+    "delete_account_description": "You must either remove yourself, transfer ownership, or delete these teams before you can delete your account.",
    "empty_req_name": "Пустое имя запроса",
    "f12_details": "(F12 для подробностей)",
    "gql_prettify_invalid_query": "Не удалось определить недопустимый запрос, устранить синтаксические ошибки запроса и повторить попытку.",
-    "incomplete_config_urls": "Не заполнены URL конфигурации",
+    "incomplete_config_urls": "Incomplete configuration URLs",
-    "incorrect_email": "Не корректный Email",
+    "incorrect_email": "Incorrect email",
-    "invalid_link": "Не корректная ссылка",
+    "invalid_link": "Invalid link",
    "invalid_link_description": "Ссылка, по которой вы перешли, - недействительна, либо срок ее действия истек.",
-    "json_parsing_failed": "Не корректный JSON",
+    "json_parsing_failed": "Invalid JSON",
    "json_prettify_invalid_body": "Не удалось определить недопустимое тело, устранить синтаксические ошибки json и повторить попытку.",
    "network_error": "Похоже, возникла проблема с соединением. Попробуйте еще раз.",
    "network_fail": "Не удалось отправить запрос",
    "no_duration": "Без продолжительности",
-    "no_results_found": "Совпадения не найдены",
+    "no_results_found": "No matches found",
-    "page_not_found": "Эта страница не найдена",
+    "page_not_found": "This page could not be found",
    "proxy_error": "Ошибка прокси",
    "script_fail": "Не удалось выполнить сценарий предварительного запроса",
    "something_went_wrong": "Что-то пошло не так",
-    "test_script_fail": "Не удалось выполнить тестирование запроса"
+    "test_script_fail": "Could not execute post-request script"
  },
  "export": {
    "as_json": "Экспорт как JSON",
    "create_secret_gist": "Создать секретный Gist",
    "gist_created": "Gist создан",
    "require_github": "Войдите через GitHub, чтобы создать секретную суть",
-    "title": "Экспорт"
+    "title": "Export"
  },
  "filter": {
-    "all": "Все",
+    "all": "All",
-    "none": "Не указано",
+    "none": "None",
-    "starred": "Отмечено"
+    "starred": "Starred"
  },
  "folder": {
    "created": "Папка создана",
    "edit": "Редактировать папку",
    "invalid_name": "Укажите имя для папки",
-    "name_length_insufficient": "Имя папки должно содержать 3 или более символов",
+    "name_length_insufficient": "Folder name should be at least 3 characters long",
    "new": "Новая папка",
    "renamed": "Папка переименована"
  },
  "graphql": {
    "mutations": "Мутации",
    "schema": "Схема",
-    "subscriptions": "Подписки",
+    "subscriptions": "Подписки"
    "switch_connection": "Изменить соединение",
    "connection_switch_url": "Вы присоединились к GraphQL, URL соединения",
    "connection_switch_new_url": "Смена вкладки разорвёт текущее GraphQL соединение. Новый URL соединения будет",
    "connection_switch_confirm": "Вы желаете соединиться с последним GraphQL сервером?"
  },
  "group": {
-    "time": "Время",
+    "time": "Time",
    "url": "URL"
  },
  "header": {
@@ -304,11 +273,11 @@
    "post_request_tests": "Сценарии тестирования написаны на JavaScript и запускаются после получения ответа.",
    "pre_request_script": "Скрипты предварительного запроса написаны на JavaScript и запускаются перед отправкой запроса.",
    "script_fail": "Похоже, в скрипте предварительного запроса есть сбой. Проверьте ошибку ниже и исправьте скрипт соответствующим образом.",
-    "test_script_fail": "Похоже, что скрипт тестирования содержит ошибку. Пожалуйста исправьте её и попробуйте снова",
+    "test_script_fail": "There seems to be an error with test script. Please fix the errors and run tests again",
    "tests": "Напишите тестовый сценарий для автоматизации отладки."
  },
  "hide": {
-    "collection": "Свернуть панель соединения",
+    "collection": "Collapse Collection Panel",
    "more": "Скрыть больше",
    "preview": "Скрыть предварительный просмотр",
    "sidebar": "Скрыть боковую панель"
@@ -318,85 +287,61 @@
    "curl": "Импортировать cURL",
    "failed": "Ошибка импорта",
    "from_gist": "Импорт из Gist",
-    "from_gist_description": "Импортировать через Gist URL",
+    "from_gist_description": "Import from Gist URL",
-    "from_insomnia": "Импортировать с Insomnia",
+    "from_insomnia": "Import from Insomnia",
-    "from_insomnia_description": "Импортировать из коллекции Insomnia",
+    "from_insomnia_description": "Import from Insomnia collection",
-    "from_json": "Импортировать из Hoppscotch",
+    "from_json": "Import from Hoppscotch",
-    "from_json_description": "Импортировать из файла коллекции Hoppscotch",
+    "from_json_description": "Import from Hoppscotch collection file",
    "from_my_collections": "Импортировать из моих коллекций",
-    "from_my_collections_description": "Импортировать коллекции из моего файла",
+    "from_my_collections_description": "Import from My Collections file",
-    "from_openapi": "Импортировать из OpenAPI",
+    "from_openapi": "Import from OpenAPI",
-    "from_openapi_description": "Импортировать из OpenAPI файла описания API (YML/JSON)",
+    "from_openapi_description": "Import from OpenAPI specification file (YML/JSON)",
-    "from_postman": "Импортировать из Postman",
+    "from_postman": "Import from Postman",
-    "from_postman_description": "Импортировать из коллекции Postman",
+    "from_postman_description": "Import from Postman collection",
-    "from_url": "Импортировать из URL",
+    "from_url": "Import from URL",
    "gist_url": "Введите URL-адрес Gist",
-    "import_from_url_invalid_fetch": "Не удалить получить данные по этому URL",
+    "import_from_url_invalid_fetch": "Couldn't get data from the url",
-    "import_from_url_invalid_file_format": "Ошибка при импорте коллекций",
+    "import_from_url_invalid_file_format": "Error while importing collections",
-    "import_from_url_invalid_type": "Неподдерживаемый тип. Поддерживаемые типы: 'hoppscotch', 'openapi', 'postman', 'insomnia'",
+    "import_from_url_invalid_type": "Unsupported type. accepted values are 'hoppscotch', 'openapi', 'postman', 'insomnia'",
-    "import_from_url_success": "Коллекция импортирована",
+    "import_from_url_success": "Collections Imported",
-    "json_description": "Импортировать из коллекции Hoppscotch",
+    "json_description": "Import collections from a Hoppscotch Collections JSON file",
    "title": "Импортировать"
  },
  "inspections": {
    "title": "Инспектор",
    "description": "Помогает обноружить возможные проблемы",
    "environment": {
      "add_environment": "Добавить в окружение",
      "not_found": "Переменная окружения “{environment}” не найдена."
    },
    "header": {
      "cookie": "Браузерная версия Hoppscotch не может использовать Cookie Header. Пока мы работаем над созданием десктоп версии Hoppscotch, пожалуйста используйте Authorization Header."
    },
    "response": {
      "401_error": "Пожалуйста проверьте ваши параметры авторизации",
      "404_error": "Пожалуйста проверьте URL и Метод вашего запроса",
      "network_error": "Пожалуйста проверьте соединение",
      "cors_error": "Пожалуйста проверьте вашу Cross-Origin Resource Sharing настройку сервера.",
      "default_error": "Проверьте ваш запрос."
    },
    "url": {
      "extension_not_installed": "Расширение не установлено",
      "extention_not_enabled": "Расширение не включено",
      "extention_enable_action": "Включить расширение браузера",
      "extension_unknown_origin": "Убедитесь что вы добавили адрес сервера в Hoppscotch расширение."
    }
  },
  "layout": {
-    "collapse_collection": "Свернуть или развернуть коллекции",
+    "collapse_collection": "Collapse or Expand Collections",
-    "collapse_sidebar": "Свернуть или развернуть боковую панель",
+    "collapse_sidebar": "Collapse or Expand the sidebar",
-    "column": "Вертикальная развёртка",
+    "column": "Вертикальное оформление",
-    "name": "Развёртка",
+    "name": "Layout",
-    "row": "Горизонтальная развертка",
+    "row": "Горизонтальное оформление",
    "zen_mode": "Спокойный режим"
  },
  "modal": {
-    "close_unsaved_tab": "У вас есть не сохранённые изменения",
+    "close_unsaved_tab": "You have unsaved changes",
    "collections": "Коллекции",
    "confirm": "Подтверждать",
    "edit_request": "Изменить запрос",
    "import_export": "Импорт Экспорт"
  },
  "mqtt": {
-    "already_subscribed": "Вы уже подписаны на этот топик",
+    "already_subscribed": "You are already subscribed to this topic.",
-    "clean_session": "Очистить сессию",
+    "clean_session": "Clean Session",
-    "clear_input": "Очистить ввод",
+    "clear_input": "Clear input",
-    "clear_input_on_send": "Очистить ввод перед отправкой",
+    "clear_input_on_send": "Clear input on send",
    "client_id": "Client ID",
-    "color": "Выбрать цвет",
+    "color": "Pick a color",
    "communication": "Коммуникация",
-    "connection_config": "Конфигурация соединения",
+    "connection_config": "Connection Config",
-    "connection_not_authorized": "Это соединение MQTT не использует какую-либо авторизацию.",
+    "connection_not_authorized": "This MQTT connection does not use any authentication.",
-    "invalid_topic": "Пожалуйста выберите topic для подписки",
+    "invalid_topic": "Please provide a topic for the subscription",
-    "keep_alive": "Поддерживать соединение",
+    "keep_alive": "Keep Alive",
    "log": "Лог",
    "lw_message": "Last-Will Message",
    "lw_qos": "Last-Will QoS",
    "lw_retain": "Last-Will Retain",
    "lw_topic": "Last-Will Topic",
    "message": "Сообщение",
-    "new": "Новая подписка",
+    "new": "New Subscription",
-    "not_connected": "Пожалуйста, сначала запустите MQTT соединение.",
+    "not_connected": "Please start a MQTT connection first.",
    "publish": "Публиковать",
    "qos": "QoS",
    "ssl": "SSL",
@@ -410,7 +355,7 @@
  "navigation": {
    "doc": "Документы",
    "graphql": "GraphQL",
-    "profile": "Профиль",
+    "profile": "Profile",
    "realtime": "В реальном времени",
    "rest": "REST",
    "settings": "Настройки"
@@ -418,12 +363,12 @@
  "preRequest": {
    "javascript_code": "Код JavaScript",
    "learn": "Читать документацию",
-    "script": "Предворительный скрипт запроса",
+    "script": "Сценарий предварительного запроса",
-    "snippets": "Готовый код"
+    "snippets": "Фрагменты"
  },
  "profile": {
    "app_settings": "Настройки приложения",
-    "default_hopp_displayname": "Безымянный",
+    "default_hopp_displayname": "Unnamed User",
    "editor": "Редактор",
    "editor_description": "Редакторы могут добавлять, редактировать, а так же удалять запросы.",
    "email_verification_mail": "На вашу электронную почту отправлено письмо для подтверждения. Перейдите по ссылке из письма, чтобы подтвердить свой электронный адрес.",
@@ -446,13 +391,13 @@
    "choose_language": "Выберите язык",
    "content_type": "Тип содержимого",
    "content_type_titles": {
-      "others": "Другие",
+      "others": "Others",
-      "structured": "Структурированный",
+      "structured": "Structured",
-      "text": "Текст"
+      "text": "Text"
    },
    "copy_link": "Копировать ссылку",
-    "different_collection": "Нельзя изменять порядок запросов из разных коллекций",
+    "different_collection": "Cannot reorder requests from different collections",
-    "duplicated": "Запрос скопирован",
+    "duplicated": "Request duplicated",
    "duration": "Продолжительность",
    "enter_curl": "Введите cURL",
    "generate_code": "Сгенерировать код",
@@ -460,13 +405,13 @@
    "header_list": "Список заголовков",
    "invalid_name": "Укажите имя для запроса",
    "method": "Методика",
-    "moved": "Запрос перемещён",
+    "moved": "Request moved",
    "name": "Имя запроса",
-    "new": "Новый запрос",
+    "new": "New Request",
-    "order_changed": "Порядок запроса изменён",
+    "order_changed": "Request Order Updated",
-    "override": "Переопределить",
+    "override": "Override",
-    "override_help": "Установить <kbd>Content-Type</kbd> в Заголовках",
+    "override_help": "Set <kbd>Content-Type</kbd> in Headers",
-    "overriden": "Переопределено",
+    "overriden": "Overridden",
    "parameter_list": "Параметры запроса",
    "parameters": "Параметры",
    "path": "Путь",
@@ -479,17 +424,17 @@
    "save_as": "Сохранить как",
    "saved": "Запрос сохранен",
    "share": "Делиться",
-    "share_description": "Поделиться Hoppscotch с друзьями",
+    "share_description": "Share Hoppscotch with your friends",
    "title": "Запрос",
    "type": "Тип запроса",
    "url": "URL",
    "variables": "Переменные",
-    "view_my_links": "Посмотреть мои ссылки"
+    "view_my_links": "View my links"
  },
  "response": {
-    "audio": "Аудио",
+    "audio": "Audio",
    "body": "Тело ответа",
-    "filter_response_body": "Отфильтровать ответ в формате JSON (используется синтаксис JSONPath)",
+    "filter_response_body": "Filter JSON response body (uses JSONPath syntax)",
    "headers": "Заголовки",
    "html": "HTML",
    "image": "Изображение",
@@ -501,14 +446,14 @@
    "status": "Статус",
    "time": "Время",
    "title": "Ответ",
-    "video": "Видео",
+    "video": "Video",
    "waiting_for_connection": "Ожидание соединения",
    "xml": "XML"
  },
  "settings": {
    "accent_color": "Основной цвет",
    "account": "Счет",
-    "account_deleted": "Ваш аккаунт был удалён",
+    "account_deleted": "Your account has been deleted",
    "account_description": "Настройте параметры своей учетной записи.",
    "account_email_description": "Ваш основной адрес электронной почты.",
    "account_name_description": "Это ваше отображаемое имя.",
@@ -517,8 +462,8 @@
    "change_font_size": "Изменить размер шрифта",
    "choose_language": "Выберите язык",
    "dark_mode": "Темный",
-    "delete_account": "Удалить аккаунт",
+    "delete_account": "Delete account",
-    "delete_account_description": "Удаление аккаунта нельзя отменить",
+    "delete_account_description": "Once you delete your account, all your data will be permanently deleted. This action cannot be undone.",
    "expand_navigation": "Раскрыть панель навигации",
    "experiments": "Эксперименты",
    "experiments_notice": "Это набор экспериментов, над которыми мы работаем, которые могут оказаться полезными, интересными, и тем, и другим, или ни тем, ни другим. Они не окончательные и могут быть нестабильными, поэтому, если произойдет что-то слишком странное, не паникуйте. Просто выключи эту чертову штуку. Шутки в сторону,",
@@ -545,8 +490,8 @@
    "proxy_use_toggle": "Используйте промежуточное ПО прокси для отправки запросов",
    "read_the": "Прочтите",
    "reset_default": "Восстановление значений по умолчанию",
-    "short_codes": "Короткие ссылки",
+    "short_codes": "Short codes",
-    "short_codes_description": "Короткие ссылки, созданные вами",
+    "short_codes_description": "Short codes which were created by you.",
    "sidebar_on_left": "Панель слева",
    "sync": "Синхронизировать",
    "sync_collections": "Коллекции",
@@ -560,16 +505,16 @@
    "theme_description": "Настройте тему своего приложения.",
    "use_experimental_url_bar": "Использовать экспериментальную строку URL с выделением среды",
    "user": "Пользователь",
-    "verified_email": "Проверенный Email",
+    "verified_email": "Verified email",
-    "verify_email": "Подтвердить Email"
+    "verify_email": "Подтвердить почту"
  },
  "shortcodes": {
-    "actions": "Действия",
+    "actions": "Actions",
-    "created_on": "Создано",
+    "created_on": "Created on",
-    "deleted": "Удалёна",
+    "deleted": "Shortcode deleted",
-    "method": "Метод",
+    "method": "Method",
-    "not_found": "Короткая ссылка не найдена",
+    "not_found": "Shortcode not found",
-    "short_code": "Короткая ссылка",
+    "short_code": "Short code",
    "url": "URL"
  },
  "shortcut": {
@@ -580,10 +525,6 @@
      "show_all": "Горячие клавиши",
      "title": "Общий"
    },
    "others": {
      "title": "Другие",
      "prettify": "Прекрасные редакторы"
    },
    "miscellaneous": {
      "invite": "Пригласите людей в Hoppscotch",
      "title": "Разное"
@@ -604,9 +545,6 @@
      "delete_method": "Выберите метод DELETE",
      "get_method": "Выберите метод GET",
      "head_method": "Выберите метод HEAD",
      "rename": "Переименовать запрос",
      "import_curl": "Импорт из cURL",
      "show_code": "Сгенерировать готовый код",
      "method": "Методика",
      "next_method": "Выберите следующий метод",
      "post_method": "Выберите метод POST",
@@ -615,120 +553,35 @@
      "reset_request": "Сбросить запрос",
      "save_to_collections": "Сохранить в коллекции",
      "send_request": "Послать запрос",
      "save_request": "Сохарнить запрос",
      "title": "Запрос"
    },
    "response": {
-      "copy": "Копировать запрос в буфер обмена",
+      "copy": "Copy response to clipboard",
-      "download": "Скачать запрос как файл",
+      "download": "Download response as file",
-      "title": "Запрос"
+      "title": "Response"
    },
    "theme": {
-      "black": "Черный режим",
+      "black": "Switch  theme to black mode",
-      "dark": "Тёмный режим",
+      "dark": "Switch  theme to  dark mode",
-      "light": "Светлый режим",
+      "light": "Switch  theme to light mode",
-      "system": "Определяется системой",
+      "system": "Switch  theme to system mode",
-      "title": "Тема"
+      "title": "Theme"
    }
  },
  "show": {
    "code": "Показать код",
-    "collection": "Развернуть панель коллекций",
+    "collection": "Expand Collection Panel",
    "more": "Показать больше",
    "sidebar": "Показать боковую панель"
  },
  "socketio": {
    "communication": "Коммуникация",
-    "connection_not_authorized": "Это SocketIO соединение не использует какую-либо авторизацию.",
+    "connection_not_authorized": "This SocketIO connection does not use any authentication.",
    "event_name": "Название события",
    "events": "События",
    "log": "Лог",
    "url": "URL"
  },
  "spotlight": {
    "general": {
      "help_menu": "Помощь и поддержка",
      "chat": "Чат с поддержкой",
      "open_docs": "Прочитать документацию",
      "open_keybindings": "Горячие клавиши",
      "open_github": "Открыть GitHub репозиторий",
      "social": "Соц. сети",
      "title": "Основное"
    },
    "miscellaneous": {
      "invite": "Пригласите друзей в Hoppscotch",
      "title": "Разное"
    },
    "request": {
      "switch_to": "Перейти к",
      "select_method": "Выбрать метод",
      "save_as_new": "Сохранить как новый запрос",
      "tab_parameters": "Параметры",
      "tab_body": "Тело",
      "tab_headers": "Заголовки",
      "tab_authorization": "Авторизация",
      "tab_pre_request_script": "Пред-скрипт",
      "tab_tests": "Тесты",
      "tab_query": "Запрос",
      "tab_variables": "Переменные"
    },
    "graphql": {
      "connect": "Соединиться",
      "disconnect": "Разъединить"
    },
    "response": {
      "copy": "Копировать ответ",
      "download": "Скачать ответ",
      "title": "Ответ"
    },
    "environments": {
      "new": "Создать новое окружение",
      "new_variable": "Создать новую переменную в окружении",
      "edit": "Изменить текущее окружение",
      "delete": "Удалить текущее окружение",
      "duplicate": "Скопировать текущее окружение",
      "edit_global": "Изменить глобальное окружение",
      "duplicate_global": "Скопировать глобальное окружение",
      "title": "Окружения"
    },
    "workspace": {
      "new": "Создать новую команду",
      "edit": "Изменить текущую команду",
      "delete": "Удалить текущую команду",
      "invite": "Пригласить людей в команду",
      "switch_to_personal": "Переключиться на личное пространство",
      "title": "Команды"
    },
    "tab": {
      "duplicate": "Скопировать вкладку",
      "close_current": "Закрыть вкладку",
      "close_others": "Закрыть все кроме этой",
      "new_tab": "Открыть в новой вкладке",
      "title": "Вкладки"
    },
    "section": {
      "user": "Пользователь",
      "theme": "Тема",
      "interface": "Интерфейс",
      "interceptor": "Перехватчик"
    },
    "change_language": "Изменить язык",
    "settings": {
      "theme": {
        "black": "Чёрная",
        "dark": "Тёмная",
        "light": "Светлая",
        "system": "Определяется системой"
      },
      "font": {
        "size_sm": "Маленький",
        "size_md": "Средний",
        "size_lg": "Большой"
      },
      "change_interceptor": "Изменить перехватчик",
      "change_language": "Изменить язык"
    }
  },
  "sse": {
    "event_type": "Тип события",
    "log": "Лог",
@@ -736,14 +589,14 @@
  },
  "state": {
    "bulk_mode": "Множественное редактирование",
-    "bulk_mode_placeholder": "Каждый параметр должен начинаться с новой строки\nКлючи и значения разедляются двоеточием\nИспользуйте # для комментария",
+    "bulk_mode_placeholder": "Entries are separated by newline\nKeys and values are separated by :\nPrepend # to any row you want to add but keep disabled",
    "cleared": "Очищено",
    "connected": "Связаны",
    "connected_to": "Подключено к {name}",
    "connecting_to": "Подключение к {name} ...",
-    "connection_error": "Ошибка подключения",
+    "connection_error": "Failed to connect",
-    "connection_failed": "Не удалось установить соединение",
+    "connection_failed": "Connection failed",
-    "connection_lost": "Соединение утеряно",
+    "connection_lost": "Connection lost",
    "copied_to_clipboard": "Скопировано в буфер обмена",
    "deleted": "Удалено",
    "deprecated": "УСТАРЕЛО",
@@ -758,17 +611,17 @@
    "history_deleted": "История удалена",
    "linewrap": "Обернуть линии",
    "loading": "Загрузка...",
-    "message_received": "Сообщение: {message} получено по топику: {topic}",
+    "message_received": "Message: {message} arrived on topic: {topic}",
-    "mqtt_subscription_failed": "Что-то пошло не так, при попытке подписаться на топик: {topic}",
+    "mqtt_subscription_failed": "Something went wrong while subscribing to topic: {topic}",
    "none": "Никто",
    "nothing_found": "Ничего не найдено для",
-    "published_error": "Что-то пошло не так при попытке опубликовать сообщение в топик {topic}: {message}",
+    "published_error": "Something went wrong while publishing msg: {topic} to topic: {message}",
-    "published_message": "Опубликовано сообщение: {message} в топик: {topic}",
+    "published_message": "Published message: {message} to topic: {topic}",
-    "reconnection_error": "Не удалось переподключиться",
+    "reconnection_error": "Failed to reconnect",
-    "subscribed_failed": "Не удалось подписаться на топик: {topic}",
+    "subscribed_failed": "Failed to subscribe to topic: {topic}",
-    "subscribed_success": "Успешно подписался на топик: {topic}",
+    "subscribed_success": "Successfully subscribed to topic: {topic}",
-    "unsubscribed_failed": "Не удалось отписаться от топика: {topic}",
+    "unsubscribed_failed": "Failed to unsubscribe from topic: {topic}",
-    "unsubscribed_success": "Успешно отписался от топика: {topic}",
+    "unsubscribed_success": "Successfully unsubscribed from topic: {topic}",
    "waiting_send_request": "Ожидание отправки запроса"
  },
  "support": {
@@ -777,7 +630,7 @@
    "community": "Задавайте вопросы и помогайте другим",
    "documentation": "Узнать больше о Hoppscotch",
    "forum": "Задавайте вопросы и получайте ответы",
-    "github": "Подпишитесь на нас на Github",
+    "github": "Follow us on Github",
    "shortcuts": "Просматривайте приложение быстрее",
    "team": "Свяжитесь с командой",
    "title": "Служба поддержки",
@@ -788,15 +641,15 @@
    "body": "Тело",
    "collections": "Коллекции",
    "documentation": "Документация",
-    "environments": "Окружения",
+    "environments": "Environments",
    "headers": "Заголовки",
    "history": "История",
    "mqtt": "MQTT",
    "parameters": "Параметры",
-    "pre_request_script": "Пред-скрипт",
+    "pre_request_script": "Скрипт предварительного запроса",
    "queries": "Запросы",
    "query": "Запрос",
-    "schema": "Схема",
+    "schema": "Schema",
    "socketio": "Socket.IO",
    "sse": "SSE",
    "tests": "Тесты",
@@ -813,7 +666,7 @@
    "email_do_not_match": "Электронная почта, которой Вы воспользовались не соответсвует указанной в данных Вашей учетной записи.",
    "exit": "Выйти из команды",
    "exit_disabled": "Только владелец не может выйти из команды",
-    "invalid_coll_id": "Не верный идентификатор коллекции",
+    "invalid_coll_id": "Invalid collection ID",
    "invalid_email_format": "Формат электронной почты недействителен",
    "invalid_id": "Некорректный ID команды. Свяжитесь с руководителем команды.",
    "invalid_invite_link": "Ссылка недействительна",
@@ -837,7 +690,7 @@
    "member_removed": "Пользователь удален",
    "member_role_updated": "Роли пользователей обновлены",
    "members": "Участники",
-    "more_members": "+{count}",
+    "more_members": "+{count} more",
    "name_length_insufficient": "Название команды должно быть не менее 6 символов.",
    "name_updated": "Название команды обновлено",
    "new": "Новая команда",
@@ -845,13 +698,13 @@
    "new_name": "Моя новая команда",
    "no_access": "У вас нет прав на редактирование этих коллекций",
    "no_invite_found": "Такое приглашение мы не смогли найти. Свяжитесь с руководителем команды.",
-    "no_request_found": "Запрос не найден",
+    "no_request_found": "Request not found.",
-    "not_found": "Команда не найдена, свяжитесь с владельцем команды",
+    "not_found": "Team not found. Contact your team owner.",
    "not_valid_viewer": "У Вас нет прав просматривать это. Свяжитесь с руководителем команды.",
-    "parent_coll_move": "Не удалось переместить коллекцию в дочернюю",
+    "parent_coll_move": "Cannot move collection to a child collection",
    "pending_invites": "Ожидающие приглашения",
    "permissions": "Разрешения",
-    "same_target_destination": "Таже цель и конечная точка",
+    "same_target_destination": "Same target and destination",
    "saved": "Команда сохранена",
    "select_a_team": "Выбрать команду",
    "title": "Команды",
@@ -859,9 +712,9 @@
    "we_sent_invite_link_description": "Попросите тех, кого Вы пригласили, проверить их почтовые ящики. Им нужно перейди по ссылке, чтобы подтвердить вступление в эту команду."
  },
  "team_environment": {
-    "deleted": "Окружение удалено",
+    "deleted": "Environment Deleted",
-    "duplicate": "Окружение скопировано",
+    "duplicate": "Environment Duplicated",
-    "not_found": "Окружение не найдено"
+    "not_found": "Environment not found."
  },
  "test": {
    "failed": "Тест не пройден",
@@ -881,9 +734,9 @@
    "url": "URL"
  },
  "workspace": {
-    "change": "Изменить пространство",
+    "change": "Change workspace",
-    "personal": "Моё пространство",
+    "personal": "My Workspace",
-    "team": "Пространство команды",
+    "team": "Team Workspace",
-    "title": "Рабочие пространства"
+    "title": "Workspaces"
  }
 }
--- a/packages/hoppscotch-common/locales/vi.json
+++ b/packages/hoppscotch-common/locales/vi.json
--- a/packages/hoppscotch-common/public/banner.png
+++ b/packages/hoppscotch-common/public/banner.png
--- a/packages/hoppscotch-common/public/images/banner-dark.png
+++ b/packages/hoppscotch-common/public/images/banner-dark.png
--- a/packages/hoppscotch-common/public/images/banner-light.png
+++ b/packages/hoppscotch-common/public/images/banner-light.png
--- a/packages/hoppscotch-common/src/components/app/Footer.vue
+++ b/packages/hoppscotch-common/src/components/app/Footer.vue
@@ -10,6 +10,18 @@
          :class="{ '-rotate-180': !EXPAND_NAVIGATION }"
          @click="EXPAND_NAVIGATION = !EXPAND_NAVIGATION"
        />
        <HoppButtonSecondary
          v-tippy="{ theme: 'tooltip' }"
          :title="`${ZEN_MODE ? t('action.turn_off') : t('action.turn_on')} ${t(
            'layout.zen_mode'
          )}`"
          :icon="ZEN_MODE ? IconMinimize : IconMaximize"
          :class="{
            '!text-accent !focus-visible:text-accentDark !hover:text-accentDark':
              ZEN_MODE,
          }"
          @click="ZEN_MODE = !ZEN_MODE"
        />
        <tippy interactive trigger="click" theme="popover">
          <HoppButtonSecondary
            v-tippy="{ theme: 'tooltip' }"
@@ -199,9 +211,11 @@
 </template>
 <script setup lang="ts">
-import { ref } from "vue"
+import { ref, watch } from "vue"
 import { version } from "~/../package.json"
 import IconSidebar from "~icons/lucide/sidebar"
 import IconMinimize from "~icons/lucide/minimize"
 import IconMaximize from "~icons/lucide/maximize"
 import IconZap from "~icons/lucide/zap"
 import IconShare2 from "~icons/lucide/share-2"
 import IconColumns from "~icons/lucide/columns"
@@ -227,6 +241,7 @@ const showDeveloperOptions = ref(false)
 const EXPAND_NAVIGATION = useSetting("EXPAND_NAVIGATION")
 const SIDEBAR = useSetting("SIDEBAR")
 const ZEN_MODE = useSetting("ZEN_MODE")
 const COLUMN_LAYOUT = useSetting("COLUMN_LAYOUT")
 const SIDEBAR_ON_LEFT = useSetting("SIDEBAR_ON_LEFT")
@@ -237,6 +252,13 @@ const currentUser = useReadonlyStream(
  platform.auth.getCurrentUser()
 )
 watch(
  () => ZEN_MODE.value,
  () => {
    EXPAND_NAVIGATION.value = !ZEN_MODE.value
  }
 )
 const nativeShare = () => {
  if (navigator.share) {
    navigator
--- a/packages/hoppscotch-common/src/components/app/Options.vue
+++ b/packages/hoppscotch-common/src/components/app/Options.vue
@@ -67,6 +67,7 @@
 </template>
 <script setup lang="ts">
 import { watch } from "vue"
 import IconSidebar from "~icons/lucide/sidebar"
 import IconSidebarOpen from "~icons/lucide/sidebar-open"
 import IconChevronRight from "~icons/lucide/chevron-right"
@@ -76,9 +77,17 @@ import { platform } from "~/platform"
 const t = useI18n()
 const ZEN_MODE = useSetting("ZEN_MODE")
 const EXPAND_NAVIGATION = useSetting("EXPAND_NAVIGATION")
 const SIDEBAR = useSetting("SIDEBAR")
 watch(
  () => ZEN_MODE.value,
  () => {
    EXPAND_NAVIGATION.value = !ZEN_MODE.value
  }
 )
 defineProps<{
  show: boolean
 }>()
--- a/packages/hoppscotch-common/src/components/app/spotlight/Entry.vue
+++ b/packages/hoppscotch-common/src/components/app/spotlight/Entry.vue
@@ -119,8 +119,5 @@ watch(
  &.active {
    @apply after:bg-accentLight;
  }
  scroll-padding: 4rem !important;
  scroll-margin: 4rem !important;
 }
 </style>
--- a/packages/hoppscotch-common/src/components/app/spotlight/index.vue
+++ b/packages/hoppscotch-common/src/components/app/spotlight/index.vue
@@ -40,7 +40,7 @@
            :key="`result-${result.id}`"
            :entry="result"
            :active="isEqual(selectedEntry, [sectionIndex, entryIndex])"
-            @mouseover="onMouseOver($event, sectionIndex, entryIndex)"
+            @mouseover="selectedEntry = [sectionIndex, entryIndex]"
            @action="runAction(sectionID, result)"
          />
        </div>
@@ -178,24 +178,6 @@ function runAction(searcherID: string, result: SpotlightSearcherResult) {
  emit("hide-modal")
 }
 let lastMousePosition: { x: number; y: number }
 const onMouseOver = (
  e: MouseEvent,
  sectionIndex: number,
  entryIndex: number
 ) => {
  const mousePosition = {
    x: e.clientX,
    y: e.clientY,
  }
  // if the position is same, do nothing
  if (isEqual(lastMousePosition, mousePosition)) return
  selectedEntry.value = [sectionIndex, entryIndex]
  lastMousePosition = mousePosition
 }
 function newUseArrowKeysForNavigation() {
  const selectedEntry = ref<[number, number]>([0, 0]) // [sectionIndex, entryIndex]
--- a/packages/hoppscotch-common/src/components/http/Parameters.vue
+++ b/packages/hoppscotch-common/src/components/http/Parameters.vue
@@ -9,7 +9,7 @@
      <div class="flex">
        <HoppButtonSecondary
          v-tippy="{ theme: 'tooltip' }"
-          to="https://docs.hoppscotch.io/documentation/features/rest-api-testing"
+          to="https://docs.hoppscotch.io/documentation/getting-started/rest/using-parameters"
          blank
          :title="t('app.wiki')"
          :icon="IconHelpCircle"
--- a/packages/hoppscotch-common/src/components/realtime/LogEntry.vue
+++ b/packages/hoppscotch-common/src/components/realtime/LogEntry.vue
@@ -17,7 +17,7 @@
            <span
              v-tippy="{ theme: 'tooltip' }"
              :title="relativeTime"
-              class="mx-auto truncate text-tiny text-secondaryLight hover:text-secondary hover:text-center"
+              class="mx-auto truncate ts-font text-secondaryLight hover:text-secondary hover:text-center"
            >
              {{ shortDateTime(entry.ts) }}
            </span>
@@ -406,4 +406,8 @@ const icon = computed(() => markRaw(ICONS[props.entry.source].icon))
  @apply transition;
  @apply hover: text-secondary;
 }
 .ts-font {
  font-size: 0.6rem;
 }
 </style>
--- a/packages/hoppscotch-common/src/components/smart/EnvInput.vue
+++ b/packages/hoppscotch-common/src/components/smart/EnvInput.vue
@@ -311,36 +311,35 @@ const envVars = computed(() =>
 const envTooltipPlugin = new HoppReactiveEnvPlugin(envVars, view)
-function handleTextSelection() {
+const initView = (el: any) => {
-  const selection = view.value?.state.selection.main
+  function handleTextSelection() {
-  if (selection) {
+    const selection = view.value?.state.selection.main
-    const from = selection.from
+    if (selection) {
-    const to = selection.to
+      const from = selection.from
-    if (from === to) return
+      const to = selection.to
-    const text = view.value?.state.doc.sliceString(from, to)
+      const text = view.value?.state.doc.sliceString(from, to)
-    const { top, left } = view.value?.coordsAtPos(from)
+      const { top, left } = view.value?.coordsAtPos(from)
-    if (text) {
+      if (text) {
-      invokeAction("contextmenu.open", {
+        invokeAction("contextmenu.open", {
-        position: {
+          position: {
-          top,
+            top,
-          left,
+            left,
-        },
+          },
-        text,
+          text,
-      })
+        })
-      showSuggestionPopover.value = false
+        showSuggestionPopover.value = false
-    } else {
+      } else {
-      invokeAction("contextmenu.open", {
+        invokeAction("contextmenu.open", {
-        position: {
+          position: {
-          top,
+            top,
-          left,
+            left,
-        },
+          },
-        text: null,
+          text: null,
-      })
+        })
      }
    }
  }
 }
 const initView = (el: any) => {
  // Debounce to prevent double click from selecting the word
  const debounceFn = useDebounceFn(() => {
    handleTextSelection()
@@ -382,11 +381,6 @@ const initView = (el: any) => {
      drop(ev) {
        ev.preventDefault()
      },
      scroll(event) {
        if (event.target) {
          handleTextSelection()
        }
      },
    }),
    ViewPlugin.fromClass(
      class {
--- a/packages/hoppscotch-common/src/components/smart/FontSizePicker.vue
+++ b/packages/hoppscotch-common/src/components/smart/FontSizePicker.vue
@@ -0,0 +1,71 @@
 <template>
  <span class="inline-flex">
    <tippy
      interactive
      trigger="click"
      theme="popover"
      :on-shown="() => tippyActions.focus()"
    >
      <span class="select-wrapper">
        <HoppButtonSecondary
          v-tippy="{ theme: 'tooltip' }"
          :title="t('settings.change_font_size')"
          class="pr-8"
          :icon="IconType"
          outline
          :label="`${getFontSizeName(
            fontSizes.find((size) => size === active)
          )}`"
        />
      </span>
      <template #content="{ hide }">
        <div
          ref="tippyActions"
          class="flex flex-col focus:outline-none"
          tabindex="0"
          @keyup.escape="hide()"
        >
          <HoppSmartItem
            v-for="(size, index) in fontSizes"
            :key="`size-${index}`"
            :label="`${getFontSizeName(size)}`"
            :icon="size === active ? IconCircleDot : IconCircle"
            :active="size === active"
            @click="
              () => {
                setActiveFont(size)
                hide()
              }
            "
          />
        </div>
      </template>
    </tippy>
  </span>
 </template>
 <script setup lang="ts">
 import IconCircleDot from "~icons/lucide/circle-dot"
 import IconCircle from "~icons/lucide/circle"
 import IconType from "~icons/lucide/type"
 import { HoppFontSizes, HoppFontSize, applySetting } from "~/newstore/settings"
 import { useSetting } from "@composables/settings"
 import { useI18n } from "@composables/i18n"
 import { ref } from "vue"
 const t = useI18n()
 const fontSizes = HoppFontSizes
 const active = useSetting("FONT_SIZE")
 const getFontSizeName = (size: HoppFontSize) => {
  return t(`settings.font_size_${size}`)
 }
 const setActiveFont = (size: HoppFontSize) => {
  applySetting("FONT_SIZE", size)
 }
 // Template refs
 const tippyActions = ref<any | null>(null)
 </script>
--- a/packages/hoppscotch-common/src/composables/codemirror.ts
+++ b/packages/hoppscotch-common/src/composables/codemirror.ts
@@ -216,33 +216,6 @@ export function useCodemirror(
    ? new HoppEnvironmentPlugin(subscribeToStream, view)
    : null
  function handleTextSelection() {
    const selection = view.value?.state.selection.main
    if (selection) {
      const from = selection.from
      const to = selection.to
      const text = view.value?.state.doc.sliceString(from, to)
      const { top, left } = view.value?.coordsAtPos(from)
      if (text) {
        invokeAction("contextmenu.open", {
          position: {
            top,
            left,
          },
          text,
        })
      } else {
        invokeAction("contextmenu.open", {
          position: {
            top,
            left,
          },
          text: null,
        })
      }
    }
  }
  const initView = (el: any) => {
    if (el) platform.ui?.onCodemirrorInstanceMount?.(el)
@@ -253,6 +226,33 @@ export function useCodemirror(
      ViewPlugin.fromClass(
        class {
          update(update: ViewUpdate) {
            function handleTextSelection() {
              const selection = view.value?.state.selection.main
              if (selection) {
                const from = selection.from
                const to = selection.to
                const text = view.value?.state.doc.sliceString(from, to)
                const { top, left } = view.value?.coordsAtPos(from)
                if (text) {
                  invokeAction("contextmenu.open", {
                    position: {
                      top,
                      left,
                    },
                    text,
                  })
                } else {
                  invokeAction("contextmenu.open", {
                    position: {
                      top,
                      left,
                    },
                    text: null,
                  })
                }
              }
            }
            // Debounce to prevent double click from selecting the word
            const debounceFn = useDebounceFn(() => {
              handleTextSelection()
@@ -296,13 +296,6 @@ export function useCodemirror(
          }
        }
      ),
      EditorView.domEventHandlers({
        scroll(event) {
          if (event.target) {
            handleTextSelection()
          }
        },
      }),
      EditorView.updateListener.of((update) => {
        if (options.extendedEditorConfig.readOnly) {
          update.view.contentDOM.inputMode = "none"
--- a/packages/hoppscotch-common/src/helpers/keybindings.ts
+++ b/packages/hoppscotch-common/src/helpers/keybindings.ts
@@ -56,7 +56,7 @@ export const bindings: {
  "alt-x": "request.method.delete",
  "ctrl-k": "modals.search.toggle",
  "ctrl-/": "flyouts.keybinds.toggle",
-  "shift-/": "modals.support.toggle",
+  "?": "modals.support.toggle",
  "ctrl-m": "modals.share.toggle",
  "alt-r": "navigation.jump.rest",
  "alt-q": "navigation.jump.graphql",
@@ -120,8 +120,7 @@ function generateKeybindingString(ev: KeyboardEvent): ShortcutKey | null {
 }
 function getPressedKey(ev: KeyboardEvent): Key | null {
-  const val = ev.code.toLowerCase()
+  const val = ev.key.toLowerCase()
  // Check arrow keys
  if (val === "arrowup") return "up"
  else if (val === "arrowdown") return "down"
@@ -129,20 +128,21 @@ function getPressedKey(ev: KeyboardEvent): Key | null {
  else if (val === "arrowright") return "right"
  // Check letter keys
-  const isLetter = val.startsWith("key")
+  const isLetter = ev.code.toLowerCase().startsWith("key")
-  if (isLetter) return val.substring(3) as Key
+  if (isLetter) return ev.code.toLowerCase().substring(3) as Key
  // Check if number keys
-  const isDigit = val.startsWith("digit")
+  if (val.length === 1 && !isNaN(val as any)) return val as Key
  if (isDigit) return val.substring(5) as Key
-  // Check if slash
+  // Check if question mark
-  if (val === "slash") return "/"
+  if (val === "?") return "?"
  // Check if question mark
  if (val === "/") return "/"
  // Check if period
-  if (val === "period") return "."
+  if (val === ".") return "."
  // Check if enter
  if (val === "enter") return "enter"
  // If no other cases match, this is not a valid key
--- a/packages/hoppscotch-common/src/layouts/default.vue
+++ b/packages/hoppscotch-common/src/layouts/default.vue
@@ -1,7 +1,7 @@
 <template>
  <div class="flex w-screen h-screen">
    <Splitpanes class="no-splitter" :dbl-click-splitter="false" horizontal>
-      <Pane style="height: auto">
+      <Pane v-if="!zenMode" style="height: auto">
        <AppHeader />
      </Pane>
      <Pane :class="spacerClass" class="flex flex-1 !overflow-auto md:mb-0">
@@ -79,7 +79,9 @@ const router = useRouter()
 const showSearch = ref(false)
 const showSupport = ref(false)
 const fontSize = useSetting("FONT_SIZE")
 const expandNavigation = useSetting("EXPAND_NAVIGATION")
 const zenMode = useSetting("ZEN_MODE")
 const rightSidebar = useSetting("SIDEBAR")
 const columnLayout = useSetting("COLUMN_LAYOUT")
@@ -131,9 +133,24 @@ watch(mdAndLarger, () => {
    columnLayout.value = true
  }
 })
-const spacerClass = computed(() =>
+
-  expandNavigation.value ? "spacer-small" : "spacer-expand"
+const spacerClass = computed(() => {
-)
+  if (fontSize.value === "small" && expandNavigation.value)
    return "spacer-small"
  if (fontSize.value === "medium" && expandNavigation.value)
    return "spacer-medium"
  if (fontSize.value === "large" && expandNavigation.value)
    return "spacer-large"
  if (
    (fontSize.value === "small" ||
      fontSize.value === "medium" ||
      fontSize.value === "large") &&
    !expandNavigation.value
  )
    return "spacer-expand"
  return ""
 })
 defineActionHandler("modals.search.toggle", () => {
  showSearch.value = !showSearch.value
--- a/packages/hoppscotch-common/src/modules/theming.ts
+++ b/packages/hoppscotch-common/src/modules/theming.ts
@@ -68,9 +68,23 @@ const applyAccentColor = (_app: App) => {
  )
 }
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 const applyFontSize = (_app: App) => {
  const [pref] = useSettingStatic("FONT_SIZE")
  watch(
    pref,
    (newPref) => {
      document.documentElement.setAttribute("data-font-size", newPref)
    },
    { immediate: true }
  )
 }
 export default <HoppModule>{
  onVueAppInit(app) {
    applyColorMode(app)
    applyAccentColor(app)
    applyFontSize(app)
  },
 }
--- a/packages/hoppscotch-common/src/newstore/settings.ts
+++ b/packages/hoppscotch-common/src/newstore/settings.ts
@@ -23,6 +23,10 @@ export const HoppAccentColors = [
 export type HoppAccentColor = (typeof HoppAccentColors)[number]
 export const HoppFontSizes = ["small", "medium", "large"] as const
 export type HoppFontSize = (typeof HoppFontSizes)[number]
 export type SettingsDef = {
  syncCollections: boolean
  syncHistory: boolean
@@ -45,6 +49,8 @@ export type SettingsDef = {
  EXPAND_NAVIGATION: boolean
  SIDEBAR: boolean
  SIDEBAR_ON_LEFT: boolean
  ZEN_MODE: boolean
  FONT_SIZE: HoppFontSize
  COLUMN_LAYOUT: boolean
 }
@@ -70,6 +76,8 @@ export const getDefaultSettings = (): SettingsDef => ({
  EXPAND_NAVIGATION: true,
  SIDEBAR: true,
  SIDEBAR_ON_LEFT: true,
  ZEN_MODE: false,
  FONT_SIZE: "small",
  COLUMN_LAYOUT: true,
 })
--- a/packages/hoppscotch-common/src/pages/index.vue
+++ b/packages/hoppscotch-common/src/pages/index.vue
@@ -141,7 +141,6 @@ import { InspectionService } from "~/services/inspection"
 import { HeaderInspectorService } from "~/services/inspection/inspectors/header.inspector"
 import { EnvironmentInspectorService } from "~/services/inspection/inspectors/environment.inspector"
 import { ResponseInspectorService } from "~/services/inspection/inspectors/response.inspector"
 import { cloneDeep } from "lodash-es"
 const savingRequest = ref(false)
 const confirmingCloseForTabID = ref<string | null>(null)
@@ -229,14 +228,11 @@ const removeTab = (tabID: string) => {
 }
 const closeOtherTabsAction = (tabID: string) => {
  const isTabDirty = getTabRef(tabID).value?.document.isDirty
  const dirtyTabCount = getDirtyTabsCount()
  // If current tab is dirty, so we need to subtract 1 from the dirty tab count
  const balanceDirtyTabCount = isTabDirty ? dirtyTabCount - 1 : dirtyTabCount
  // If there are dirty tabs, show the confirm modal
-  if (balanceDirtyTabCount > 0) {
+  if (dirtyTabCount > 0) {
    confirmingCloseAllTabs.value = true
-    unsavedTabsCount.value = balanceDirtyTabCount
+    unsavedTabsCount.value = dirtyTabCount
    exceptedTabID.value = tabID
  } else {
    closeOtherTabs(tabID)
@@ -247,7 +243,7 @@ const duplicateTab = (tabID: string) => {
  const tab = getTabRef(tabID)
  if (tab.value) {
    const newTab = createNewTab({
-      request: cloneDeep(tab.value.document.request),
+      request: tab.value.document.request,
      isDirty: true,
    })
    currentTabID.value = newTab.id
--- a/packages/hoppscotch-common/src/pages/settings.vue
+++ b/packages/hoppscotch-common/src/pages/settings.vue
@@ -1,6 +1,6 @@
 <template>
  <div>
-    <div class="container divide-y divide-dividerLight">
+    <div class="container space-y-8 divide-y divide-dividerLight">
      <div class="md:grid md:gap-4 md:grid-cols-3">
        <div class="p-8 md:col-span-1">
          <h3 class="heading">
@@ -36,6 +36,14 @@
              <SmartAccentModePicker />
            </div>
          </section>
          <section>
            <h4 class="font-semibold text-secondaryDark">
              {{ t("settings.font_size") }}
            </h4>
            <div class="mt-4">
              <SmartFontSizePicker />
            </div>
          </section>
          <section>
            <h4 class="font-semibold text-secondaryDark">
              {{ t("settings.language") }}
@@ -82,6 +90,14 @@
                  {{ t("settings.sidebar_on_left") }}
                </HoppSmartToggle>
              </div>
              <div class="flex items-center">
                <HoppSmartToggle
                  :on="ZEN_MODE"
                  @change="toggleSetting('ZEN_MODE')"
                >
                  {{ t("layout.zen_mode") }}
                </HoppSmartToggle>
              </div>
            </div>
          </section>
        </div>
@@ -162,6 +178,7 @@ const PROXY_URL = useSetting("PROXY_URL")
 const TELEMETRY_ENABLED = useSetting("TELEMETRY_ENABLED")
 const EXPAND_NAVIGATION = useSetting("EXPAND_NAVIGATION")
 const SIDEBAR_ON_LEFT = useSetting("SIDEBAR_ON_LEFT")
 const ZEN_MODE = useSetting("ZEN_MODE")
 const confirmRemove = ref(false)
@@ -169,6 +186,10 @@ const proxySettings = computed(() => ({
  url: PROXY_URL.value,
 }))
 watch(ZEN_MODE, (mode) => {
  applySetting("EXPAND_NAVIGATION", !mode)
 })
 watch(
  proxySettings,
  ({ url }) => {
--- a/packages/hoppscotch-common/src/platform/std/ui/supportOptionsItem.ts
+++ b/packages/hoppscotch-common/src/platform/std/ui/supportOptionsItem.ts
@@ -72,7 +72,7 @@ export const twitter: HoppSupportOptionsMenuItem = {
  icon: IconTwitter,
  action: {
    type: "link",
-    href: "https://hoppscotch.io/twitter",
+    href: "https://hoppscotch.io/discord",
  },
 }
@@ -84,7 +84,17 @@ export const invite: HoppSupportOptionsMenuItem = {
  action: {
    type: "custom",
    do() {
-      invokeAction("modals.share.toggle")
+      if (navigator.share) {
        navigator
          .share({
            title: "Hoppscotch",
            text: "Hoppscotch • Open source API development ecosystem - Helps you create requests faster, saving precious time on development.",
            url: "https://hoppscotch.io",
          })
          .catch(console.error)
      } else {
        // fallback
      }
    },
  },
 }
--- a/packages/hoppscotch-common/src/services/spotlight/searchers/settings.searcher.ts
+++ b/packages/hoppscotch-common/src/services/spotlight/searchers/settings.searcher.ts
@@ -14,6 +14,7 @@ import IconGlobe from "~icons/lucide/globe"
 import IconMonitor from "~icons/lucide/monitor"
 import IconMoon from "~icons/lucide/moon"
 import IconSun from "~icons/lucide/sun"
 import IconCircle from "~icons/lucide/circle"
 import IconCheckCircle from "~icons/lucide/check-circle"
 type Doc = {
@@ -33,6 +34,7 @@ export class SettingsSpotlightSearcherService extends StaticSpotlightSearcherSer
  private t = getI18n()
  private activeFontSize = useSetting("FONT_SIZE")
  private activeTheme = useSetting("BG_COLOR")
  public readonly searcherID = "settings"
@@ -89,7 +91,60 @@ export class SettingsSpotlightSearcherService extends StaticSpotlightSearcherSer
          : markRaw(IconMoon)
      ),
    },
-
+    font_size_sm: {
      text: [
        this.t("settings.font_size"),
        this.t("spotlight.settings.font.size_sm"),
      ],
      onClick: () => {
        console.log("clicked")
      },
      alternates: [
        "font size",
        "change font size",
        "change font",
        "increase font",
      ],
      icon: computed(() =>
        this.activeFontSize.value === "small"
          ? markRaw(IconCheckCircle)
          : markRaw(IconCircle)
      ),
    },
    font_size_md: {
      text: [
        this.t("settings.font_size"),
        this.t("spotlight.settings.font.size_md"),
      ],
      alternates: [
        "font size",
        "change font size",
        "change font",
        "increase font",
      ],
      icon: computed(() =>
        this.activeFontSize.value === "medium"
          ? markRaw(IconCheckCircle)
          : markRaw(IconCircle)
      ),
    },
    font_size_lg: {
      text: [
        this.t("settings.font_size"),
        this.t("spotlight.settings.font.size_lg"),
      ],
      alternates: [
        "font size",
        "change font size",
        "change font",
        "increase font",
      ],
      icon: computed(() =>
        this.activeFontSize.value === "large"
          ? markRaw(IconCheckCircle)
          : markRaw(IconCircle)
      ),
    },
    change_lang: {
      text: [
        this.t("spotlight.section.interface"),
@@ -147,6 +202,17 @@ export class SettingsSpotlightSearcherService extends StaticSpotlightSearcherSer
      case "theme_black":
        invokeAction("settings.theme.black")
        break
      // font size actions
      case "font_size_sm":
        this.activeFontSize.value = "small"
        break
      case "font_size_md":
        this.activeFontSize.value = "medium"
        break
      case "font_size_lg":
        this.activeFontSize.value = "large"
        break
    }
  }
 }
--- a/packages/hoppscotch-sh-admin/assets/scss/themes.scss
+++ b/packages/hoppscotch-sh-admin/assets/scss/themes.scss
@@ -1,21 +1,8 @@
@mixin base-theme {
-  --font-sans: 'Inter Variable', sans-serif;
+  --font-sans: "Inter Variable", sans-serif;
-  --font-icon: 'Material Symbols Rounded Variable';
+  --font-icon: "Material Symbols Rounded Variable";
-  --font-mono: 'Roboto Mono Variable', monospace;
+  --font-mono: "Roboto Mono Variable", monospace;
-  --font-size-body: 0.75rem;
+  --font-size-tiny: calc(var(--font-size-body) - 0.062rem);
  --font-size-tiny: 0.688rem;
  --line-height-body: 1rem;
  --upper-primary-sticky-fold: 4.125rem;
  --upper-secondary-sticky-fold: 6.188rem;
  --upper-tertiary-sticky-fold: 8.25rem;
  --upper-mobile-primary-sticky-fold: 6.625rem;
  --upper-mobile-secondary-sticky-fold: 8.688rem;
  --upper-mobile-sticky-fold: 10.75rem;
  --upper-mobile-tertiary-sticky-fold: 8.25rem;
  --lower-primary-sticky-fold: 3rem;
  --lower-secondary-sticky-fold: 5.063rem;
  --lower-tertiary-sticky-fold: 7.125rem;
  --sidebar-primary-sticky-fold: 2rem;
 }
@mixin dark-theme {
@@ -213,8 +200,8 @@
 :root {
  @include base-theme;
  @include dark-theme;
  @include dark-editor-theme;
  @include green-theme;
  @include dark-editor-theme;
 }
 :root.light {
@@ -270,3 +257,63 @@
 :root[data-accent='yellow'] {
  @include yellow-theme;
 }
@mixin font-small {
  --font-size-body: 0.75rem;
  --line-height-body: 1rem;
  --upper-primary-sticky-fold: 4.125rem;
  --upper-secondary-sticky-fold: 6.188rem;
  --upper-tertiary-sticky-fold: 8.25rem;
  --upper-mobile-primary-sticky-fold: 6.625rem;
  --upper-mobile-secondary-sticky-fold: 8.688rem;
  --upper-mobile-sticky-fold: 10.75rem;
  --upper-mobile-tertiary-sticky-fold: 8.25rem;
  --lower-primary-sticky-fold: 3rem;
  --lower-secondary-sticky-fold: 5.063rem;
  --lower-tertiary-sticky-fold: 7.125rem;
  --sidebar-primary-sticky-fold: 2rem;
 }
@mixin font-medium {
  --font-size-body: 0.875rem;
  --line-height-body: 1.25rem;
  --upper-primary-sticky-fold: 4.375rem;
  --upper-secondary-sticky-fold: 6.688rem;
  --upper-tertiary-sticky-fold: 9rem;
  --upper-mobile-primary-sticky-fold: 7.125rem;
  --upper-mobile-secondary-sticky-fold: 9.438rem;
  --upper-mobile-sticky-fold: 11.75rem;
  --upper-mobile-tertiary-sticky-fold: 9rem;
  --lower-primary-sticky-fold: 3.25rem;
  --lower-secondary-sticky-fold: 5.563rem;
  --lower-tertiary-sticky-fold: 7.875rem;
  --sidebar-primary-sticky-fold: 2.25rem;
 }
@mixin font-large {
  --font-size-body: 1rem;
  --line-height-body: 1.5rem;
  --upper-primary-sticky-fold: 4.625rem;
  --upper-secondary-sticky-fold: 7.188rem;
  --upper-tertiary-sticky-fold: 9.75rem;
  --upper-mobile-primary-sticky-fold: 7.625rem;
  --upper-mobile-secondary-sticky-fold: 10.188rem;
  --upper-mobile-sticky-fold: 12.75rem;
  --upper-mobile-tertiary-sticky-fold: 9.75rem;
  --lower-primary-sticky-fold: 3.5rem;
  --lower-secondary-sticky-fold: 6.063rem;
  --lower-tertiary-sticky-fold: 8.625rem;
  --sidebar-primary-sticky-fold: 2.5rem;
 }
 :root[data-font-size='small'] {
  @include font-small;
 }
 :root[data-font-size='medium'] {
  @include font-medium;
 }
 :root[data-font-size='large'] {
  @include font-large;
 }
--- a/packages/hoppscotch-sh-admin/index.html
+++ b/packages/hoppscotch-sh-admin/index.html
@@ -1,17 +1,20 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" data-font-size="medium">
-  <head>
+
-    <script>
+<head>
-      globalThis.import_meta_env = JSON.parse('"import_meta_env_placeholder"');
+  <script>
-    </script>
+    globalThis.import_meta_env = JSON.parse('"import_meta_env_placeholder"')
-    <meta charset="UTF-8" />
+  </script>
-    <link rel="icon" href="/favicon.ico" />
+  <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link rel="icon" href="/favicon.ico" />
-    <title>Hoppscotch Admin</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta property="og:image" content="/cover.jpg" />
+  <title>Hoppscotch Admin</title>
-  </head>
+  <meta property="og:image" content="/cover.jpg" />
-  <body>
+</head>
-    <div id="app"></div>
+
-    <script type="module" src="/src/main.ts"></script>
+<body>
-  </body>
+  <div id="app"></div>
  <script type="module" src="/src/main.ts"></script>
 </body>
 </html>
--- a/packages/hoppscotch-ui/src/assets/scss/themes.scss
+++ b/packages/hoppscotch-ui/src/assets/scss/themes.scss
@@ -2,20 +2,7 @@
  --font-sans: "Inter Variable", sans-serif;
  --font-icon: "Material Symbols Rounded Variable";
  --font-mono: "Roboto Mono Variable", monospace;
-  --font-size-body: 0.75rem;
+  --font-size-tiny: calc(var(--font-size-body) - 0.062rem);
  --font-size-tiny: 0.688rem;
  --line-height-body: 1rem;
  --upper-primary-sticky-fold: 4.125rem;
  --upper-secondary-sticky-fold: 6.188rem;
  --upper-tertiary-sticky-fold: 8.25rem;
  --upper-mobile-primary-sticky-fold: 6.625rem;
  --upper-mobile-secondary-sticky-fold: 8.688rem;
  --upper-mobile-sticky-fold: 10.75rem;
  --upper-mobile-tertiary-sticky-fold: 8.25rem;
  --lower-primary-sticky-fold: 3rem;
  --lower-secondary-sticky-fold: 5.063rem;
  --lower-tertiary-sticky-fold: 7.125rem;
  --sidebar-primary-sticky-fold: 2rem;
 }
@mixin dark-theme {
@@ -213,8 +200,8 @@
 :root {
  @include base-theme;
  @include dark-theme;
  @include dark-editor-theme;
  @include green-theme;
  @include dark-editor-theme;
 }
 :root.light {
@@ -270,3 +257,63 @@
 :root[data-accent="yellow"] {
  @include yellow-theme;
 }
@mixin font-small {
  --font-size-body: 0.75rem;
  --line-height-body: 1rem;
  --upper-primary-sticky-fold: 4.125rem;
  --upper-secondary-sticky-fold: 6.188rem;
  --upper-tertiary-sticky-fold: 8.25rem;
  --upper-mobile-primary-sticky-fold: 6.625rem;
  --upper-mobile-secondary-sticky-fold: 8.688rem;
  --upper-mobile-sticky-fold: 10.75rem;
  --upper-mobile-tertiary-sticky-fold: 8.25rem;
  --lower-primary-sticky-fold: 3rem;
  --lower-secondary-sticky-fold: 5.063rem;
  --lower-tertiary-sticky-fold: 7.125rem;
  --sidebar-primary-sticky-fold: 2rem;
 }
@mixin font-medium {
  --font-size-body: 0.875rem;
  --line-height-body: 1.25rem;
  --upper-primary-sticky-fold: 4.375rem;
  --upper-secondary-sticky-fold: 6.688rem;
  --upper-tertiary-sticky-fold: 9rem;
  --upper-mobile-primary-sticky-fold: 7.125rem;
  --upper-mobile-secondary-sticky-fold: 9.438rem;
  --upper-mobile-sticky-fold: 11.75rem;
  --upper-mobile-tertiary-sticky-fold: 9rem;
  --lower-primary-sticky-fold: 3.25rem;
  --lower-secondary-sticky-fold: 5.563rem;
  --lower-tertiary-sticky-fold: 7.875rem;
  --sidebar-primary-sticky-fold: 2.25rem;
 }
@mixin font-large {
  --font-size-body: 1rem;
  --line-height-body: 1.5rem;
  --upper-primary-sticky-fold: 4.625rem;
  --upper-secondary-sticky-fold: 7.188rem;
  --upper-tertiary-sticky-fold: 9.75rem;
  --upper-mobile-primary-sticky-fold: 7.625rem;
  --upper-mobile-secondary-sticky-fold: 10.188rem;
  --upper-mobile-sticky-fold: 12.75rem;
  --upper-mobile-tertiary-sticky-fold: 9.75rem;
  --lower-primary-sticky-fold: 3.5rem;
  --lower-secondary-sticky-fold: 6.063rem;
  --lower-tertiary-sticky-fold: 8.625rem;
  --sidebar-primary-sticky-fold: 2.5rem;
 }
 :root[data-font-size="small"] {
  @include font-small;
 }
 :root[data-font-size="medium"] {
  @include font-medium;
 }
 :root[data-font-size="large"] {
  @include font-large;
 }