Fix image paths and links so they work with path prefix (#540)

This change turns all root paths for images and links into relative paths so they work also when we run the web page under a specific sub-folder below a domain.

Referencing images or other pages with a URL starting with `/` will always default to the root folder of a domain. This however won't work if we host the page in a sub-folder of a domain. As we use plain HTML tags in the markdown, probably the easiest fix is to use relative image links instead.

Co-authored-by: Olaf Lessenich <[email protected]>

src/components/index/TheiaIDEDownloads.js

@@ -108,7 +108,7 @@ const TheiaIDEDownloads = () => (
                 Help us make the Theia IDE even better, by <a href="https://github.com/eclipse-theia/theia/discussions">sharing your experience and suggestions</a>.
                 The features found in the Eclipse Theia IDE are based on Eclipse Theia and the available extensions/plugins. For more details please see the <a href="https://github.com/eclipse-theia/theia">Eclipse Theia GitHub Repository</a>. The Eclipse Theia IDE only packages existing Eclipse Theia functionality and installers. If you believe there is a mistake in packaging, something needs to be added to the packaging or the installers do not work properly, please <a href="https://github.com/eclipse-theia/theia-blueprint/issues/new/choose">open an issue on GitHub</a> to let us know.
                 <h1>Support</h1>
-                Need help with Theia? To get support by the community go to the <a href="https://github.com/eclipse-theia/theia/discussions">Discussions at GitHub</a>. To get professional support for Theia see the <a href="/support/">support page</a>.
+                Need help with Theia? To get support by the community go to the <a href="https://github.com/eclipse-theia/theia/discussions">Discussions at GitHub</a>. To get professional support for Theia see the <a href="./support/">support page</a>.
             </div>
 
     </StyledHeader>

src/components/index/TheiaIDEExtensible.js

@@ -84,7 +84,7 @@ const TheiaIDEExtensible = () => (
         <Styled>
             <section className="products" >
                 <h2 className="heading-tertiary">Extensible and Open</h2>
-                <p>The Theia IDE is built upon the highly modular <a href="/">Theia platform</a>, enabling the integration of custom extensions and the creation of fully tailored tools (see examples below). <a href="/">Explore the Theia Platform</a> and learn how to create custom tool offerings with ease!</p>
+                <p>The Theia IDE is built upon the highly modular <a href="./">Theia platform</a>, enabling the integration of custom extensions and the creation of fully tailored tools (see examples below). <a href="./">Explore the Theia Platform</a> and learn how to create custom tool offerings with ease!</p>
                 <br></br>
                 <div className="swiper-button-prev"></div>
                 <Swiper

src/docs/authoring_extensions.md

@@ -4,7 +4,7 @@ title: Authoring an Extension
 
 # Authoring Theia Extensions
 
-This guide will walk you through the process of creating Theia extensions and deploying them in your Theia-based application. Please make sure to be aware of the [different available extension mechanisms](docs/extensions/) of Theia (Plugins vs. Extensions) before you continue reading.
+This guide will walk you through the process of creating Theia extensions and deploying them in your Theia-based application. Please make sure to be aware of the [different available extension mechanisms](../extensions/) of Theia (Plugins vs. Extensions) before you continue reading.
 
 As an example, we are going to add a menu item _Say hello_ that displays a notification "Hello world!". This article is guiding you through all the necessary steps.
 
@@ -14,7 +14,7 @@ A Theia app is composed of so-called _extensions_. An extension provides a set o
 
 Theia defines a plethora of contribution interfaces that allow extensions to add their behaviour to various aspects of the application. Just search for interfaces with the name `*Contribution` to get an idea. An extension implements the contribution interfaces belonging to the functionality it wants to deliver. In this example, we are going to implement a `CommandContribution` and a `MenuContribution`. Other ways for extensions to interact with a Theia application are via one of the various _services_ or _managers_.
 
-In Theia, everything is wired up via [dependency injection](/docs/Services_and_Contributions#dependency-injection-di). An extension defines one or more dependency injection modules. This is where it binds its contribution implementations to the respective contribution interface. The modules are listed in the `package.json` of the extension package. An extension can contribute to the frontend, e.g. providing a UI extension, as well as to the backend, e.g. contributing a language server. When the application starts, the union of all these modules is used to configure a single, global dependency injection container on each, the frontend and the backend. The runtime will then collect all contributions of a specific kind by means of a multi-inject.
+In Theia, everything is wired up via [dependency injection](../services_and_contributions#dependency-injection-di). An extension defines one or more dependency injection modules. This is where it binds its contribution implementations to the respective contribution interface. The modules are listed in the `package.json` of the extension package. An extension can contribute to the frontend, e.g. providing a UI extension, as well as to the backend, e.g. contributing a language server. When the application starts, the union of all these modules is used to configure a single, global dependency injection container on each, the frontend and the backend. The runtime will then collect all contributions of a specific kind by means of a multi-inject.
 
 ## Prerequisites
 

src/docs/authoring_plugins.md

@@ -4,7 +4,7 @@ title: Authoring Plug-ins
 
 # Authoring Theia Plug-ins
 
-This documentation is deprecated and needs to be updated. We currently recommend using VS Code extensions or Theia extensions instead of Theia Plugins. See the [extension overview](https://theia-ide.org/docs/extensions/) for more details.
+This documentation is deprecated and needs to be updated. We currently recommend using VS Code extensions or Theia extensions instead of Theia Plugins. See the [extension overview](../extensions/) for more details.
 <!--
 Let's create our first Theia plug-in. As an example, we are going to register a command _Hello World_ that displays a notification "Hello world!". This article is guiding you through all the necessary steps.
 
@@ -69,7 +69,7 @@ In the previous commands:
 
 Here is an animated screenshot of the generator running.
 
-<img src="/yeoman-plugin.gif" class="doc-image" alt="Yeoman plugin output">
+<img src="../../yeoman-plugin.gif" class="doc-image" alt="Yeoman plugin output">
 
 Pick up default values for each question.
 

src/docs/authoring_vscode_extensions.md

@@ -4,13 +4,13 @@ title: Authoring VS Code Extensions
 
 # Authoring VS Code Extensions
 
-Alongside [Theia extensions](https://theia-ide.org/docs/extensions#theia-extensions), VS Code extensions can also be used to enhance Theia applications with additional functionality, such as language support, commands, or tree views.
+Alongside [Theia extensions](../extensions#theia-extensions), VS Code extensions can also be used to enhance Theia applications with additional functionality, such as language support, commands, or tree views.
 VS Code extensions contribute functionality through the dedicated VS Code API, which the Theia framework also supports.
 This means that extensions that have been developed for VS Code are also compatible with Theia, and vice versa.
 The [coverage report](https://eclipse-theia.github.io/vscode-theia-comparator/status.html) provides more details on the extent to which the VS Code API is supported by each Theia version.
 
 While there are certain overlaps in which types of functionality can be contributed to a Theia application with a Theia extension or a VS Code extension, both have their unique advantages and disadvantages.
-Please refer to the overview on [extensions and plugins](https://theia-ide.org/docs/extensions) and an [in-depth comparison](https://eclipsesource.com/blogs/2021/03/24/vs-code-extensions-vs-theia-extensions/) for a more detailed discussion.
+Please refer to the overview on [extensions and plugins](../extensions) and an [in-depth comparison](https://eclipsesource.com/blogs/2021/03/24/vs-code-extensions-vs-theia-extensions/) for a more detailed discussion.
 
 In the remainder of this page, we guide you through the process of creating VS Code extensions and deploying them in Theia.
 The steps for deploying VS Code extensions apply not only to VS Code extensions you develop yourself, but also to third-party VS Code extensions from the [Theia marketplace](https://open-vsx.org/). If you use a third-party VS Code extension, you can skip the section "Creating VS Code Extensions" and "Developing VS Code Extensions in a Theia Project".
@@ -129,7 +129,7 @@ Therefore, you need to extend your `package.json` to
 ```
 
 As a result, running `yarn` will download any listed extensions and place them into the folder specified in `theiaPluginsDir` automatically.
-For more details, see also the documentation on [composing Theia applications](https://theia-ide.org/docs/composing_applications/#consuming-vs-code-extensions).
+For more details, see also the documentation on [composing Theia applications](../composing_applications/#consuming-vs-code-extensions).
 
 ### Installing VS Code Extensions at Runtime
 
@@ -160,7 +160,7 @@ To make your VS Code extension available, you'll need to [publish](https://githu
 ## Developing VS Code Extensions in a Theia Project
 
 In certain scenarios, you may not want to develop your VS Code extension in isolation from your Theia application, but instead you may prefer to develop both your extensions and your application in project to keep update cycles short and immediate.
-This is particularly useful if you develop your extensions primarily to be part a specific Theia application, thus you want to develop, test and debug them directly in the context of your Theia app, potentially alongside other [Theia extensions](https://theia-ide.org/docs/extensions#theia-extensions).
+This is particularly useful if you develop your extensions primarily to be part a specific Theia application, thus you want to develop, test and debug them directly in the context of your Theia app, potentially alongside other [Theia extensions](../extensions#theia-extensions).
 
 In those scenarios, you can also include VS Code extensions as part of your Theia application monorepo.
 While there are several possible configuration options, probably the most straightforward approach is to follow the steps below.

src/docs/blueprint_documentation.md

@@ -4,9 +4,9 @@ title: Extending/Adopting the Theia IDE
 
 # Extending/Adopting the Theia IDE
 
-This guide provides an overview on how to extend and customize the Theia IDE to your own custom IDE or tool. In this scenario, the Eclipse Theia IDE is an example product used as a reference on how to build desktop IDE-like products based on the Eclipse Theia framework. If you just want to use the Theia IDE, see the [user guide](/docs/user_getting_started)
+This guide provides an overview on how to extend and customize the Theia IDE to your own custom IDE or tool. In this scenario, the Eclipse Theia IDE is an example product used as a reference on how to build desktop IDE-like products based on the Eclipse Theia framework. If you just want to use the Theia IDE, see the [user guide](../user_getting_started)
 
-Please note that adopting the Theia IDE as a basis is just one of several ways to get started with building a Theia-based application. We recommend reading the article "[Build your own IDE/Tool](/docs/composing_applications)" as a first step. Furthermore, this guide is focused on building a desktop app. We also provide an [experimental Docker version](https://github.com/eclipse-theia/theia-blueprint?tab=readme-ov-file#docker-build) of the Theia IDE as an alternative.
+Please note that adopting the Theia IDE as a basis is just one of several ways to get started with building a Theia-based application. We recommend reading the article "[Build your own IDE/Tool](../composing_applications)" as a first step. Furthermore, this guide is focused on building a desktop app. We also provide an [experimental Docker version](https://github.com/eclipse-theia/theia-blueprint?tab=readme-ov-file#docker-build) of the Theia IDE as an alternative.
 
 The Theia IDE assembles a selected subset of existing Theia features and extensions.
 We provide installers for the Theia IDE to be downloaded (see links below).
@@ -57,7 +57,7 @@ However, as signing is highly dependent on your setup, see the [electron builder
 
 ## Adding/Removing Features
 
-The Theia IDE is based on the Theia platform, which is a flexible and adaptable platform for build tools and IDEs. Therefore, you can adapt the feature set and general appearance of the Theia IDE to your custom requirements with almost no limits. The Theia platform provides two mechanism to add your custom extensions: VS Code extensions and Theia extensions. Please have a look at the [overview about Theia extension capabilities](/docs/extensions/) for details. When assembling a product such as the Theia IDE, you can freely decide, which VS Code extensions and Theia extensions are part of it and thereby influence the feature set of your custom product. The following two sections describe how to modify which [VS Code Extensions](#updating-bundled-vs-code-extensions) and which [Theia extensions](#customizing-theia-extensions) are part of your product. Please also note that you can allow users of a Theia-based tool to [install VS Code extensions at runtime](/docs/user_install_vscode_extensions/).
+The Theia IDE is based on the Theia platform, which is a flexible and adaptable platform for build tools and IDEs. Therefore, you can adapt the feature set and general appearance of the Theia IDE to your custom requirements with almost no limits. The Theia platform provides two mechanism to add your custom extensions: VS Code extensions and Theia extensions. Please have a look at the [overview about Theia extension capabilities](../extensions/) for details. When assembling a product such as the Theia IDE, you can freely decide, which VS Code extensions and Theia extensions are part of it and thereby influence the feature set of your custom product. The following two sections describe how to modify which [VS Code Extensions](#updating-bundled-vs-code-extensions) and which [Theia extensions](#customizing-theia-extensions) are part of your product. Please also note that you can allow users of a Theia-based tool to [install VS Code extensions at runtime](../user_install_vscode_extensions/).
 
 ## Updating Bundled VS Code Extensions
 
@@ -161,7 +161,7 @@ To use another custom dialog widget, remove this code, extend Theia’s AboutDia
 
 ### Customizing the Preferences
 
-The default preferences directory in Eclipse Theia IDE is `.theia-blueprint` and is located as described in the [Preferences documentation](https://theia-ide.org/docs/preferences/). You can customize this location by modifying [`theia-blueprint-variables-server.ts`](https://github.com/eclipse-theia/theia-blueprint/blob/master/theia-extensions/theia-blueprint-product/src/node/theia-blueprint-variables-server.ts).
+The default preferences directory in Eclipse Theia IDE is `.theia-blueprint` and is located as described in the [Preferences documentation](../preferences/). You can customize this location by modifying [`theia-blueprint-variables-server.ts`](https://github.com/eclipse-theia/theia-blueprint/blob/master/theia-extensions/theia-blueprint-product/src/node/theia-blueprint-variables-server.ts).
 
 ### Customizing the Installer
 

src/docs/blueprint_download.md

@@ -4,4 +4,4 @@ title: Eclipse Theia Blueprint
 
 # Eclipse Theia Blueprint
 
-Eclipse Theia Blueprint has been rebranded to "Theia IDE" and has moved to <a href="/#theiaide">this page</a>.
+Eclipse Theia Blueprint has been rebranded to "Theia IDE" and has moved to <a href="../#theiaide">this page</a>.

src/docs/breadcrumbs.md

@@ -8,7 +8,7 @@ If enabled via the preferences, Theia can show a navigation bar, often referred
 This interactive navigation bar indicates the location of the widget's content in the context of an overall structure, such as the filesystem.
 By default, Theia shows breadcrumbs for the location of files in the filesystem when a file is opened in the text editors.
 
-<img src="/breadcrumbs.png" alt="A screenshot of breadcrumbs in Theia" style="max-width: 525px">
+<img src="../../breadcrumbs.png" alt="A screenshot of breadcrumbs in Theia" style="max-width: 525px">
 
 However, Theia's breadcrumbs mechanism can also be used for any custom widget, too.
 Moreover, Theia allows showing a widget's content location in an arbitrary custom logical structure, such as a custom project structure.
@@ -89,7 +89,7 @@ export class CustomBreadcrumbsContribution implements BreadcrumbsContribution {
 
 Once the breadcrumbs contribution is registered, Theia will show the following for our custom widget.
 
-<img src="/breadcrumbs-custom.png" alt="A screenshot of custom breadcrumbs in Theia" style="max-width: 525px">
+<img src="../../breadcrumbs-custom.png" alt="A screenshot of custom breadcrumbs in Theia" style="max-width: 525px">
 
 ## Interactive Breadcrumbs
 
@@ -113,7 +113,7 @@ export class CustomBreadcrumbsContribution implements BreadcrumbsContribution {
 }
 ```
 
-<img src="/breadcrumbs-popup.png" alt="A screenshot of custom breadcrumbs with a popup in Theia" style="max-width: 525px">
+<img src="../../breadcrumbs-popup.png" alt="A screenshot of custom breadcrumbs with a popup in Theia" style="max-width: 525px">
 
 ## Priority of Breadcrumbs Contributions
 

src/docs/commands_keybindings.md

@@ -8,7 +8,7 @@ Commands are runnable actions defined by an ID and the function to be executed (
 
 The following sections provide details about how to contribute commands, keybindings and menu items. The sections will describe how to connect the different contributions and how to use the corresponding services for managing these items.
 
-If you are not yet familiar with contribution points in Theia or the use of dependency injection, please consider this guide on [Services and Contributions](https://theia-ide.org/docs/services_and_contributions/).
+If you are not yet familiar with contribution points in Theia or the use of dependency injection, please consider this guide on [Services and Contributions](../services_and_contributions/).
 
 All the following code examples are from the [Theia extension generator](https://github.com/eclipse-theia/generator-theia-extension). You can get the same code set-up by installing the generator, selecting the “Hello World” example (see here) and choosing “helloworld” as the name.
 
@@ -50,7 +50,7 @@ Finally, by implementing `isToggle` a handler can optionally specify, whether me
 
 ### Binding the contribution to CommandContribution
 
-To make our `CommandContribution` accessible to Theia, we need to bind the custom `HelloworldCommandContribution` to the respective contribution symbol `CommandContribution`. This is done in the `helloworld-frontend-module`, for more details see [Services and Contributions](https://theia-ide.org/docs/services_and_contributions/).
+To make our `CommandContribution` accessible to Theia, we need to bind the custom `HelloworldCommandContribution` to the respective contribution symbol `CommandContribution`. This is done in the `helloworld-frontend-module`, for more details see [Services and Contributions](../services_and_contributions/).
 
 **helloworld-frontend-module.ts**
 
@@ -93,7 +93,7 @@ export class HelloworldMenuContribution implements MenuContribution {
 }
 ```
 
-To make our `MenuContribution` accessible to Theia, we need to bind the custom `HelloWorldMenuContribution` to the respective contribution symbol `MenuContribution`. This is done in the `helloworld-frontend-module`, for more details see [Services and Contributions](https://theia-ide.org/docs/services_and_contributions/).
+To make our `MenuContribution` accessible to Theia, we need to bind the custom `HelloWorldMenuContribution` to the respective contribution symbol `MenuContribution`. This is done in the `helloworld-frontend-module`, for more details see [Services and Contributions](../services_and_contributions/).
 
 **helloworld-contribution.ts**