add nucleus box

Author: lucasferreiralimax

src/app/example/example.component.html

@@ -1,6 +1,4 @@
-<div class="content">
-  <angular-vlibras />
-  <h2>Usage Example</h2>
+<nucleus-box title="Usage Example">
   <angular-vlibras />
 
   <h3>Widget Position</h3>
@@ -33,4 +31,4 @@ <h3>Available Avatar Options</h3>
   <h3>Opacity</h3>
   <p>To adjust the widget's opacity, use the <code>opacity</code> attribute:</p>
   <pre><code>&lt;angular-vlibras opacity="0.8" /&gt;</code></pre>
-</div>
+</nucleus-box>

src/app/example/example.component.ts

@@ -1,10 +1,11 @@
 import { Component } from '@angular/core';
+import { NucleusBox } from 'nucleus-angular';
 import { AngularVlibras } from '../../../projects/angular-vlibras/src/public-api';
 
 @Component({
   selector: 'example-vlibras',
   standalone: true,
-  imports: [AngularVlibras],
+  imports: [AngularVlibras, NucleusBox],
   templateUrl: './example.component.html',
   styleUrl: './example.component.scss',
 })