diff --git a/adev/shared-docs/components/viewers/docs-viewer/docs-viewer.component.ts b/adev/shared-docs/components/viewers/docs-viewer/docs-viewer.component.ts
index 956ce0e9352..76717c25830 100644
--- a/adev/shared-docs/components/viewers/docs-viewer/docs-viewer.component.ts
+++ b/adev/shared-docs/components/viewers/docs-viewer/docs-viewer.component.ts
@@ -221,6 +221,7 @@ export class DocViewer {
name: tab.getAttribute('path') ?? tab.getAttribute('header') ?? '',
sanitizedContent: this.sanitizer.bypassSecurityTrustHtml(tab.innerHTML),
visibleLinesRange: tab.getAttribute('visibleLines') ?? undefined,
+ shell: tab.classList.contains('shell'),
}));
}
@@ -243,6 +244,7 @@ export class DocViewer {
? this.sanitizer.bypassSecurityTrustHtml(content.outerHTML)
: '',
visibleLinesRange: visibleLines,
+ shell: element.classList.contains('shell'),
};
}
diff --git a/adev/shared-docs/components/viewers/example-viewer/example-viewer.component.html b/adev/shared-docs/components/viewers/example-viewer/example-viewer.component.html
index 2e73481c2ee..c22a2457807 100644
--- a/adev/shared-docs/components/viewers/example-viewer/example-viewer.component.html
+++ b/adev/shared-docs/components/viewers/example-viewer/example-viewer.component.html
@@ -97,6 +97,7 @@
class="docs-example-viewer-code-wrapper"
[class.docs-example-viewer-snippet]="view() === CodeExampleViewMode.SNIPPET"
[class.docs-example-viewer-multi-file]="view() === CodeExampleViewMode.MULTI_FILE"
+ [class.shell]="snippetCode()?.shell"
>
@if (snippetCode()?.sanitizedContent; as content) {
diff --git a/adev/shared-docs/interfaces/code-example.ts b/adev/shared-docs/interfaces/code-example.ts
index 1643a205faf..46fe274109c 100644
--- a/adev/shared-docs/interfaces/code-example.ts
+++ b/adev/shared-docs/interfaces/code-example.ts
@@ -25,6 +25,8 @@ export interface Snippet {
sanitizedContent: SafeHtml;
/** Text in following format `start-end`. Start and end are numbers, based on them provided range of lines will be displayed in collapsed mode */
visibleLinesRange?: string;
+
+ shell?: boolean;
}
export interface ExampleMetadata {
diff --git a/adev/shared-docs/pipeline/shared/marked/extensions/docs-code/format/index.mts b/adev/shared-docs/pipeline/shared/marked/extensions/docs-code/format/index.mts
index 95bafb19111..b81e0e24c90 100644
--- a/adev/shared-docs/pipeline/shared/marked/extensions/docs-code/format/index.mts
+++ b/adev/shared-docs/pipeline/shared/marked/extensions/docs-code/format/index.mts
@@ -26,7 +26,7 @@ export interface CodeToken extends Tokens.Generic {
path?: string;
/* The example display header */
header?: string;
- /* Whether stling should include line numbers */
+ /* Whether styling should include line numbers */
linenums?: boolean;
/* The example path to determine diff (lines added/removed) */
diff?: string;
@@ -41,7 +41,7 @@ export interface CodeToken extends Tokens.Generic {
/* The lines to display highlighting on */
highlight?: string;
- /** The generated diff metadata if created in the code formating process. */
+ /** The generated diff metadata if created in the code formatting process. */
diffMetadata?: DiffMetadata;
// additional classes for the element
diff --git a/adev/src/content/introduction/installation.md b/adev/src/content/introduction/installation.md
index 4201488f90b..45d716d0817 100644
--- a/adev/src/content/introduction/installation.md
+++ b/adev/src/content/introduction/installation.md
@@ -35,21 +35,25 @@ Open a terminal (if you're using [Visual Studio Code](https://code.visualstudio.
npm install -g @angular/cli
pnpm install -g @angular/cli
yarn global add @angular/cli
bun install -g @angular/cli