diff --git a/docs/studio/assets.md b/docs/studio/assets.md
deleted file mode 100644
index 20a68326ab6..00000000000
--- a/docs/studio/assets.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Asset Management
-
-The **Assets** section is a quick and easy way to add images or other media to Ionic apps.
-
-
-
-
-
-The files listed are all contained in the `src/assets` directory, which makes them available in the Ionic app.
-
-## Assets Window
-
-When an element is selected inside of Compose mode that takes `src` as an attribute (such as an `img` tag), the "Choose" button will open the assets window and an asset can be selected for the element attribute.
-
-
-
-
diff --git a/docs/studio/code.md b/docs/studio/code.md
deleted file mode 100644
index 7196a738e52..00000000000
--- a/docs/studio/code.md
+++ /dev/null
@@ -1,40 +0,0 @@
-# Working with Code
-
-Ionic Studio works alongside your code editor of choice to enable more complex development workflows
-that go beyond Studio's UI development features.
-
-## Launching your Editor
-
-To launch your Studio app project in your editor of choice, navigate to the Designer index and click "Open in editor." Alternatively,
-the Project -> Open in Editor menu bar item may be used.
-
-
-
-
-
-## Configuring your Editor
-
-Studio detects a number of popular code editors, such as Visual Studio Code, Sublime Text, and more.
-
-If Studio is not able to detect your editor, ensure that one is installed and configured in the default manner.
-
-Studio will automatically detect one of
-
-- Sublime Text
-- Atom
-- Visual Studio Code
-- WebStorm
-- TextMate
-- Vim
-- NeoVim
-- IntelliJ
-- GNU nano
-- GNU Emacs
-
-## Opening in another editor
-
-If Studio does not automatically detect your editor or your editor is not on the list of supported editors,
-the app project can always be opened directly.
-
-To find the project path, use the Project -> Open in Finder (or Explorer) option to navigate to the project
-directory on disk and navigate to that path in your editor's project open dialog.
diff --git a/docs/studio/designer.md b/docs/studio/designer.md
deleted file mode 100644
index f026bd5e459..00000000000
--- a/docs/studio/designer.md
+++ /dev/null
@@ -1,179 +0,0 @@
-# Designer Overview
-
-The Designer is the powerhouse of Studio, offering a drag-and-drop page builder for pages and components, with a code-behind editor for the template, styles, and scripts (TypeScript)
-
-## Introduction
-
-With the Designer, developers can:
-
-- Drag and drop to build pages and components
-- Select from the entire library of Ionic elements for drag-and-drop _and_ code editing.
-- Switch between visual and code editing for pages and components
-- View and work with most supported Ionic element properties, saving a trip checking the Documentation
-
-
-
-
-
-## Pages and Components
-
-In the Designer, pages and components work directly off of the files powering them (TypeScript, HTML, CSS).
-
-When first loaded, the Designer index is shown. This index lsits the pages and custom components that Studio detected in the app. Components detected can be seen by switching to the components tab.
-
-Studio finds pages and components by scanning your project looking for Component source files, so works on a variety of project file layouts.
-
-
-
- Since the difference between pages and components is conceptual, Ionic Studio relies on convention to differentiate
- them. If there are pages missing, make sure each page follows the convention Ionic Studio is expecting:
-
-
- The files that represent each page must have the proper suffixes (e.g. .page.ts,{' '}
- .page.html, .page.scss). See the{' '}
- Angular style guide for additional information about naming
- conventions.
-
-
-
-
-
-
-
-Switching to the component section on the Designer index reveals all the components found in the app.
-
-
-
-
-
-See [Adding Pages and Components](#adding-pages-and-components) to create new pages and components.
-
-## Adding Pages and Components
-
-To add pages or components to an app, click the **New** button in the top right of the page index.
-
-
-
-
-
-When adding a component (rather than a page), Studio will prompt for the name and a page in which to register it.
-
-
-
-
-
-This adds the component as a _import_ in the NgModule of the selected page, which allows it to be used in that page.
-
-
- The same code changes are necessary to use the component in other pages. See [this
- FAQ](faq.md#using-a-custom-component-in-additional-pages) for details.
-
-
-## Drag & Drop
-
-The Designer offers a drag & drop canvas for quickly adding new elements and rearranging existing elements.
-
-### Selecting Elements
-
-To select an element, click on it in the canvas. To select a child element, double click on its parent. Continue to double click to select deeper child elements and to edit text.
-
-To enable fine-selection, which selects the deepest child under the mouse cursor, hold down the Ctrl key (or Command for macOS) and hover over an element.
-
-To exit the current selection, use the Esc key.
-
-To select any element under the cursor, right click and choose an element from the `Select Element` dropdown:
-
-
-
-
-
-To select any element in the current document, access the element tree and click on the element to select:
-
-
-
-
-
-### Adding New Elements
-
-To add new elements to a page or component, drag and drop a new element from the Elements list, or use right click and "Quick Add" to
-add context-specific elements easily.
-
-
-
-
-
-Elements may also be dragged into the HTML for a page or component, and will result in a new code snippet being inserted at the cursor position.
-
-### Quick Adding New Elements
-
-Certain elements support quickly adding child elements by right-clicking and selecting an element in the `Quick Add` menu. Some components that support quickly adding new elements include List, List Item, Grid, Segment Button, and more.
-
-
-
-
-
-### Rearranging Existing Elements
-
-To rearrange existing elements in the canvas, click and hold on it, then drag it into place.
-
-Remember, it is also possible to drag and drop code selections in the code editor.
-
-## Properties Panel
-
-When an element is selected in the Designer canvas, the properties panel will update to reflect the selected element.
-
-
-
-
-
-In the properties panel, the properties that can be modified are listed.
-
-For Ionic components, the properties panel contains a link to the component's documentation at the bottom.
-
-
- Unfortunately, the properties panel does not show properties for custom components in your app, but this is a feature
- we'll be adding!
-
-
-## Editor View
-
-The HTML, CSS, and JS (TypeScript) for a page or company can be edited by switching to the Editor View:
-
-
-
-
-
-## Template Editing
-
-Each page or component has an HTML template that makes up its structure. Template editing makes it easy to make quick edits to the template, such as changing text or dragging in new element code snippets from the Elements list.
-
-
-
-
-
-## Styles Editing
-
-The Styles editor contains the CSS (Sass) for that page or component.
-
-Any changes to the styles are reflected in the canvas when saved. The styles in this mode are only applicable to the current page or component.
-
-
-
-
-
-## Scripts Editing
-
-The **Scripts** editor is for making changes to the controller, or logic, behind a page or component. This editor is used for making
-quick changes to logic for the page or component. For more complicated changes we recommend opening the project in a full-fledged code editor.
-
-
-
-
-
-## Troubleshooting the Canvas
-
-If the canvas gets into an inconsistent or incorrect state, click the reload icon from the canvas utility bar to cause the canvas to reload its current contents:
-
-
-
-
diff --git a/docs/studio/faq.md b/docs/studio/faq.md
deleted file mode 100644
index 49a116ceabd..00000000000
--- a/docs/studio/faq.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# Frequently Asked Questions
-
-## Which versions of Ionic Framework are supported?
-
-Ionic Studio currently supports apps using **Ionic 4** and **Angular**.
-
-Ionic 3 is not supported. We encourage you to [migrate to Ionic 4](https://ionicframework.com/docs/reference/migration).
-
-## Is Capacitor supported?
-
-Ionic Studio currently does not support Capacitor. We plan to add support soon now that Capacitor has reached 1.0.
-
-## Can I use a component in multiple pages?
-
-Yes. In order to preserve speed, Angular only loads the components that it needs for any given page. This means that in order to use a custom component inside of a page, you must first make sure that components module is imported into your pages module.
-
-Open up the page you'd like to use a component in, then navigate to the module tab. Take note of the `import` line as well as the `import` in `ngModule`. Both things are required in order to load your component on a page.
-
-In this example, our component is called "MyCustomThing":
-
-
-
-
diff --git a/docs/studio/guides/routing-and-navigation.md b/docs/studio/guides/routing-and-navigation.md
deleted file mode 100644
index ac666208502..00000000000
--- a/docs/studio/guides/routing-and-navigation.md
+++ /dev/null
@@ -1,29 +0,0 @@
-# Routing and Navigation
-
-A key part of developing Ionic apps is setting up routing and ensuring fluid navigation between pages.
-
-The Ionic Framework docs have a [great primer](../../angular/navigation.md) on Angular routing and navigation.
-
-## Quick Tips
-
-The following tips assume you already know the basics about Angular routing.
-
-### Adding a New Page
-
-When you add a new Page in Ionic Studio, it is automatically added to the routing configuration inside of `app-routing.module.ts`.
-
-
-
-
-
-If you'd like to change where this page is "located", you might want to move the Route into a different routing or module file.
-
-### Using a Page in Multiple Places
-
-You can use the same page in multiple places by ensuring that a route exists for it from those locations. For instance, if you'd like the "Detail" Page to be accessible inside of Tab1 of your application as well as Tab2, you'd want a `/detail` declaration in the router for both Tab1 and Tab2.
-
-### Using RouterLink
-
-You should be using the `[routerLink]="['/tabs','tab1']"` style of navigation when trying to make a button or list-item (or other component) link to a different page.
-
-If this throws an error, you need to ensure that RouterModule is included in your pages module.
diff --git a/docs/studio/guides/using-native-functionality.md b/docs/studio/guides/using-native-functionality.md
deleted file mode 100644
index 41e0f4089e6..00000000000
--- a/docs/studio/guides/using-native-functionality.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Using Native Functionality
-
-Depending on which Cordova Plugin you're using, you may need to run your app on a physical or virtual device in order to test out that feature.
-
-For instance, a plugin for utilizing the Gyroscope will only work on a physical device, while a plugin for Storage will work in Serve as well.
-
-In order to debug Native Functionality, it is best to utilize the native tooling. For instance, you might want to use the following in order to test:
-
-1. In Studio's main toolbar, click on **Project** » **Build** » **Build iOS** (or Android)
-1. Click on **Project** » **Open in XCode** (or Android Studio)
-1. Use XCode or Android Studio to run your project on your physical device.
-1. You now have access to native debugging logs inside of XCode or Android Studio.
-1. You can also use Safari (iOS) or Chrome (Android) in order to inspect the web content of your application.
-
-For more detailed instructions, please see the [Building for iOS](../../developing/ios.md) or [Building for Android](../../developing/android.md) documentation.
-
-If you'd like to follow along with a beginners tutorial that includes utilizing the Camera Cordova plugin, please see our [Build your First App guide](../../angular/your-first-app.md). While this guide isn't specific to Studio, you can still follow along using Studio.
diff --git a/docs/studio/running.md b/docs/studio/running.md
deleted file mode 100644
index 8636ae2f597..00000000000
--- a/docs/studio/running.md
+++ /dev/null
@@ -1,66 +0,0 @@
-# Running Apps
-
-Ionic Studio offers support for serving, running, and deploying apps.
-
-Serving, running, and deploying each have pros and cons.
-
-- **Serving** is easy and requires no native project setup, but doesn't work with native functionality
-- **Running** apps can be complex and difficult to debug, but allows the app to be tested on a real device
-- **Installing** is the best way to make sure the app is ready for production, but doesn't work with livereload
-
-## Serving Apps
-
-When an app is served, Ionic Studio starts a Dev Server with [Live Reload](../reference/glossary.md#livereload) and displays the app in a separate browser window, called a _Serve Window_.
-
-To serve an app, click the Play button in the upper right-hand corner of Ionic Studio. Then choose _Serve_ from the dropdown.
-
-This will compile the app and then watch for changes in source files. When changes are made, the app will automatically be reloaded with the latest changes.
-
-### Serve Window
-
-After compilation, the app is opened inside a Serve Window.
-
-
-
-
-
-The Serve Window toolbar offers features such as changing the device viewport, switching between portrait and landscape orientation, reloading the webview, and opening the DevTools for debugging.
-
-When the device viewport changes, the Serve Window is resized and will be reloaded to reflect the appropriate device styles, whether iOS or Material Design.
-
-It is possible to open multiple Serve Windows by using the Play button and choosing _Serve_. This is useful for testing the look and feel on iOS and Android, testing the app on different viewports or orientations, all at the same time.
-
-#### Debugging
-
-Clicking the debug button will open a proper instance of the Chrome DevTools for the app. Right-clicking on app features will open a context menu with _Inspect Element_.
-
-For information on how to use the Chrome DevTools, see the [Chrome DevTools documentation](https://developers.google.com/web/tools/chrome-devtools/).
-
-
-
-
-
-## Running Apps
-
-
- Since running an app will install it on an actual native device, some additional setup is required. See the [Native
- iOS & Android](setup/native.md) documentation for setup guides.
-
-
-To run an app, click the Play button in the upper right-hand corner of Ionic Studio. Then choose _Run_ from the dropdown.
-
-
-
-
-
-Choose a platform and a target device, which can be an emulator or hardware device plugged in to your computer.
-
-With the Live Reload option, Ionic Studio will use the same Dev Server as in _Serve_, which enables quick development while working with actual devices.
-
-To debug running apps, see the docs for debugging [iOS Apps](../developing/ios.md#debugging-ios-apps) and [Android Apps](../developing/android.md#debugging-android-apps).
-
-## Installing Apps
-
-To install a standalone version of an app, use _Run_ and then switch off the _Live Reload_ option.
-
-This will copy app assets onto the target device or emulator, instead of using a Dev Server, which allows the app to continue working when the device is disconnected from the computer.
diff --git a/docs/studio/settings.md b/docs/studio/settings.md
deleted file mode 100644
index 3adc2e9bd06..00000000000
--- a/docs/studio/settings.md
+++ /dev/null
@@ -1,68 +0,0 @@
-# Settings
-
-Manage app configuration and settings.
-
-## Config
-
-The **Config** section is for managing the common settings in `config.xml` such as the name and version of the app, as well as the Bundle ID (aka [Package ID](../reference/glossary.md#package-id)).
-
-
-
-
-
-## Platforms
-
-The **Platforms** section is for managing Cordova platforms. Use the appropriate buttons to add, remove, and update platforms.
-
-
-
-
-
-## Plugins
-
-The **Plugins** section is for managing Cordova plugins. Use the appropriate buttons to add, remove, and update plugins.
-
-
-
-
-
-### Installing Plugins
-
-To install a Cordova plugin, click the **Add** button. The install modal will open, then click **Install** to confirm. If a plugin requires variables, the modal will prompt for them.
-
-The plugins available for install comprise all [Ionic Native](../native.md) plugins. When a plugin is installed, both the Cordova plugin and the Ionic Native wrapper are installed automatically.
-
-
-
- It is not yet possible in Ionic Studio to install Cordova plugins other than those in Ionic Native. This feature is
- coming soon!
-
-
- You can always install the Cordova plugin in the command line by using Project »{' '}
- Open in Terminal and following the installation docs for the Cordova plugin.
-
-
-
-
- Some plugins may require variables that Ionic Studio isn't aware of. In this case, the install will fail. Try
- installing the plugin again with the necessary variables and let us know by [reporting the bug](support.md).
-
-
-## Icon & Splash Screen
-
-The **Icon & Splash Screen** section is for managing app resources. When changing icons and splash screens within Ionic Studio, the appropriate sizes required for the vast collection of device sizes and types will be generated automatically.
-
-Ionic Studio uses the Ionic CLI command ionic cordova resources to generate app resources. More information about icons and splash screens can be found in [the CLI docs](../cli/commands/cordova-resources.md).
-
-
-
-
-
-## Linking to Appflow
-
-If your account has access to [Appflow](https://ionic.io/appflow) and you'd like to use it for this app, you can quickly link it with your Appflow account
-in this section of the settings area:
-
-
-
-
diff --git a/docs/studio/setup/installation.md b/docs/studio/setup/installation.md
deleted file mode 100644
index 65b99714ed9..00000000000
--- a/docs/studio/setup/installation.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Installing Studio
-
-The latest downloads for Ionic Studio are available in the [Ionic Dashboard](https://dashboard.ionicframework.com/personal/downloads).
-
-## Prerequisites
-
-- macOS or Windows 10
-- Make sure you have the latest LTS release of [Node & npm](../../intro/environment.md#node-npm) set up on your computer
-- Optionally install [Git](../../intro/environment.md#git) for version control
-
-## Installation
-
-The Ionic Studio download link can be obtained in the [downloads section](https://dashboard.ionicframework.com/personal/downloads) of the Ionic Dashboard.
-
-Once Ionic Studio has been downloaded, run through the installer and open Ionic Studio to continue the installation process. Ionic Studio has a few tools it depends on, which are installed and updated automatically when it boots up.
-
-Ionic Studio will automatically update itself when new versions are released, but can be reinstalled by using the download link found above.
diff --git a/docs/studio/setup/native.md b/docs/studio/setup/native.md
deleted file mode 100644
index 392c8137d73..00000000000
--- a/docs/studio/setup/native.md
+++ /dev/null
@@ -1,13 +0,0 @@
-# Native iOS & Android
-
-Utilizing native functionality in your app may require additional setup, including:
-
-- Using Cordova Plugins to access Hardware APIs
-- Running the app on hardware or virtual devices
-- Building app binaries
-- Publishing to the App Store or Google Play Store
-
-Follow our native platform setup guides to prepare your environment:
-
-- [iOS Setup](../../developing/ios.md) (macOS only)
-- [Android Setup](../../developing/android.md)
diff --git a/docs/studio/start.md b/docs/studio/start.md
deleted file mode 100644
index ea562de7458..00000000000
--- a/docs/studio/start.md
+++ /dev/null
@@ -1,13 +0,0 @@
-# Getting Started
-
-To create a new Ionic Studio app:
-
-1. Open the New Project modal with **File** » **New Project**. 
-2. Supply a name for your app. This can be changed later.
-3. Optionally supply a Bundle ID (aka [Package ID](../reference/glossary.md#package-id)), which is used to identify your app when published. It's okay to leave this blank for now.
-4. Choose the template you'd like to start with. For a demo of Studio on a real app, choose the sample option (note this is intended only as a demo)
-5. Click **Create App**.
-
-## Opening Existing Apps
-
-Ionic Studio supports Ionic Angular 4+ apps. To open an existing app, click "Browse Files" and choose the directory where your app is located.
diff --git a/docs/studio/support.md b/docs/studio/support.md
deleted file mode 100644
index 591c5983d5a..00000000000
--- a/docs/studio/support.md
+++ /dev/null
@@ -1,15 +0,0 @@
-# Support
-
-Support is available within Ionic Studio by clicking **Help & Support** from the account menu, which is opened by clicking the user icon at the top right of Ionic Studio.
-
-If you cannot open Ionic Studio, please open a [support request](https://ionicframework.com/support/request).
-
-
-
-
-
-- Please use the **Bugs or Feedback** option for anything related to Ionic Studio as a _product_, such as bugs, feature requests, and general feedback.
-- The **Explore the Docs** option links to these docs for Ionic Studio.
-- Please use the **Account and Billing** option for anything related to your Ionic account, such as billing. This option opens a [support request](https://ionicframework.com/support/request) for Ionic Customer Support.
-
-If your support inquiry relates to Ionic app development in general, we encourage you to join the vibrant Ionic community in the [Ionic Forum](https://forum.ionicframework.com/). More community help options are available on our [Support page](https://ionicframework.com/support/).
diff --git a/docs/studio/terminal.md b/docs/studio/terminal.md
deleted file mode 100644
index 83556ffdde2..00000000000
--- a/docs/studio/terminal.md
+++ /dev/null
@@ -1,36 +0,0 @@
-# Terminal
-
-Ionic Studio has an integrated terminal for running commands within an Ionic app.
-
-## Introduction
-
-:::note
-If you're new to the command line, you can check out [our blog post](https://ionicframework.com/blog/new-to-the-command-line/) on the basics.
-:::
-
-The integrated terminal is a convenient way to perform a quick command line task without navigating folder structures or switching windows. The terminal defaults to the app directory.
-
-Examples of what you can do with the integrated terminal:
-
-- Ionic CLI commands
-- Git operations
-- File operations
-- etc.
-
-## Using the Terminal
-
-To open the terminal, use Ctrl+\`, or click the plus sign in the terminal bar:
-
-
-
-
-
-The integrated terminal uses your own configured shell. Configure this on macOS by setting the `SHELL` environment variable.
-
-:::note
-For Windows, `powershell.exe` is used, and this is not yet configurable.
-:::
-
-
-
-
diff --git a/docs/studio/theming.md b/docs/studio/theming.md
deleted file mode 100644
index adc47a29e9c..00000000000
--- a/docs/studio/theming.md
+++ /dev/null
@@ -1,15 +0,0 @@
-# Theming
-
-Manage app themes to tweak look and feel.
-
-The Ionic Framework docs have [great documentation](../theming/basics.md) on theming Ionic apps.
-
-## Theme Colors
-
-The color generator within Ionic Studio automatically generates the CSS variables for the color, as well as the associated contrast, shade, and tint colors.
-
-
-
-
-
-The changes are available for previewing in your own app in the [Designer](designer.md) canvas.
diff --git a/versioned_docs/version-v5/studio.md b/versioned_docs/version-v5/studio.md
deleted file mode 100644
index 10227880b2f..00000000000
--- a/versioned_docs/version-v5/studio.md
+++ /dev/null
@@ -1,31 +0,0 @@
----
-hide_table_of_contents: true
----
-
-import DocsCard from '@components/global/DocsCard';
-import DocsCards from '@components/global/DocsCards';
-
-# Welcome to Studio
-
-Ionic Studio is a fast and easy app builder that helps teams build and prototype apps with minimal coding.
-
-Studio is designed to integrate into an existing developer workflow, rather than replace it, enabling developers and architects to build visually _or_ drop down to code using their favorite tools.
-
-Studio
-fully supports bringing code back into the tool, something virtually unheard of in the app development tools market.
-
-Studio is a desktop tool and requires a subscription, and is only for Ionic Angular 4.x+ projects. To get started, sign up below:
-
-
-
-
Sign up for Studio and start building today.
-
-
-
-
Delivered within Studio as well as over email.
-
-
-
-
Find answers to common questions about Ionic Studio.
-
-
diff --git a/versioned_docs/version-v5/studio/assets.md b/versioned_docs/version-v5/studio/assets.md
deleted file mode 100644
index 20a68326ab6..00000000000
--- a/versioned_docs/version-v5/studio/assets.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Asset Management
-
-The **Assets** section is a quick and easy way to add images or other media to Ionic apps.
-
-
-
-
-
-The files listed are all contained in the `src/assets` directory, which makes them available in the Ionic app.
-
-## Assets Window
-
-When an element is selected inside of Compose mode that takes `src` as an attribute (such as an `img` tag), the "Choose" button will open the assets window and an asset can be selected for the element attribute.
-
-
-
-
diff --git a/versioned_docs/version-v5/studio/code.md b/versioned_docs/version-v5/studio/code.md
deleted file mode 100644
index 7196a738e52..00000000000
--- a/versioned_docs/version-v5/studio/code.md
+++ /dev/null
@@ -1,40 +0,0 @@
-# Working with Code
-
-Ionic Studio works alongside your code editor of choice to enable more complex development workflows
-that go beyond Studio's UI development features.
-
-## Launching your Editor
-
-To launch your Studio app project in your editor of choice, navigate to the Designer index and click "Open in editor." Alternatively,
-the Project -> Open in Editor menu bar item may be used.
-
-
-
-
-
-## Configuring your Editor
-
-Studio detects a number of popular code editors, such as Visual Studio Code, Sublime Text, and more.
-
-If Studio is not able to detect your editor, ensure that one is installed and configured in the default manner.
-
-Studio will automatically detect one of
-
-- Sublime Text
-- Atom
-- Visual Studio Code
-- WebStorm
-- TextMate
-- Vim
-- NeoVim
-- IntelliJ
-- GNU nano
-- GNU Emacs
-
-## Opening in another editor
-
-If Studio does not automatically detect your editor or your editor is not on the list of supported editors,
-the app project can always be opened directly.
-
-To find the project path, use the Project -> Open in Finder (or Explorer) option to navigate to the project
-directory on disk and navigate to that path in your editor's project open dialog.
diff --git a/versioned_docs/version-v5/studio/designer.md b/versioned_docs/version-v5/studio/designer.md
deleted file mode 100644
index f026bd5e459..00000000000
--- a/versioned_docs/version-v5/studio/designer.md
+++ /dev/null
@@ -1,179 +0,0 @@
-# Designer Overview
-
-The Designer is the powerhouse of Studio, offering a drag-and-drop page builder for pages and components, with a code-behind editor for the template, styles, and scripts (TypeScript)
-
-## Introduction
-
-With the Designer, developers can:
-
-- Drag and drop to build pages and components
-- Select from the entire library of Ionic elements for drag-and-drop _and_ code editing.
-- Switch between visual and code editing for pages and components
-- View and work with most supported Ionic element properties, saving a trip checking the Documentation
-
-
-
-
-
-## Pages and Components
-
-In the Designer, pages and components work directly off of the files powering them (TypeScript, HTML, CSS).
-
-When first loaded, the Designer index is shown. This index lsits the pages and custom components that Studio detected in the app. Components detected can be seen by switching to the components tab.
-
-Studio finds pages and components by scanning your project looking for Component source files, so works on a variety of project file layouts.
-
-
-
- Since the difference between pages and components is conceptual, Ionic Studio relies on convention to differentiate
- them. If there are pages missing, make sure each page follows the convention Ionic Studio is expecting:
-
-
- The files that represent each page must have the proper suffixes (e.g. .page.ts,{' '}
- .page.html, .page.scss). See the{' '}
- Angular style guide for additional information about naming
- conventions.
-
-
-
-
-
-
-
-Switching to the component section on the Designer index reveals all the components found in the app.
-
-
-
-
-
-See [Adding Pages and Components](#adding-pages-and-components) to create new pages and components.
-
-## Adding Pages and Components
-
-To add pages or components to an app, click the **New** button in the top right of the page index.
-
-
-
-
-
-When adding a component (rather than a page), Studio will prompt for the name and a page in which to register it.
-
-
-
-
-
-This adds the component as a _import_ in the NgModule of the selected page, which allows it to be used in that page.
-
-
- The same code changes are necessary to use the component in other pages. See [this
- FAQ](faq.md#using-a-custom-component-in-additional-pages) for details.
-
-
-## Drag & Drop
-
-The Designer offers a drag & drop canvas for quickly adding new elements and rearranging existing elements.
-
-### Selecting Elements
-
-To select an element, click on it in the canvas. To select a child element, double click on its parent. Continue to double click to select deeper child elements and to edit text.
-
-To enable fine-selection, which selects the deepest child under the mouse cursor, hold down the Ctrl key (or Command for macOS) and hover over an element.
-
-To exit the current selection, use the Esc key.
-
-To select any element under the cursor, right click and choose an element from the `Select Element` dropdown:
-
-
-
-
-
-To select any element in the current document, access the element tree and click on the element to select:
-
-
-
-
-
-### Adding New Elements
-
-To add new elements to a page or component, drag and drop a new element from the Elements list, or use right click and "Quick Add" to
-add context-specific elements easily.
-
-
-
-
-
-Elements may also be dragged into the HTML for a page or component, and will result in a new code snippet being inserted at the cursor position.
-
-### Quick Adding New Elements
-
-Certain elements support quickly adding child elements by right-clicking and selecting an element in the `Quick Add` menu. Some components that support quickly adding new elements include List, List Item, Grid, Segment Button, and more.
-
-
-
-
-
-### Rearranging Existing Elements
-
-To rearrange existing elements in the canvas, click and hold on it, then drag it into place.
-
-Remember, it is also possible to drag and drop code selections in the code editor.
-
-## Properties Panel
-
-When an element is selected in the Designer canvas, the properties panel will update to reflect the selected element.
-
-
-
-
-
-In the properties panel, the properties that can be modified are listed.
-
-For Ionic components, the properties panel contains a link to the component's documentation at the bottom.
-
-
- Unfortunately, the properties panel does not show properties for custom components in your app, but this is a feature
- we'll be adding!
-
-
-## Editor View
-
-The HTML, CSS, and JS (TypeScript) for a page or company can be edited by switching to the Editor View:
-
-
-
-
-
-## Template Editing
-
-Each page or component has an HTML template that makes up its structure. Template editing makes it easy to make quick edits to the template, such as changing text or dragging in new element code snippets from the Elements list.
-
-
-
-
-
-## Styles Editing
-
-The Styles editor contains the CSS (Sass) for that page or component.
-
-Any changes to the styles are reflected in the canvas when saved. The styles in this mode are only applicable to the current page or component.
-
-
-
-
-
-## Scripts Editing
-
-The **Scripts** editor is for making changes to the controller, or logic, behind a page or component. This editor is used for making
-quick changes to logic for the page or component. For more complicated changes we recommend opening the project in a full-fledged code editor.
-
-
-
-
-
-## Troubleshooting the Canvas
-
-If the canvas gets into an inconsistent or incorrect state, click the reload icon from the canvas utility bar to cause the canvas to reload its current contents:
-
-
-
-
diff --git a/versioned_docs/version-v5/studio/faq.md b/versioned_docs/version-v5/studio/faq.md
deleted file mode 100644
index 49a116ceabd..00000000000
--- a/versioned_docs/version-v5/studio/faq.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# Frequently Asked Questions
-
-## Which versions of Ionic Framework are supported?
-
-Ionic Studio currently supports apps using **Ionic 4** and **Angular**.
-
-Ionic 3 is not supported. We encourage you to [migrate to Ionic 4](https://ionicframework.com/docs/reference/migration).
-
-## Is Capacitor supported?
-
-Ionic Studio currently does not support Capacitor. We plan to add support soon now that Capacitor has reached 1.0.
-
-## Can I use a component in multiple pages?
-
-Yes. In order to preserve speed, Angular only loads the components that it needs for any given page. This means that in order to use a custom component inside of a page, you must first make sure that components module is imported into your pages module.
-
-Open up the page you'd like to use a component in, then navigate to the module tab. Take note of the `import` line as well as the `import` in `ngModule`. Both things are required in order to load your component on a page.
-
-In this example, our component is called "MyCustomThing":
-
-
-
-
diff --git a/versioned_docs/version-v5/studio/guides/routing-and-navigation.md b/versioned_docs/version-v5/studio/guides/routing-and-navigation.md
deleted file mode 100644
index ac666208502..00000000000
--- a/versioned_docs/version-v5/studio/guides/routing-and-navigation.md
+++ /dev/null
@@ -1,29 +0,0 @@
-# Routing and Navigation
-
-A key part of developing Ionic apps is setting up routing and ensuring fluid navigation between pages.
-
-The Ionic Framework docs have a [great primer](../../angular/navigation.md) on Angular routing and navigation.
-
-## Quick Tips
-
-The following tips assume you already know the basics about Angular routing.
-
-### Adding a New Page
-
-When you add a new Page in Ionic Studio, it is automatically added to the routing configuration inside of `app-routing.module.ts`.
-
-
-
-
-
-If you'd like to change where this page is "located", you might want to move the Route into a different routing or module file.
-
-### Using a Page in Multiple Places
-
-You can use the same page in multiple places by ensuring that a route exists for it from those locations. For instance, if you'd like the "Detail" Page to be accessible inside of Tab1 of your application as well as Tab2, you'd want a `/detail` declaration in the router for both Tab1 and Tab2.
-
-### Using RouterLink
-
-You should be using the `[routerLink]="['/tabs','tab1']"` style of navigation when trying to make a button or list-item (or other component) link to a different page.
-
-If this throws an error, you need to ensure that RouterModule is included in your pages module.
diff --git a/versioned_docs/version-v5/studio/guides/using-native-functionality.md b/versioned_docs/version-v5/studio/guides/using-native-functionality.md
deleted file mode 100644
index 41e0f4089e6..00000000000
--- a/versioned_docs/version-v5/studio/guides/using-native-functionality.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Using Native Functionality
-
-Depending on which Cordova Plugin you're using, you may need to run your app on a physical or virtual device in order to test out that feature.
-
-For instance, a plugin for utilizing the Gyroscope will only work on a physical device, while a plugin for Storage will work in Serve as well.
-
-In order to debug Native Functionality, it is best to utilize the native tooling. For instance, you might want to use the following in order to test:
-
-1. In Studio's main toolbar, click on **Project** » **Build** » **Build iOS** (or Android)
-1. Click on **Project** » **Open in XCode** (or Android Studio)
-1. Use XCode or Android Studio to run your project on your physical device.
-1. You now have access to native debugging logs inside of XCode or Android Studio.
-1. You can also use Safari (iOS) or Chrome (Android) in order to inspect the web content of your application.
-
-For more detailed instructions, please see the [Building for iOS](../../developing/ios.md) or [Building for Android](../../developing/android.md) documentation.
-
-If you'd like to follow along with a beginners tutorial that includes utilizing the Camera Cordova plugin, please see our [Build your First App guide](../../angular/your-first-app.md). While this guide isn't specific to Studio, you can still follow along using Studio.
diff --git a/versioned_docs/version-v5/studio/running.md b/versioned_docs/version-v5/studio/running.md
deleted file mode 100644
index 8636ae2f597..00000000000
--- a/versioned_docs/version-v5/studio/running.md
+++ /dev/null
@@ -1,66 +0,0 @@
-# Running Apps
-
-Ionic Studio offers support for serving, running, and deploying apps.
-
-Serving, running, and deploying each have pros and cons.
-
-- **Serving** is easy and requires no native project setup, but doesn't work with native functionality
-- **Running** apps can be complex and difficult to debug, but allows the app to be tested on a real device
-- **Installing** is the best way to make sure the app is ready for production, but doesn't work with livereload
-
-## Serving Apps
-
-When an app is served, Ionic Studio starts a Dev Server with [Live Reload](../reference/glossary.md#livereload) and displays the app in a separate browser window, called a _Serve Window_.
-
-To serve an app, click the Play button in the upper right-hand corner of Ionic Studio. Then choose _Serve_ from the dropdown.
-
-This will compile the app and then watch for changes in source files. When changes are made, the app will automatically be reloaded with the latest changes.
-
-### Serve Window
-
-After compilation, the app is opened inside a Serve Window.
-
-
-
-
-
-The Serve Window toolbar offers features such as changing the device viewport, switching between portrait and landscape orientation, reloading the webview, and opening the DevTools for debugging.
-
-When the device viewport changes, the Serve Window is resized and will be reloaded to reflect the appropriate device styles, whether iOS or Material Design.
-
-It is possible to open multiple Serve Windows by using the Play button and choosing _Serve_. This is useful for testing the look and feel on iOS and Android, testing the app on different viewports or orientations, all at the same time.
-
-#### Debugging
-
-Clicking the debug button will open a proper instance of the Chrome DevTools for the app. Right-clicking on app features will open a context menu with _Inspect Element_.
-
-For information on how to use the Chrome DevTools, see the [Chrome DevTools documentation](https://developers.google.com/web/tools/chrome-devtools/).
-
-
-
-
-
-## Running Apps
-
-
- Since running an app will install it on an actual native device, some additional setup is required. See the [Native
- iOS & Android](setup/native.md) documentation for setup guides.
-
-
-To run an app, click the Play button in the upper right-hand corner of Ionic Studio. Then choose _Run_ from the dropdown.
-
-
-
-
-
-Choose a platform and a target device, which can be an emulator or hardware device plugged in to your computer.
-
-With the Live Reload option, Ionic Studio will use the same Dev Server as in _Serve_, which enables quick development while working with actual devices.
-
-To debug running apps, see the docs for debugging [iOS Apps](../developing/ios.md#debugging-ios-apps) and [Android Apps](../developing/android.md#debugging-android-apps).
-
-## Installing Apps
-
-To install a standalone version of an app, use _Run_ and then switch off the _Live Reload_ option.
-
-This will copy app assets onto the target device or emulator, instead of using a Dev Server, which allows the app to continue working when the device is disconnected from the computer.
diff --git a/versioned_docs/version-v5/studio/settings.md b/versioned_docs/version-v5/studio/settings.md
deleted file mode 100644
index 3adc2e9bd06..00000000000
--- a/versioned_docs/version-v5/studio/settings.md
+++ /dev/null
@@ -1,68 +0,0 @@
-# Settings
-
-Manage app configuration and settings.
-
-## Config
-
-The **Config** section is for managing the common settings in `config.xml` such as the name and version of the app, as well as the Bundle ID (aka [Package ID](../reference/glossary.md#package-id)).
-
-
-
-
-
-## Platforms
-
-The **Platforms** section is for managing Cordova platforms. Use the appropriate buttons to add, remove, and update platforms.
-
-
-
-
-
-## Plugins
-
-The **Plugins** section is for managing Cordova plugins. Use the appropriate buttons to add, remove, and update plugins.
-
-
-
-
-
-### Installing Plugins
-
-To install a Cordova plugin, click the **Add** button. The install modal will open, then click **Install** to confirm. If a plugin requires variables, the modal will prompt for them.
-
-The plugins available for install comprise all [Ionic Native](../native.md) plugins. When a plugin is installed, both the Cordova plugin and the Ionic Native wrapper are installed automatically.
-
-
-
- It is not yet possible in Ionic Studio to install Cordova plugins other than those in Ionic Native. This feature is
- coming soon!
-
-
- You can always install the Cordova plugin in the command line by using Project »{' '}
- Open in Terminal and following the installation docs for the Cordova plugin.
-
-
-
-
- Some plugins may require variables that Ionic Studio isn't aware of. In this case, the install will fail. Try
- installing the plugin again with the necessary variables and let us know by [reporting the bug](support.md).
-
-
-## Icon & Splash Screen
-
-The **Icon & Splash Screen** section is for managing app resources. When changing icons and splash screens within Ionic Studio, the appropriate sizes required for the vast collection of device sizes and types will be generated automatically.
-
-Ionic Studio uses the Ionic CLI command ionic cordova resources to generate app resources. More information about icons and splash screens can be found in [the CLI docs](../cli/commands/cordova-resources.md).
-
-
-
-
-
-## Linking to Appflow
-
-If your account has access to [Appflow](https://ionic.io/appflow) and you'd like to use it for this app, you can quickly link it with your Appflow account
-in this section of the settings area:
-
-
-
-
diff --git a/versioned_docs/version-v5/studio/setup/installation.md b/versioned_docs/version-v5/studio/setup/installation.md
deleted file mode 100644
index 65b99714ed9..00000000000
--- a/versioned_docs/version-v5/studio/setup/installation.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Installing Studio
-
-The latest downloads for Ionic Studio are available in the [Ionic Dashboard](https://dashboard.ionicframework.com/personal/downloads).
-
-## Prerequisites
-
-- macOS or Windows 10
-- Make sure you have the latest LTS release of [Node & npm](../../intro/environment.md#node-npm) set up on your computer
-- Optionally install [Git](../../intro/environment.md#git) for version control
-
-## Installation
-
-The Ionic Studio download link can be obtained in the [downloads section](https://dashboard.ionicframework.com/personal/downloads) of the Ionic Dashboard.
-
-Once Ionic Studio has been downloaded, run through the installer and open Ionic Studio to continue the installation process. Ionic Studio has a few tools it depends on, which are installed and updated automatically when it boots up.
-
-Ionic Studio will automatically update itself when new versions are released, but can be reinstalled by using the download link found above.
diff --git a/versioned_docs/version-v5/studio/setup/native.md b/versioned_docs/version-v5/studio/setup/native.md
deleted file mode 100644
index 392c8137d73..00000000000
--- a/versioned_docs/version-v5/studio/setup/native.md
+++ /dev/null
@@ -1,13 +0,0 @@
-# Native iOS & Android
-
-Utilizing native functionality in your app may require additional setup, including:
-
-- Using Cordova Plugins to access Hardware APIs
-- Running the app on hardware or virtual devices
-- Building app binaries
-- Publishing to the App Store or Google Play Store
-
-Follow our native platform setup guides to prepare your environment:
-
-- [iOS Setup](../../developing/ios.md) (macOS only)
-- [Android Setup](../../developing/android.md)
diff --git a/versioned_docs/version-v5/studio/start.md b/versioned_docs/version-v5/studio/start.md
deleted file mode 100644
index ea562de7458..00000000000
--- a/versioned_docs/version-v5/studio/start.md
+++ /dev/null
@@ -1,13 +0,0 @@
-# Getting Started
-
-To create a new Ionic Studio app:
-
-1. Open the New Project modal with **File** » **New Project**. 
-2. Supply a name for your app. This can be changed later.
-3. Optionally supply a Bundle ID (aka [Package ID](../reference/glossary.md#package-id)), which is used to identify your app when published. It's okay to leave this blank for now.
-4. Choose the template you'd like to start with. For a demo of Studio on a real app, choose the sample option (note this is intended only as a demo)
-5. Click **Create App**.
-
-## Opening Existing Apps
-
-Ionic Studio supports Ionic Angular 4+ apps. To open an existing app, click "Browse Files" and choose the directory where your app is located.
diff --git a/versioned_docs/version-v5/studio/support.md b/versioned_docs/version-v5/studio/support.md
deleted file mode 100644
index 591c5983d5a..00000000000
--- a/versioned_docs/version-v5/studio/support.md
+++ /dev/null
@@ -1,15 +0,0 @@
-# Support
-
-Support is available within Ionic Studio by clicking **Help & Support** from the account menu, which is opened by clicking the user icon at the top right of Ionic Studio.
-
-If you cannot open Ionic Studio, please open a [support request](https://ionicframework.com/support/request).
-
-
-
-
-
-- Please use the **Bugs or Feedback** option for anything related to Ionic Studio as a _product_, such as bugs, feature requests, and general feedback.
-- The **Explore the Docs** option links to these docs for Ionic Studio.
-- Please use the **Account and Billing** option for anything related to your Ionic account, such as billing. This option opens a [support request](https://ionicframework.com/support/request) for Ionic Customer Support.
-
-If your support inquiry relates to Ionic app development in general, we encourage you to join the vibrant Ionic community in the [Ionic Forum](https://forum.ionicframework.com/). More community help options are available on our [Support page](https://ionicframework.com/support/).
diff --git a/versioned_docs/version-v5/studio/terminal.md b/versioned_docs/version-v5/studio/terminal.md
deleted file mode 100644
index 83556ffdde2..00000000000
--- a/versioned_docs/version-v5/studio/terminal.md
+++ /dev/null
@@ -1,36 +0,0 @@
-# Terminal
-
-Ionic Studio has an integrated terminal for running commands within an Ionic app.
-
-## Introduction
-
-:::note
-If you're new to the command line, you can check out [our blog post](https://ionicframework.com/blog/new-to-the-command-line/) on the basics.
-:::
-
-The integrated terminal is a convenient way to perform a quick command line task without navigating folder structures or switching windows. The terminal defaults to the app directory.
-
-Examples of what you can do with the integrated terminal:
-
-- Ionic CLI commands
-- Git operations
-- File operations
-- etc.
-
-## Using the Terminal
-
-To open the terminal, use Ctrl+\`, or click the plus sign in the terminal bar:
-
-
-
-
-
-The integrated terminal uses your own configured shell. Configure this on macOS by setting the `SHELL` environment variable.
-
-:::note
-For Windows, `powershell.exe` is used, and this is not yet configurable.
-:::
-
-
-
-
diff --git a/versioned_docs/version-v5/studio/theming.md b/versioned_docs/version-v5/studio/theming.md
deleted file mode 100644
index adc47a29e9c..00000000000
--- a/versioned_docs/version-v5/studio/theming.md
+++ /dev/null
@@ -1,15 +0,0 @@
-# Theming
-
-Manage app themes to tweak look and feel.
-
-The Ionic Framework docs have [great documentation](../theming/basics.md) on theming Ionic apps.
-
-## Theme Colors
-
-The color generator within Ionic Studio automatically generates the CSS variables for the color, as well as the associated contrast, shade, and tint colors.
-
-
-
-
-
-The changes are available for previewing in your own app in the [Designer](designer.md) canvas.
diff --git a/versioned_docs/version-v6/studio.md b/versioned_docs/version-v6/studio.md
deleted file mode 100644
index 10227880b2f..00000000000
--- a/versioned_docs/version-v6/studio.md
+++ /dev/null
@@ -1,31 +0,0 @@
----
-hide_table_of_contents: true
----
-
-import DocsCard from '@components/global/DocsCard';
-import DocsCards from '@components/global/DocsCards';
-
-# Welcome to Studio
-
-Ionic Studio is a fast and easy app builder that helps teams build and prototype apps with minimal coding.
-
-Studio is designed to integrate into an existing developer workflow, rather than replace it, enabling developers and architects to build visually _or_ drop down to code using their favorite tools.
-
-Studio
-fully supports bringing code back into the tool, something virtually unheard of in the app development tools market.
-
-Studio is a desktop tool and requires a subscription, and is only for Ionic Angular 4.x+ projects. To get started, sign up below:
-
-
-
-
Sign up for Studio and start building today.
-
-
-
-
Delivered within Studio as well as over email.
-
-
-
-
Find answers to common questions about Ionic Studio.
-
-
diff --git a/versioned_docs/version-v6/studio/assets.md b/versioned_docs/version-v6/studio/assets.md
deleted file mode 100644
index 20a68326ab6..00000000000
--- a/versioned_docs/version-v6/studio/assets.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Asset Management
-
-The **Assets** section is a quick and easy way to add images or other media to Ionic apps.
-
-
-
-
-
-The files listed are all contained in the `src/assets` directory, which makes them available in the Ionic app.
-
-## Assets Window
-
-When an element is selected inside of Compose mode that takes `src` as an attribute (such as an `img` tag), the "Choose" button will open the assets window and an asset can be selected for the element attribute.
-
-
-
-
diff --git a/versioned_docs/version-v6/studio/code.md b/versioned_docs/version-v6/studio/code.md
deleted file mode 100644
index 7196a738e52..00000000000
--- a/versioned_docs/version-v6/studio/code.md
+++ /dev/null
@@ -1,40 +0,0 @@
-# Working with Code
-
-Ionic Studio works alongside your code editor of choice to enable more complex development workflows
-that go beyond Studio's UI development features.
-
-## Launching your Editor
-
-To launch your Studio app project in your editor of choice, navigate to the Designer index and click "Open in editor." Alternatively,
-the Project -> Open in Editor menu bar item may be used.
-
-
-
-
-
-## Configuring your Editor
-
-Studio detects a number of popular code editors, such as Visual Studio Code, Sublime Text, and more.
-
-If Studio is not able to detect your editor, ensure that one is installed and configured in the default manner.
-
-Studio will automatically detect one of
-
-- Sublime Text
-- Atom
-- Visual Studio Code
-- WebStorm
-- TextMate
-- Vim
-- NeoVim
-- IntelliJ
-- GNU nano
-- GNU Emacs
-
-## Opening in another editor
-
-If Studio does not automatically detect your editor or your editor is not on the list of supported editors,
-the app project can always be opened directly.
-
-To find the project path, use the Project -> Open in Finder (or Explorer) option to navigate to the project
-directory on disk and navigate to that path in your editor's project open dialog.
diff --git a/versioned_docs/version-v6/studio/designer.md b/versioned_docs/version-v6/studio/designer.md
deleted file mode 100644
index f026bd5e459..00000000000
--- a/versioned_docs/version-v6/studio/designer.md
+++ /dev/null
@@ -1,179 +0,0 @@
-# Designer Overview
-
-The Designer is the powerhouse of Studio, offering a drag-and-drop page builder for pages and components, with a code-behind editor for the template, styles, and scripts (TypeScript)
-
-## Introduction
-
-With the Designer, developers can:
-
-- Drag and drop to build pages and components
-- Select from the entire library of Ionic elements for drag-and-drop _and_ code editing.
-- Switch between visual and code editing for pages and components
-- View and work with most supported Ionic element properties, saving a trip checking the Documentation
-
-
-
-
-
-## Pages and Components
-
-In the Designer, pages and components work directly off of the files powering them (TypeScript, HTML, CSS).
-
-When first loaded, the Designer index is shown. This index lsits the pages and custom components that Studio detected in the app. Components detected can be seen by switching to the components tab.
-
-Studio finds pages and components by scanning your project looking for Component source files, so works on a variety of project file layouts.
-
-
-
- Since the difference between pages and components is conceptual, Ionic Studio relies on convention to differentiate
- them. If there are pages missing, make sure each page follows the convention Ionic Studio is expecting:
-
-
- The files that represent each page must have the proper suffixes (e.g. .page.ts,{' '}
- .page.html, .page.scss). See the{' '}
- Angular style guide for additional information about naming
- conventions.
-
-
-
-
-
-
-
-Switching to the component section on the Designer index reveals all the components found in the app.
-
-
-
-
-
-See [Adding Pages and Components](#adding-pages-and-components) to create new pages and components.
-
-## Adding Pages and Components
-
-To add pages or components to an app, click the **New** button in the top right of the page index.
-
-
-
-
-
-When adding a component (rather than a page), Studio will prompt for the name and a page in which to register it.
-
-
-
-
-
-This adds the component as a _import_ in the NgModule of the selected page, which allows it to be used in that page.
-
-
- The same code changes are necessary to use the component in other pages. See [this
- FAQ](faq.md#using-a-custom-component-in-additional-pages) for details.
-
-
-## Drag & Drop
-
-The Designer offers a drag & drop canvas for quickly adding new elements and rearranging existing elements.
-
-### Selecting Elements
-
-To select an element, click on it in the canvas. To select a child element, double click on its parent. Continue to double click to select deeper child elements and to edit text.
-
-To enable fine-selection, which selects the deepest child under the mouse cursor, hold down the Ctrl key (or Command for macOS) and hover over an element.
-
-To exit the current selection, use the Esc key.
-
-To select any element under the cursor, right click and choose an element from the `Select Element` dropdown:
-
-
-
-
-
-To select any element in the current document, access the element tree and click on the element to select:
-
-
-
-
-
-### Adding New Elements
-
-To add new elements to a page or component, drag and drop a new element from the Elements list, or use right click and "Quick Add" to
-add context-specific elements easily.
-
-
-
-
-
-Elements may also be dragged into the HTML for a page or component, and will result in a new code snippet being inserted at the cursor position.
-
-### Quick Adding New Elements
-
-Certain elements support quickly adding child elements by right-clicking and selecting an element in the `Quick Add` menu. Some components that support quickly adding new elements include List, List Item, Grid, Segment Button, and more.
-
-
-
-
-
-### Rearranging Existing Elements
-
-To rearrange existing elements in the canvas, click and hold on it, then drag it into place.
-
-Remember, it is also possible to drag and drop code selections in the code editor.
-
-## Properties Panel
-
-When an element is selected in the Designer canvas, the properties panel will update to reflect the selected element.
-
-
-
-
-
-In the properties panel, the properties that can be modified are listed.
-
-For Ionic components, the properties panel contains a link to the component's documentation at the bottom.
-
-
- Unfortunately, the properties panel does not show properties for custom components in your app, but this is a feature
- we'll be adding!
-
-
-## Editor View
-
-The HTML, CSS, and JS (TypeScript) for a page or company can be edited by switching to the Editor View:
-
-
-
-
-
-## Template Editing
-
-Each page or component has an HTML template that makes up its structure. Template editing makes it easy to make quick edits to the template, such as changing text or dragging in new element code snippets from the Elements list.
-
-
-
-
-
-## Styles Editing
-
-The Styles editor contains the CSS (Sass) for that page or component.
-
-Any changes to the styles are reflected in the canvas when saved. The styles in this mode are only applicable to the current page or component.
-
-
-
-
-
-## Scripts Editing
-
-The **Scripts** editor is for making changes to the controller, or logic, behind a page or component. This editor is used for making
-quick changes to logic for the page or component. For more complicated changes we recommend opening the project in a full-fledged code editor.
-
-
-
-
-
-## Troubleshooting the Canvas
-
-If the canvas gets into an inconsistent or incorrect state, click the reload icon from the canvas utility bar to cause the canvas to reload its current contents:
-
-
-
-
diff --git a/versioned_docs/version-v6/studio/faq.md b/versioned_docs/version-v6/studio/faq.md
deleted file mode 100644
index 49a116ceabd..00000000000
--- a/versioned_docs/version-v6/studio/faq.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# Frequently Asked Questions
-
-## Which versions of Ionic Framework are supported?
-
-Ionic Studio currently supports apps using **Ionic 4** and **Angular**.
-
-Ionic 3 is not supported. We encourage you to [migrate to Ionic 4](https://ionicframework.com/docs/reference/migration).
-
-## Is Capacitor supported?
-
-Ionic Studio currently does not support Capacitor. We plan to add support soon now that Capacitor has reached 1.0.
-
-## Can I use a component in multiple pages?
-
-Yes. In order to preserve speed, Angular only loads the components that it needs for any given page. This means that in order to use a custom component inside of a page, you must first make sure that components module is imported into your pages module.
-
-Open up the page you'd like to use a component in, then navigate to the module tab. Take note of the `import` line as well as the `import` in `ngModule`. Both things are required in order to load your component on a page.
-
-In this example, our component is called "MyCustomThing":
-
-
-
-
diff --git a/versioned_docs/version-v6/studio/guides/routing-and-navigation.md b/versioned_docs/version-v6/studio/guides/routing-and-navigation.md
deleted file mode 100644
index ac666208502..00000000000
--- a/versioned_docs/version-v6/studio/guides/routing-and-navigation.md
+++ /dev/null
@@ -1,29 +0,0 @@
-# Routing and Navigation
-
-A key part of developing Ionic apps is setting up routing and ensuring fluid navigation between pages.
-
-The Ionic Framework docs have a [great primer](../../angular/navigation.md) on Angular routing and navigation.
-
-## Quick Tips
-
-The following tips assume you already know the basics about Angular routing.
-
-### Adding a New Page
-
-When you add a new Page in Ionic Studio, it is automatically added to the routing configuration inside of `app-routing.module.ts`.
-
-
-
-
-
-If you'd like to change where this page is "located", you might want to move the Route into a different routing or module file.
-
-### Using a Page in Multiple Places
-
-You can use the same page in multiple places by ensuring that a route exists for it from those locations. For instance, if you'd like the "Detail" Page to be accessible inside of Tab1 of your application as well as Tab2, you'd want a `/detail` declaration in the router for both Tab1 and Tab2.
-
-### Using RouterLink
-
-You should be using the `[routerLink]="['/tabs','tab1']"` style of navigation when trying to make a button or list-item (or other component) link to a different page.
-
-If this throws an error, you need to ensure that RouterModule is included in your pages module.
diff --git a/versioned_docs/version-v6/studio/guides/using-native-functionality.md b/versioned_docs/version-v6/studio/guides/using-native-functionality.md
deleted file mode 100644
index 41e0f4089e6..00000000000
--- a/versioned_docs/version-v6/studio/guides/using-native-functionality.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Using Native Functionality
-
-Depending on which Cordova Plugin you're using, you may need to run your app on a physical or virtual device in order to test out that feature.
-
-For instance, a plugin for utilizing the Gyroscope will only work on a physical device, while a plugin for Storage will work in Serve as well.
-
-In order to debug Native Functionality, it is best to utilize the native tooling. For instance, you might want to use the following in order to test:
-
-1. In Studio's main toolbar, click on **Project** » **Build** » **Build iOS** (or Android)
-1. Click on **Project** » **Open in XCode** (or Android Studio)
-1. Use XCode or Android Studio to run your project on your physical device.
-1. You now have access to native debugging logs inside of XCode or Android Studio.
-1. You can also use Safari (iOS) or Chrome (Android) in order to inspect the web content of your application.
-
-For more detailed instructions, please see the [Building for iOS](../../developing/ios.md) or [Building for Android](../../developing/android.md) documentation.
-
-If you'd like to follow along with a beginners tutorial that includes utilizing the Camera Cordova plugin, please see our [Build your First App guide](../../angular/your-first-app.md). While this guide isn't specific to Studio, you can still follow along using Studio.
diff --git a/versioned_docs/version-v6/studio/running.md b/versioned_docs/version-v6/studio/running.md
deleted file mode 100644
index 8636ae2f597..00000000000
--- a/versioned_docs/version-v6/studio/running.md
+++ /dev/null
@@ -1,66 +0,0 @@
-# Running Apps
-
-Ionic Studio offers support for serving, running, and deploying apps.
-
-Serving, running, and deploying each have pros and cons.
-
-- **Serving** is easy and requires no native project setup, but doesn't work with native functionality
-- **Running** apps can be complex and difficult to debug, but allows the app to be tested on a real device
-- **Installing** is the best way to make sure the app is ready for production, but doesn't work with livereload
-
-## Serving Apps
-
-When an app is served, Ionic Studio starts a Dev Server with [Live Reload](../reference/glossary.md#livereload) and displays the app in a separate browser window, called a _Serve Window_.
-
-To serve an app, click the Play button in the upper right-hand corner of Ionic Studio. Then choose _Serve_ from the dropdown.
-
-This will compile the app and then watch for changes in source files. When changes are made, the app will automatically be reloaded with the latest changes.
-
-### Serve Window
-
-After compilation, the app is opened inside a Serve Window.
-
-
-
-
-
-The Serve Window toolbar offers features such as changing the device viewport, switching between portrait and landscape orientation, reloading the webview, and opening the DevTools for debugging.
-
-When the device viewport changes, the Serve Window is resized and will be reloaded to reflect the appropriate device styles, whether iOS or Material Design.
-
-It is possible to open multiple Serve Windows by using the Play button and choosing _Serve_. This is useful for testing the look and feel on iOS and Android, testing the app on different viewports or orientations, all at the same time.
-
-#### Debugging
-
-Clicking the debug button will open a proper instance of the Chrome DevTools for the app. Right-clicking on app features will open a context menu with _Inspect Element_.
-
-For information on how to use the Chrome DevTools, see the [Chrome DevTools documentation](https://developers.google.com/web/tools/chrome-devtools/).
-
-
-
-
-
-## Running Apps
-
-
- Since running an app will install it on an actual native device, some additional setup is required. See the [Native
- iOS & Android](setup/native.md) documentation for setup guides.
-
-
-To run an app, click the Play button in the upper right-hand corner of Ionic Studio. Then choose _Run_ from the dropdown.
-
-
-
-
-
-Choose a platform and a target device, which can be an emulator or hardware device plugged in to your computer.
-
-With the Live Reload option, Ionic Studio will use the same Dev Server as in _Serve_, which enables quick development while working with actual devices.
-
-To debug running apps, see the docs for debugging [iOS Apps](../developing/ios.md#debugging-ios-apps) and [Android Apps](../developing/android.md#debugging-android-apps).
-
-## Installing Apps
-
-To install a standalone version of an app, use _Run_ and then switch off the _Live Reload_ option.
-
-This will copy app assets onto the target device or emulator, instead of using a Dev Server, which allows the app to continue working when the device is disconnected from the computer.
diff --git a/versioned_docs/version-v6/studio/settings.md b/versioned_docs/version-v6/studio/settings.md
deleted file mode 100644
index 3adc2e9bd06..00000000000
--- a/versioned_docs/version-v6/studio/settings.md
+++ /dev/null
@@ -1,68 +0,0 @@
-# Settings
-
-Manage app configuration and settings.
-
-## Config
-
-The **Config** section is for managing the common settings in `config.xml` such as the name and version of the app, as well as the Bundle ID (aka [Package ID](../reference/glossary.md#package-id)).
-
-
-
-
-
-## Platforms
-
-The **Platforms** section is for managing Cordova platforms. Use the appropriate buttons to add, remove, and update platforms.
-
-
-
-
-
-## Plugins
-
-The **Plugins** section is for managing Cordova plugins. Use the appropriate buttons to add, remove, and update plugins.
-
-
-
-
-
-### Installing Plugins
-
-To install a Cordova plugin, click the **Add** button. The install modal will open, then click **Install** to confirm. If a plugin requires variables, the modal will prompt for them.
-
-The plugins available for install comprise all [Ionic Native](../native.md) plugins. When a plugin is installed, both the Cordova plugin and the Ionic Native wrapper are installed automatically.
-
-
-
- It is not yet possible in Ionic Studio to install Cordova plugins other than those in Ionic Native. This feature is
- coming soon!
-
-
- You can always install the Cordova plugin in the command line by using Project »{' '}
- Open in Terminal and following the installation docs for the Cordova plugin.
-
-
-
-
- Some plugins may require variables that Ionic Studio isn't aware of. In this case, the install will fail. Try
- installing the plugin again with the necessary variables and let us know by [reporting the bug](support.md).
-
-
-## Icon & Splash Screen
-
-The **Icon & Splash Screen** section is for managing app resources. When changing icons and splash screens within Ionic Studio, the appropriate sizes required for the vast collection of device sizes and types will be generated automatically.
-
-Ionic Studio uses the Ionic CLI command ionic cordova resources to generate app resources. More information about icons and splash screens can be found in [the CLI docs](../cli/commands/cordova-resources.md).
-
-
-
-
-
-## Linking to Appflow
-
-If your account has access to [Appflow](https://ionic.io/appflow) and you'd like to use it for this app, you can quickly link it with your Appflow account
-in this section of the settings area:
-
-
-
-
diff --git a/versioned_docs/version-v6/studio/setup/installation.md b/versioned_docs/version-v6/studio/setup/installation.md
deleted file mode 100644
index 65b99714ed9..00000000000
--- a/versioned_docs/version-v6/studio/setup/installation.md
+++ /dev/null
@@ -1,17 +0,0 @@
-# Installing Studio
-
-The latest downloads for Ionic Studio are available in the [Ionic Dashboard](https://dashboard.ionicframework.com/personal/downloads).
-
-## Prerequisites
-
-- macOS or Windows 10
-- Make sure you have the latest LTS release of [Node & npm](../../intro/environment.md#node-npm) set up on your computer
-- Optionally install [Git](../../intro/environment.md#git) for version control
-
-## Installation
-
-The Ionic Studio download link can be obtained in the [downloads section](https://dashboard.ionicframework.com/personal/downloads) of the Ionic Dashboard.
-
-Once Ionic Studio has been downloaded, run through the installer and open Ionic Studio to continue the installation process. Ionic Studio has a few tools it depends on, which are installed and updated automatically when it boots up.
-
-Ionic Studio will automatically update itself when new versions are released, but can be reinstalled by using the download link found above.
diff --git a/versioned_docs/version-v6/studio/setup/native.md b/versioned_docs/version-v6/studio/setup/native.md
deleted file mode 100644
index 392c8137d73..00000000000
--- a/versioned_docs/version-v6/studio/setup/native.md
+++ /dev/null
@@ -1,13 +0,0 @@
-# Native iOS & Android
-
-Utilizing native functionality in your app may require additional setup, including:
-
-- Using Cordova Plugins to access Hardware APIs
-- Running the app on hardware or virtual devices
-- Building app binaries
-- Publishing to the App Store or Google Play Store
-
-Follow our native platform setup guides to prepare your environment:
-
-- [iOS Setup](../../developing/ios.md) (macOS only)
-- [Android Setup](../../developing/android.md)
diff --git a/versioned_docs/version-v6/studio/start.md b/versioned_docs/version-v6/studio/start.md
deleted file mode 100644
index ea562de7458..00000000000
--- a/versioned_docs/version-v6/studio/start.md
+++ /dev/null
@@ -1,13 +0,0 @@
-# Getting Started
-
-To create a new Ionic Studio app:
-
-1. Open the New Project modal with **File** » **New Project**. 
-2. Supply a name for your app. This can be changed later.
-3. Optionally supply a Bundle ID (aka [Package ID](../reference/glossary.md#package-id)), which is used to identify your app when published. It's okay to leave this blank for now.
-4. Choose the template you'd like to start with. For a demo of Studio on a real app, choose the sample option (note this is intended only as a demo)
-5. Click **Create App**.
-
-## Opening Existing Apps
-
-Ionic Studio supports Ionic Angular 4+ apps. To open an existing app, click "Browse Files" and choose the directory where your app is located.
diff --git a/versioned_docs/version-v6/studio/support.md b/versioned_docs/version-v6/studio/support.md
deleted file mode 100644
index 591c5983d5a..00000000000
--- a/versioned_docs/version-v6/studio/support.md
+++ /dev/null
@@ -1,15 +0,0 @@
-# Support
-
-Support is available within Ionic Studio by clicking **Help & Support** from the account menu, which is opened by clicking the user icon at the top right of Ionic Studio.
-
-If you cannot open Ionic Studio, please open a [support request](https://ionicframework.com/support/request).
-
-
-
-
-
-- Please use the **Bugs or Feedback** option for anything related to Ionic Studio as a _product_, such as bugs, feature requests, and general feedback.
-- The **Explore the Docs** option links to these docs for Ionic Studio.
-- Please use the **Account and Billing** option for anything related to your Ionic account, such as billing. This option opens a [support request](https://ionicframework.com/support/request) for Ionic Customer Support.
-
-If your support inquiry relates to Ionic app development in general, we encourage you to join the vibrant Ionic community in the [Ionic Forum](https://forum.ionicframework.com/). More community help options are available on our [Support page](https://ionicframework.com/support/).
diff --git a/versioned_docs/version-v6/studio/terminal.md b/versioned_docs/version-v6/studio/terminal.md
deleted file mode 100644
index 83556ffdde2..00000000000
--- a/versioned_docs/version-v6/studio/terminal.md
+++ /dev/null
@@ -1,36 +0,0 @@
-# Terminal
-
-Ionic Studio has an integrated terminal for running commands within an Ionic app.
-
-## Introduction
-
-:::note
-If you're new to the command line, you can check out [our blog post](https://ionicframework.com/blog/new-to-the-command-line/) on the basics.
-:::
-
-The integrated terminal is a convenient way to perform a quick command line task without navigating folder structures or switching windows. The terminal defaults to the app directory.
-
-Examples of what you can do with the integrated terminal:
-
-- Ionic CLI commands
-- Git operations
-- File operations
-- etc.
-
-## Using the Terminal
-
-To open the terminal, use Ctrl+\`, or click the plus sign in the terminal bar:
-
-
-
-
-
-The integrated terminal uses your own configured shell. Configure this on macOS by setting the `SHELL` environment variable.
-
-:::note
-For Windows, `powershell.exe` is used, and this is not yet configurable.
-:::
-
-
-
-
diff --git a/versioned_docs/version-v6/studio/theming.md b/versioned_docs/version-v6/studio/theming.md
deleted file mode 100644
index adc47a29e9c..00000000000
--- a/versioned_docs/version-v6/studio/theming.md
+++ /dev/null
@@ -1,15 +0,0 @@
-# Theming
-
-Manage app themes to tweak look and feel.
-
-The Ionic Framework docs have [great documentation](../theming/basics.md) on theming Ionic apps.
-
-## Theme Colors
-
-The color generator within Ionic Studio automatically generates the CSS variables for the color, as well as the associated contrast, shade, and tint colors.
-
-
-
-
-
-The changes are available for previewing in your own app in the [Designer](designer.md) canvas.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-