docs(themes): Remove content that will be available in the Design System Docs

_contentTemplates/common/general-info.md

@@ -122,20 +122,14 @@ If you set the `ShouldRender` field of the event arguments to `true`, the compon
 | tb-wizard                  | [Wizard]({%slug wizard-overview%})       |
 #end
 
-#change-theme-runtime
-
-### Changing Themes Runtime
-
-The application can remove a loaded stylesheet from the page and register another one. See [how to change the theme or swatch at runtime]({%slug change-theme-runtime%}) with step-by-step instructions and an example.
-
-#end
 
 #status-telerik-com
 ## Telerik NuGet Feed Status
 
 Visit [status.telerik.com](https://status.telerik.com) to check the status of the Telerik NuGet server. The top section shows manually logged incidents with possible updates or workaround suggestions. The [**System Metrics** section](https://status.telerik.com/#system-metrics) provides real-time automated diagnostics.
 #end
 
+
 #ci-cd-support
 > All deployment articles in this documentation provide general guidance and fundamentals. Telerik does not provide technical support for setting up CI/CD environments or application publishing infrastructure.
 #end

_contentTemplates/common/get-started.md

@@ -90,7 +90,7 @@ Well done! Now you have your first Telerik UI for Blazor component running in yo
 * [Explore the live Telerik UI for Blazor demos](https://demos.telerik.com/blazor-ui/).
 * [Learn the data binding fundamentals for Telerik UI for Blazor components]({%slug common-features-data-binding-overview%}).
 * [Get started with the data Grid]({%slug grid-overview%}).
-* [Review the built-in themes or create custom ones]({%slug themes-built-in%}).
+* [Review the built-in themes or create custom ones]({%slug themes-overview%}).
 
 #end
 

_contentTemplates/common/themebuilder-section.md

@@ -2,7 +2,7 @@
 
 ## ThemeBuilder
 
-To take full control over the appearance of the Telerik UI for Blazor components, you can create your own styles by using [ThemeBuilder]({%slug themebuilder%}).
+To take full control over the appearance of the Telerik UI for Blazor components, you can create your own styles by using [ThemeBuilder](https://docs.telerik.com/themebuilder).
 
 ThemeBuilder is a web application that enables you to create new themes and customize existing ones. Every change that you make is visualized almost instantly. Once you are done styling the UI components, you can export a ZIP file with the styles for your theme and use them in your Blazor app.
 #end

accessibility/accessibility-swatch.md

@@ -10,7 +10,7 @@ position: 7
 
 # Ocean Blue Accessibility Swatch
 
-The [Web Content Accessibility Guidelines](https://www.w3.org/TR/WCAG21/) sections [1.4.3 Contrast (Minimum)](https://www.w3.org/TR/WCAG21/#contrast-minimum) and [1.4.6 Contrast (Enhanced)](https://www.w3.org/TR/WCAG21/#contrast-enhanced) define contrast ratios for accessibility compliance. The *Default Ocean Blue A11y* [theme swatch]({%slug themes-swatches%}) in Telerik UI for Blazor conforms to WCAG Level AA, which requires contrast ratios of at least:
+The [Web Content Accessibility Guidelines](https://www.w3.org/TR/WCAG21/) sections [1.4.3 Contrast (Minimum)](https://www.w3.org/TR/WCAG21/#contrast-minimum) and [1.4.6 Contrast (Enhanced)](https://www.w3.org/TR/WCAG21/#contrast-enhanced) define contrast ratios for accessibility compliance. The *Default Ocean Blue A11y* [theme swatch]({%slug themes-overview%}#basics) in Telerik UI for Blazor conforms to WCAG Level AA, which requires contrast ratios of at least:
 
 * 4.5:1 for normal text
 * 3:1 for large text
@@ -25,12 +25,12 @@ The Default Ocean Blue A11y swatch is built on top of the Default Ocean Blue swa
 
 ## Using the Accessibility Swatch
 
-You can [obtain and use the Default Ocean Blue A11y swatch]({%slug themes-swatches%}#using-built-in-swatches) starting from the following component and theme versions:
+You can [obtain and use the Default Ocean Blue A11y swatch]({%slug themes-overview%}#swatch) starting from the following component and theme versions:
 
 * [Telerik UI for Blazor version 4.0.1](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-4-0-1)
 * [Themes version 6.0.3](https://github.com/telerik/kendo-themes/releases/tag/v6.0.3)
 
-Check section [Theme Version Compatibility]({%slug themes-built-in%}#theme-version-compatibility-and-maintenance) for more information about how to align Telerik UI for Blazor versions with theme versions.
+Check section [Theme Version Compatibility]({%slug themes-overview%}#compatibility-and-maintenance) for more information about how to align Telerik UI for Blazor versions with theme versions.
 
 > An existing limitation is that the ColorPalette component fails WCAG success criterion 1.4.11. "Non-text contrast for the focus indicator on its items".
 

common-features/cdn.md

@@ -20,10 +20,10 @@ The CDN hosts two kinds of static client assets for the Telerik UI for Blazor co
 
 ## CSS Theme URLs
 
-The [Telerik CSS themes]({%slug themes-built-in%}) are available on two CDN hosts:
+The [Telerik CSS themes]({%slug themes-overview%}) are available on two CDN hosts:
 
-* `unpkg.com` provides [all built-in theme swatches]({%slug themes-swatches%}#swatch-urls). The version number in the theme URL matches the version of the theme itself. Make sure to [use compatible theme and component versions]({%slug themes-swatches%}#theme-version-compatibility-and-maintenance). For example, use theme version `{{site.themesVersion}}` with UI for Blazor version `{{site.uiForBlazorLatestVersion}}`.
-* `blazor.cdn.telerik.com` provides a limited set of popular [theme swatches]({%slug themes-swatches%}). The version number in the theme URL matches the version of the Telerik UI for Blazor components, for example, `{{site.uiForBlazorLatestVersion}}`.
+* `unpkg.com` provides [all built-in theme swatches]({%slug themes-overview%}#swatch). The version number in the theme URL matches the version of the theme itself. Make sure to [use compatible theme and component versions]({%slug themes-overview%}#compatibility-and-maintenance). For example, use theme version `{{site.themesVersion}}` with UI for Blazor version `{{site.uiForBlazorLatestVersion}}`.
+* `blazor.cdn.telerik.com` provides a limited set of popular [theme swatches]({%slug themes-overview%}#basics). The version number in the theme URL matches the version of the Telerik UI for Blazor components, for example, `{{site.uiForBlazorLatestVersion}}`.
 
 ### UNPKG CDN
 

common-features/dimensions.md

@@ -95,5 +95,5 @@ The examples here showcase different units and examples of using them to set dim
 
 ## See Also
 
-* [Themes]({%slug themes-built-in%})
+* [Themes]({%slug themes-overview%})
 * [Override Theme Styles]({%slug themes-override%})

common-features/icons.md

@@ -172,11 +172,11 @@ Our font icons are designed on a 16px grid base. For better display quality, use
 
 ### Render Font Icons with HTML
 
-Telerik UI for Blazor shares the same [themes]({%slug themes-built-in%}) with several other Telerik and Kendo UI web component suites. All these products use the same font icons.
+Telerik UI for Blazor shares the same [themes]({%slug themes-overview%}) with several other Telerik and Kendo UI web component suites. All these products use the same font icons.
 
 You can use the built-in font icons directly with HTML tags, without the `<TelerikFontIcon>` component. Such direct HTML usage may provide more flexibility, but if you don't really need it, we recommend using `FontIcon` objects and the `<TelerikFontIcon>` component instead.
 
-To use the icons directly, refer to [List of all Telerik Icons](https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/) and obtain the desired CSS class. The `<TelerikFontIcon>` component simply drops the `k-i-` CSS class prefix to make it easier for you.
+To use the icons directly, refer to <a href="https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/" target="_blank">List of all Telerik Icons</a> and obtain the desired CSS class. The `<TelerikFontIcon>` component simply drops the `k-i-` CSS class prefix to make it easier for you.
 
 >caption Use Telerik font icons with plain HTML
 
@@ -314,7 +314,7 @@ It is possible to configure the icon type for the whole application:
 
 ## Icons List
 
-The [Telerik Design System](https://www.telerik.com/design-system/docs/) website provides a list of all [**built-in icons in Telerik UI for Blazor**](https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/).
+The <a href="https://www.telerik.com/design-system/docs/" target="_blank">Progress Design System</a> website provides a list of all <a href="https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/" target="_blank">built-in icons in Telerik UI for Blazor</a>.
 
 To define an icon with C# syntax, replace the kebab-case with PascalCase. For example, `plus-outline` should become `FontIcon.PlusOutline` or `SvgIcon.PlusOutline`.
 
@@ -341,6 +341,6 @@ Telerik UI for Blazor supports using custom (third-party) icons:
 
 ## See Also
 
-* [Built-in Icon List](https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/)
+* <a href="https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/" target="_blank">Built-in Icon List</a>
 * [Blazor Live Demos](https://demos.telerik.com/blazor-ui/)
-* [CSS Themes]({%slug themes-built-in%})
+* [CSS Themes]({%slug themes-overview%})

components/button/overview.md

@@ -14,7 +14,7 @@ This article introduces the <a href="https://www.telerik.com/blazor-ui/buttons"
 
 Buttons convey user actions and can display text, images and HTML.
 
-The Blazor Button provides a variety of styling options through the [built-in themes]({%slug themes-built-in%}) and the [button type]({%slug button-type%}). It supports [font icons and images]({%slug button-icons%}) and fires click [events]({%slug button-events%}).
+The Blazor Button provides a variety of styling options through the [built-in themes]({%slug themes-overview%}) and the [button type]({%slug button-type%}). It supports [font icons and images]({%slug button-icons%}) and fires click [events]({%slug button-events%}).
 
 ## Creating Blazor Button
 
@@ -57,7 +57,7 @@ To prevent user interaction with a Button, disable it. [Read more about the disa
 
 ## Styling
 
-To customize the style and the appearance of the Blazor Button, you can use the [built-in themes]({%slug themes-built-in%}). Additionally, set the `Class` attribute to implement custom CSS rules or [configure the built-in appearance options]({%slug button-styling%}).
+To customize the style and the appearance of the Blazor Button, you can use the [built-in themes]({%slug themes-overview%}). Additionally, set the `Class` attribute to implement custom CSS rules or [configure the built-in appearance options]({%slug button-styling%}).
 
 >tip To learn more about the appearance, anatomy, and accessibility of the Button, visit the [Progress Design System documentation](https://www.telerik.com/design-system/docs/components/button/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 

components/button/styling.md

@@ -13,7 +13,7 @@ position: 10
 There are a few ways to style the Button component:
 
 * Set a [primary button](#primary-button) style.
-* Use another [built-in theme]({%slug themes-built-in%}).
+* Use another [built-in theme]({%slug themes-overview%}).
 * Use the [Button `Class`](#button-class) attribute.
 
 ## Primary Button

components/buttongroup/overview.md

@@ -14,7 +14,7 @@ This article provides information about the <a href="https://www.telerik.com/bla
 
 The ButtonGroup component is a container for [regular and toggle buttons]({%slug buttongroup-buttons%}). Before continuing, make sure you are familiar with the differences between [regular buttons]({%slug components/button/overview%}) and [toggle buttons]({%slug togglebutton-overview%}).
 
-The ButtonGroup component lets you [select one or more toggle buttons]({%slug buttongroup-selection%}), and respond to the [selection and click events]({%slug buttongroup-events%}). The buttons inside fill up the container, match the styling according to the [chosen theme]({%slug themes-built-in%}) and provide the regular button features like images and icons and the other parameters and attributes.
+The ButtonGroup component lets you [select one or more toggle buttons]({%slug buttongroup-selection%}), and respond to the [selection and click events]({%slug buttongroup-events%}). The buttons inside fill up the container, match the styling according to the [chosen theme]({%slug themes-overview%}) and provide the regular button features like images and icons and the other parameters and attributes.
 
 ## Creating Blazor ButtonGroup
 

components/grid/overview.md

@@ -226,4 +226,3 @@ To execute these methods, obtain reference to the Grid instance via `@ref`.
 
 * [Live Grid Demos](https://demos.telerik.com/blazor-ui/grid/index)
 * [Grid API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikGrid-1)
-* [Create Custom Styles by Using ThemeBuilder]({%slug themebuilder%})

components/loader/appearance.md

@@ -94,7 +94,7 @@ The `ThemeColor` parameter sets the color of the animated loading indicator. You
 * `Light`
 * `Inverse`
 
-These predefined options match the main [Telerik Theme]({%slug themes-built-in%}) and you can see that in action in the [Loader Appearance live demo](https://demos.telerik.com/blazor-ui/loader/appearance).
+These predefined options match the main [Telerik Theme]({%slug themes-overview%}) and you can see that in action in the [Loader Appearance live demo](https://demos.telerik.com/blazor-ui/loader/appearance).
 
 >caption Built-in Theme Colors
 

components/notification/appearance.md

@@ -139,7 +139,7 @@ The color of the notification popup is easily controlled through the `ThemeColor
 * `Light`
 * `Inverse`
 
-These predefined options match the main [Telerik Theme]({%slug themes-built-in%}) and you can see that in action in the [Notification Appearance](https://demos.telerik.com/blazor-ui/notification/appearance) Live Demo.
+These predefined options match the main [Telerik Theme]({%slug themes-overview%}) and you can see that in action in the [Notification Appearance](https://demos.telerik.com/blazor-ui/notification/appearance) Live Demo.
 
 There are built-in themes for the most common notifications such as Success, Info, Warning, Error, that also come with predefined icons, so you don't have to set them explicitly.
 

components/radiogroup/overview.md

@@ -10,7 +10,7 @@ position: 0
 
 # Blazor RadioGroup Overview
 
-The <a href="https://www.telerik.com/blazor-ui/radiogroup" target="_blank">Blazor RadioGroup component</a> allows the user to select an option from a predefined set of choices in a list of radio buttons. The radio group is styled according to the Telerik [Theme]({%slug themes-built-in%}). You can also choose the [layout order]({%slug radiogroup-layout%}) and [label position]({%slug radiogroup-label-position%}).
+The <a href="https://www.telerik.com/blazor-ui/radiogroup" target="_blank">Blazor RadioGroup component</a> allows the user to select an option from a predefined set of choices in a list of radio buttons. The radio group is styled according to the Telerik [Theme]({%slug themes-overview%}). You can also choose the [layout order]({%slug radiogroup-layout%}) and [label position]({%slug radiogroup-label-position%}).
 
 ## Creating Blazor RadioGroup
 

components/spreadsheet/overview.md

@@ -77,12 +77,12 @@ The table below lists the Spreadsheet parameters. For a full list of the ListBox
 | `ColumnWidth` | `double` <br /> (`64`) | The initial pixel width of the columns. |
 | `Data` | `byte[]` | The Excel file to display in the Spreadsheet component. |
 | `EnableLoaderContainer` | `bool` <br /> (`true`) | Defines if the component will show a built-in [LoaderContainer]({%slug loadercontainer-overview%}) while loading Excel files. |
-| `Height` | `string` | The `height` style of the `<div class="k-spreadsheet">` element. The [built-in themes]({%slug themes-built-in%}) apply `"600px"` by default. |
+| `Height` | `string` | The `height` style of the `<div class="k-spreadsheet">` element. The [built-in themes]({%slug themes-overview%}) apply `"600px"` by default. |
 | `RowHeaderWidth` | `double` <br /> (`32`) | The pixel width of the row headers that display the row numbers. The default width fits up to 3 digits comfortably. |
 | `RowHeight` | `double` <br /> (`20`) | The initial pixel height of the rows. |
 | `RowsCount` | `int` <br /> (`200`) | The initial number of rows to render. Users can add and delete rows at runtime. |
 | `Tools` | `SpreadsheetToolSet` <br /> (`SpreadsheetToolSets.All`) | The available tabs and tools that users can use to manipulate the Excel file content. The Spreadsheet renders all its tools by default, so the resulting Spreadsheet UI will change in the future. |
-| `Width` | `string` | The `width` style of the `<div class="k-spreadsheet">` element. The [built-in CSS themes]({%slug themes-built-in%}) apply `"100%"` by default. |
+| `Width` | `string` | The `width` style of the `<div class="k-spreadsheet">` element. The [built-in CSS themes]({%slug themes-overview%}) apply `"100%"` by default. |
 
 
 ## Spreadsheet Reference and Methods

components/togglebutton/overview.md

@@ -12,7 +12,7 @@ position: 0
 
 This article provides information about the <a href="https://www.telerik.com/blazor-ui/togglebutton" target="_blank">Blazor ToggleButton component</a> and its core features.
 
-The ToggleButton component can have a selected state, which is the main difference from the [regular Telerik UI for Blazor Button]({%slug components/button/overview%}). The two-state styling depends on the [chosen theme]({%slug themes-built-in%}). The ToggleButton also provides [events]({%slug togglebutton-events%}), [declarative appearance customization]({%slug togglebutton-appearance%}) and can nest [icons]({%slug togglebutton-icons%}).
+The ToggleButton component can have a selected state, which is the main difference from the [regular Telerik UI for Blazor Button]({%slug components/button/overview%}). The two-state styling depends on the [chosen theme]({%slug themes-overview%}). The ToggleButton also provides [events]({%slug togglebutton-events%}), [declarative appearance customization]({%slug togglebutton-appearance%}) and can nest [icons]({%slug togglebutton-icons%}).
 
 ## Creating Blazor ToggleButton
 

deployment/troubleshooting.md

@@ -73,7 +73,7 @@ At the time of writing, sometimes the following issues have been reported that p
 
 * On Linux (and often Docker), paths are case-sensitive. Make sure you have the correct casing when registering the styles and scripts. See the [CSS Theme and JavaScript Files]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files) section of the documentation.
 
-    * Some reports indicate that deploying to a Docker container never copies over the static assets and you may have to either copy the file manually, or use it from [our CDN]({%slug themes-built-in%}#cdn). This may be related to the static asset configurations from the previous points, however.
+    * Some reports indicate that deploying to a Docker container never copies over the static assets and you may have to either copy the file manually, or use it from [our CDN]({%slug themes-overview%}#cdn). This may be related to the static asset configurations from the previous points, however.
 
 * We have had reports that indicate missing project references do not copy the static assets. For example, in an ASP.NET Core hosted WebAssembly project the server project usually has a project reference to the Blazor project. If that reference is missing, the static assets might not be present in the output.
 

getting-started/client-blazor.md

@@ -59,7 +59,7 @@ To enable the Telerik UI for Blazor components, you must add several client-side
 **HTML**
 @[template](/_contentTemplates/common/js-interop-file.md#js-interop-file-snippet)
 
-2\. In the `~/wwwroot/index.html` file of the client web application, add the [theme stylesheet as a static asset]({%slug themes-built-in%}#using-a-theme). The theme allows you to select the appearance and color scheme for the Telerik Blazor components.
+2\. In the `~/wwwroot/index.html` file of the client web application, add the [theme stylesheet as a static asset]({%slug themes-overview%}#using-a-theme). The theme allows you to select the appearance and color scheme for the Telerik Blazor components.
 
 @[template](/_contentTemplates/common/js-interop-file.md#theme-static-asset-snippet)