From efbba945bcfc11cbf103b7e32af2b20752f41337 Mon Sep 17 00:00:00 2001
From: Shuaib Hasan Akib <akibh805@gmail.com>
Date: Thu, 26 Feb 2026 21:52:40 +0600
Subject: [PATCH] docs: align list formatting and improve emphasis
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Aligns list formatting, replaces the “Helpful” block with an
IMPORTANT note for better visibility, and removes the separate
example file by inlining the single relevant line directly
in the documentation.
---
 .../src/app/app.component.avoid.html            |  3 ---
 .../src/app/highlight.directive.0.ts            |  7 -------
 .../guide/directives/attribute-directives.md    | 17 +++++++++++++----
 3 files changed, 13 insertions(+), 14 deletions(-)
 delete mode 100644 adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html
 delete mode 100644 adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts

diff --git a/adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html b/adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html
deleted file mode 100644
index 8abadb1242e..00000000000
--- a/adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<!-- #docregion unsupported -->
-<p app:Highlight>This is invalid</p>
-<!-- #enddocregion unsupported  -->
diff --git a/adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts b/adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts
deleted file mode 100644
index e87c77b34e5..00000000000
--- a/adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// #docregion
-import {Directive} from '@angular/core';
-
-@Directive({
-  selector: '[appHighlight]',
-})
-export class HighlightDirective {}
diff --git a/adev/src/content/guide/directives/attribute-directives.md b/adev/src/content/guide/directives/attribute-directives.md
index f5af756de71..0edbeb78b40 100644
--- a/adev/src/content/guide/directives/attribute-directives.md
+++ b/adev/src/content/guide/directives/attribute-directives.md
@@ -14,7 +14,14 @@ This section walks you through creating a highlight directive that sets the back
 
    The CLI creates `src/app/highlight.directive.ts`, a corresponding test file `src/app/highlight.directive.spec.ts`.
 
-   <docs-code header="highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts"/>
+   ```angular-ts
+   import {Directive} from '@angular/core';
+
+   @Directive({
+     selector: '[appHighlight]',
+   })
+   export class HighlightDirective {}
+   ```
 
    The `@Directive()` decorator's configuration property specifies the directive's CSS attribute selector, `[appHighlight]`.
 
@@ -25,11 +32,13 @@ This section walks you through creating a highlight directive that sets the back
 
 1. Add logic to the `HighlightDirective` class that sets the background to yellow.
 
-<docs-code header="highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.1.ts"/>
+   <docs-code header="highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.1.ts"/>
 
-HELPFUL: Directives _do not_ support namespaces.
+IMPORTANT: Directives _do not_ support namespaces.
 
-<docs-code header="app.component.avoid.html (unsupported)" path="adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html" region="unsupported"/>
+```angular-html {avoid}
+<p app:Highlight>This is invalid</p>
+```
 
 ## Applying an attribute directive