Updated Link to "Modularisierung" in Theming (#240)

Ref  #6828

Author: sdvg

docs/20-concepts/05-styling/34-theming.mdx

@@ -1,6 +1,6 @@
-import {KolAlert, KolDetails, KolIndentedText, KolLink,} from '@public-ui/react';
-import {KoliBri} from '@site/src/components/KoliBri';
-import {Mermaid} from '@site/src/components/Mermaid';
+import { KolAlert, KolDetails, KolIndentedText, KolLink, } from '@public-ui/react';
+import { KoliBri } from '@site/src/components/KoliBri';
+import { Mermaid } from '@site/src/components/Mermaid';
 
 # Theming
 
@@ -9,13 +9,13 @@ import {Mermaid} from '@site/src/components/Mermaid';
 </KolAlert>
 
 <p>
-	Das Einzigartige an <KoliBri /> ist die <strong>Referenzimplementierung</strong> von Komponenten, die von Grund auf
+	Das Einzigartige an <KoliBri/> ist die <strong>Referenzimplementierung</strong> von Komponenten, die von Grund auf
 	<strong>semantisch W3C- und WCAG-konform</strong> und damit <strong>vollständig barrierefrei</strong> bezüglich der assistiven
 	Unterstützung sind. Alle Komponenten werden dabei als <KolLink
-		_label="Web Components"
-		_href="https://developer.mozilla.org/en-US/docs/Web/Web_Components?retiredLocale=de"
-		_target="_blank"
-	/> umgesetzt und sind somit in allen webbasierten Projekten wiederverwendbar. In der folgenden Abbildung werden diese Komponenten
+	_label="Web Components"
+	_href="https://developer.mozilla.org/en-US/docs/Web/Web_Components?retiredLocale=de"
+	_target="_blank"
+/> umgesetzt und sind somit in allen webbasierten Projekten wiederverwendbar. In der folgenden Abbildung werden diese Komponenten
 	durch die grau-gestrichelten Formen in der Mitte dargestellt.
 </p>
 <p>
@@ -33,7 +33,7 @@ import {Mermaid} from '@site/src/components/Mermaid';
 />
 
 <p>
-	Im ersten Release (v1.0) hatte <KoliBri /> noch direkt das Individualisieren des Standard-Designs mittels sogenannter{' '}
+	Im ersten Release (v1.0) hatte <KoliBri/> noch direkt das Individualisieren des Standard-Designs mittels sogenannter{' '}
 	<strong>
 		<KolLink
 			_label="CSS-Properties"
@@ -48,10 +48,10 @@ import {Mermaid} from '@site/src/components/Mermaid';
 		_target="_blank"
 	/>
 	, <KolLink
-		_label="Tailwind CSS"
-		_href="https://tailwindcss.com"
-		_target="_blank"
-	/>) umgesetzt. Mit der
+	_label="Tailwind CSS"
+	_href="https://tailwindcss.com"
+	_target="_blank"
+/>) umgesetzt. Mit der
 	Umsetzung weiterer Themes haben wir jedoch festgestellt, dass wir immer mehr CSS-Properties einführen müssten, um die
 	Flexiblität für das gewünschte Design/UX (Corporate Design/Styleguide) umsetzen zu können. Im Zweifel müsste für jede
 	Anpassbarkeit ein separates Property vorgesehen werden. Am Beispiel des{' '}
@@ -66,10 +66,10 @@ import {Mermaid} from '@site/src/components/Mermaid';
 	<KolIndentedText>
 		<strong>
 			2. Wir haben das ganze CSS vollständig von den Components entkoppelt (wie <KolLink
-				_label="Styled-Components"
-				_href="https://styled-components.com"
-				_target="_blank"
-			/>).
+			_label="Styled-Components"
+			_href="https://styled-components.com"
+			_target="_blank"
+		/>).
 		</strong>
 	</KolIndentedText>
 </p>
@@ -132,7 +132,7 @@ stateDiagram-v2
 <p>
 	Das UI/UX-Team spezifiziert beispielsweise mit Figma die Komponenten ihres Design-Systems. Bei der Überführung der
 	Spezifikation in die Realisierung wird das Design in Form von reinem CSS mittels des{' '}
-	<KolLink _label="KoliBri-Designers" _href="/docs/concepts/styling/designer" /> auf die Basis-Komponenten
+	<KolLink _label="KoliBri-Designers" _href="/docs/concepts/styling/designer"/> auf die Basis-Komponenten
 	„übertragen“. Wenn im eigenen Design-System eine Individualisierbarkeit gewünscht ist, können im Designer dafür
 	CSS-Properties oder Design-Tokens definiert werden. Damit das eigene Theme über Projekte hinweg geteilt werden kann,
 	wird das Theme in ein NPM-Paket paketiert und kann über eine beliebige Registry bereitgestellt werden.
@@ -159,7 +159,7 @@ stateDiagram-v2
 		Hierfür bieten wir die sogenannte <strong>KoliBri-Factory</strong> (Stack) an (siehe{' '}
 		<KolLink
 			_label="Modularisierung"
-			_href="https://github.com/public-ui/kolibri/blob/main/docs/ARCHITECTURE.md#erweitert"
+			_href="/docs/concepts/architecture#erweitert"
 			_target="_blank"
 		/>
 		).

i18n/en/docusaurus-plugin-content-docs/version-2.1/20-concepts/05-styling/34-theming.mdx

@@ -1,6 +1,6 @@
-import {KolAlert, KolDetails, KolIndentedText, KolLink,} from '@public-ui/react';
-import {KoliBri} from '@site/src/components/KoliBri';
-import {Mermaid} from '@site/src/components/Mermaid';
+import { KolAlert, KolDetails, KolIndentedText, KolLink, } from '@public-ui/react';
+import { KoliBri } from '@site/src/components/KoliBri';
+import { Mermaid } from '@site/src/components/Mermaid';
 
 # Theming
 
