update with NucleusBox

criar-art · Oct 26, 2024 · 7323368 · 7323368
1 parent 276b9be
commit 7323368
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 6 deletions.
diff --git a/src/app/list-techs/list-techs.component.html b/src/app/list-techs/list-techs.component.html
@@ -1,5 +1,4 @@
-<div class="content">
-  <h2>List of techs</h2>
+<nucleus-box title="List of techs">
   <input
     class="input-search"
     type="text"
@@ -27,4 +26,4 @@ <h2>List of techs</h2>
       <p>No logos found matching your search.</p>
     </div>
   }
-</div>
+</nucleus-box>
diff --git a/src/app/list-techs/list-techs.component.scss b/src/app/list-techs/list-techs.component.scss
@@ -0,0 +1,17 @@
+.input-search {
+  padding: 1rem;
+  margin: 1rem 0;
+  margin-top: 1rem;
+  border-radius: 10px;
+  background: var(--vtl-background);
+  border: 2px solid var(--vtl-background);
+  color: var(--color-text);
+  width: 100%;
+}
+
+.not-found {
+  display: flex;
+  flex-direction: column-reverse;
+  justify-content: center;
+  align-items: center;
+}
diff --git a/src/app/list-techs/list-techs.component.ts b/src/app/list-techs/list-techs.component.ts
@@ -1,13 +1,18 @@
 import { Component, effect, signal } from '@angular/core';
 import { FormsModule } from '@angular/forms';
-import { AngularTechsLogosModule, Tech, techs } from '../../../projects/angular-techs-logos/src/public-api';
+import { NucleusBox } from 'nucleus-angular';
+import {
+  AngularTechsLogosModule,
+  Tech,
+  techs,
+} from '../../../projects/angular-techs-logos/src/public-api';
 
 @Component({
   selector: 'list-techs',
   standalone: true,
-  imports: [AngularTechsLogosModule, FormsModule],
+  imports: [AngularTechsLogosModule, FormsModule, NucleusBox],
   templateUrl: './list-techs.component.html',
-  styleUrl: './list-techs.component.scss'
+  styleUrl: './list-techs.component.scss',
 })
 export class ListTechsComponent {
   techs: Tech[] = techs;