From a7c6b6c45cf04fea0857f4c652ea86a12b7da482 Mon Sep 17 00:00:00 2001
From: Konstantin Dinev <kdinev@mail.bw.edu>
Date: Sun, 29 Mar 2026 19:09:46 +0300
Subject: [PATCH 1/2] fix(skills): raised buttons are now contained

---
 .../references/directives.md                           | 10 +++++-----
 .../igniteui-angular-components/references/feedback.md |  4 ++--
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/skills/igniteui-angular-components/references/directives.md b/skills/igniteui-angular-components/references/directives.md
index a840ade7d71..9dae090f91b 100644
--- a/skills/igniteui-angular-components/references/directives.md
+++ b/skills/igniteui-angular-components/references/directives.md
@@ -23,7 +23,7 @@ import { IgxIconComponent } from 'igniteui-angular/icon';
 ```html
 <!-- Text buttons -->
 <button igxButton="flat">Flat</button>
-<button igxButton="raised">Raised</button>
+<button igxButton="contained">Raised</button>
 <button igxButton="outlined">Outlined</button>
 <button igxButton="fab">
   <igx-icon>add</igx-icon>
@@ -35,10 +35,10 @@ import { IgxIconComponent } from 'igniteui-angular/icon';
 <button igxIconButton="contained"><igx-icon>save</igx-icon></button>
 
 <!-- Disabled state -->
-<button igxButton="raised" [disabled]="isLoading()">Submit</button>
+<button igxButton="contained" [disabled]="isLoading()">Submit</button>
 ```
 
-Button variants for `igxButton`: `'flat'`, `'raised'`, `'outlined'`, `'fab'`.
+Button variants for `igxButton`: `'flat'`, `'contained'`, `'outlined'`, `'fab'`.
 Button variants for `igxIconButton`: `'flat'`, `'outlined'`, `'contained'`.
 
 ## Button Group
@@ -166,14 +166,14 @@ import { IgxRippleDirective } from 'igniteui-angular/directives';
 
 ```html
 <!-- Add to any clickable element for Material-style ink ripple -->
-<button igxButton="raised" igxRipple>Click me</button>
+<button igxButton="contained" igxRipple>Click me</button>
 <div igxRipple igxRippleTarget=".my-class" class="custom-surface">Interactive div</div>
 ```
 
 Inputs: `[igxRipple]` (ripple color), `[igxRippleCentered]` (always start from center), `[igxRippleDisabled]`.
 
 ```html
-<button igxButton="raised" igxRipple="#ff4081" [igxRippleCentered]="true">Pink ripple</button>
+<button igxButton="contained" igxRipple="#ff4081" [igxRippleCentered]="true">Pink ripple</button>
 ```
 
 ## Tooltip
diff --git a/skills/igniteui-angular-components/references/feedback.md b/skills/igniteui-angular-components/references/feedback.md
index 324df64d81d..3e65adb6d17 100644
--- a/skills/igniteui-angular-components/references/feedback.md
+++ b/skills/igniteui-angular-components/references/feedback.md
@@ -34,11 +34,11 @@ import { IgxButtonDirective } from 'igniteui-angular/directives';
   <p>Are you sure you want to delete this item? This action cannot be undone.</p>
   <div igxDialogActions>
     <button igxButton="flat" (click)="confirmDialog.close()">Cancel</button>
-    <button igxButton="raised" (click)="deleteItem(); confirmDialog.close()">Delete</button>
+    <button igxButton="contained" (click)="deleteItem(); confirmDialog.close()">Delete</button>
   </div>
 </igx-dialog>
 
-<button igxButton="raised" (click)="confirmDialog.open()">Delete Item</button>
+<button igxButton="contained" (click)="confirmDialog.open()">Delete Item</button>
 ```
 
 Programmatic control:

From fedcea9f69dfe5764a60a31acb540fb794eba0cb Mon Sep 17 00:00:00 2001
From: Konstantin Dinev <kdinev@infragistics.com>
Date: Sun, 29 Mar 2026 19:18:25 +0300
Subject: [PATCH 2/2] Update
 skills/igniteui-angular-components/references/directives.md

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 skills/igniteui-angular-components/references/directives.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/skills/igniteui-angular-components/references/directives.md b/skills/igniteui-angular-components/references/directives.md
index 9dae090f91b..e32b2cb0571 100644
--- a/skills/igniteui-angular-components/references/directives.md
+++ b/skills/igniteui-angular-components/references/directives.md
@@ -23,7 +23,7 @@ import { IgxIconComponent } from 'igniteui-angular/icon';
 ```html
 <!-- Text buttons -->
 <button igxButton="flat">Flat</button>
-<button igxButton="contained">Raised</button>
+<button igxButton="contained">Contained</button>
 <button igxButton="outlined">Outlined</button>
 <button igxButton="fab">
   <igx-icon>add</igx-icon>