@@ -9,7 +9,9 @@ import {Mermaid} from '@site/src/components/Mermaid';
 </KolAlert>
 
 <p>
-	The unique feature of <KoliBri /> is the <strong>reference implementation</strong> of components that are <strong>semantically W3C- and WCAG-compliant</strong> from the ground up and thus <strong>completely accessible</strong> regarding assistive support. All components are implemented as <KolLink _label="Web Components" _href="https://developer.mozilla.org/en-US/docs/Web/Web_Components" _target="_blank" />
+	The unique feature of <KoliBri/> is the <strong>reference implementation</strong> of components that are <strong>semantically W3C- and
+	WCAG-compliant</strong> from the ground up and thus <strong>completely accessible</strong> regarding assistive support. All components are implemented
+	as <KolLink _label="Web Components" _href="https://developer.mozilla.org/en-US/docs/Web/Web_Components" _target="_blank"/>
 	and are therefore reusable in all web-based projects. In the following figure, these components are represented by the gray-dashed shapes in the center.
 </p>
 <p>
@@ -24,15 +26,24 @@ import {Mermaid} from '@site/src/components/Mermaid';
 />
 
 <p>
-	In the first release (v1.0) <KoliBri /> had directly implemented the individualization of the standard design using
-	so-called <strong><KolLink _label="CSS-Properties" _href="https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties" _target="_blank" /></strong>
-	(<KolLink _label="Design-Tokens" _href="https://uxdesign.cc/design-tokens-for-dummies-8acebf010d71" _target="_blank" />, <KolLink _label="Tailwind CSS" _href="https://tailwindcss.com" _target="_blank" />). With the implementation of further themes, however, we have found that we would have to introduce more and more CSS-Properties to be able to implement the flexibility for the desired design/UX (Corporate Design/Style guide). In
-	case of doubt, a separate property would have to be provided for each customizability. The example of the <KolLink _label="MUI-Button CSS" _href="https://mui.com/material-ui/api/button/#css" _target="_blank" /> shows well how the CSS properties (design tokens) become more and more.
+	In the first release (v1.0) <KoliBri/> had directly implemented the individualization of the standard design using
+	so-called <strong><KolLink _label="CSS-Properties" _href="https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties"
+														 _target="_blank"/></strong>
+	(<KolLink _label="Design-Tokens" _href="https://uxdesign.cc/design-tokens-for-dummies-8acebf010d71" _target="_blank"/>, <KolLink _label="Tailwind CSS"
+																																																																	 _href="https://tailwindcss.com"
+																																																																	 _target="_blank"/>). With the
+	implementation of further themes, however, we have found that we would have to introduce more and more CSS-Properties to be able to implement the flexibility
+	for the desired design/UX (Corporate Design/Style guide). In
+	case of doubt, a separate property would have to be provided for each customizability. The example of the <KolLink _label="MUI-Button CSS"
+																																																										 _href="https://mui.com/material-ui/api/button/#css"
+																																																										 _target="_blank"/> shows well how the CSS
+	properties (design tokens) become more and more.
 </p>
 <p>
 	<KolIndentedText>
 		<strong>
-			2. We have completely decoupled the whole CSS from the components (like <KolLink _label="Styled-Components" _href="https://styled-components.com" _target="_blank" />).
+			2. We have completely decoupled the whole CSS from the components (like <KolLink _label="Styled-Components" _href="https://styled-components.com"
+																																											 _target="_blank"/>).
 		</strong>
 	</KolIndentedText>
 </p>
@@ -93,7 +104,7 @@ stateDiagram-v2
 <p>
 	For example, the UI/UX team specifies the components of their design system with Figma. When the specification is
 	transferred to implementation, the design is “transferred” to the basic components in the form of pure CSS using the
-	<KolLink _label="KoliBri-Designer" _href="/en/docs/concepts/styling/designer" />. If customizability is desired in your
+	<KolLink _label="KoliBri-Designer" _href="/en/docs/concepts/styling/designer"/>. If customizability is desired in your
 	design system, CSS properties or design tokens can be defined in the Designer for this purpose. So that the own theme
 	can be shared across projects, the theme is packaged in an NPM package and can be made available via any registry.
 </p>
@@ -115,6 +126,12 @@ stateDiagram-v2
 	<p>
 		Own specific components, which are not provided by KoliBri and unfortunately do not fit to the KoliBri component
 		variety, can be built in own component libraries and maintained independently. For this purpose, we offer the
-		so-called <strong>KoliBri-Factory</strong> (Stack) (see <KolLink _label="Modularization" _href="https://github.com/public-ui/kolibri/blob/main/docs/ARCHITECTURE.md#erweitert" _target="_blank" />).
+		so-called <strong>KoliBri-Factory</strong> (Stack) (see{' '}
+		<KolLink
+			_label="Modularization"
+			_href="/en/docs/concepts/architecture#advanced"
+			_target="_blank"
+		/>
+		).
 	</p>
 </KolAlert>

versioned_docs/version-2.1/20-concepts/05-styling/34-theming.mdx

@@ -159,7 +159,7 @@ stateDiagram-v2
 		Hierfür bieten wir die sogenannte <strong>KoliBri-Factory</strong> (Stack) an (siehe{' '}
 		<KolLink
 			_label="Modularisierung"
-			_href="https://github.com/public-ui/kolibri/blob/main/docs/ARCHITECTURE.md#erweitert"
+			_href="/docs/concepts/architecture#erweitert"
 			_target="_blank"
 		/>
 		).