Added theme switching

src/app/hero/hero.component.ts

@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import { Component, computed, input, output } from '@angular/core';
 
 @Component({
   selector: 'app-hero',
@@ -8,5 +8,13 @@ import { Component } from '@angular/core';
   styleUrl: './hero.component.scss'
 })
 export class HeroComponent {
+  theme= input<string>();
+  isDarkMode = computed(() => {
+    return this.theme() === 'dark';
+  });
+  themeChange = output<string>();
 
+  public themeClicked(event: any) {
+    this.themeChange.emit(event.target.checked ? 'dark' : 'light');
+  }
 }