Fix lint, make design more consistent, add license texts,

toju-app/src/app/domains/theme/feature/theme-picker-overlay.component.ts

@@ -12,41 +12,11 @@ import { ThemeRegistryService } from '../application/theme-registry.service';
   selector: 'app-theme-picker-overlay',
   standalone: true,
   imports: [CommonModule],
-  template: `
-    @if (picker.isPicking()) {
-      <div class="pointer-events-none fixed inset-x-0 bottom-4 z-[95] flex justify-center px-4">
-        <div class="pointer-events-auto max-w-xl rounded-2xl border border-border bg-card/95 px-4 py-3 shadow-2xl backdrop-blur-xl">
-          <div class="flex flex-wrap items-center gap-3">
-            <div class="min-w-0 flex-1">
-              <p class="text-xs font-semibold uppercase tracking-[0.18em] text-primary">Theme Picker Active</p>
-              <p class="mt-1 text-sm text-foreground">
-                Click a highlighted area to inspect its theme key.
-              </p>
-              <p class="mt-1 text-xs text-muted-foreground">
-                Hovering:
-                <span class="font-medium text-foreground">{{ hoveredEntry()?.label || 'Move over a themeable region' }}</span>
-                @if (hoveredEntry()) {
-                  <span class="ml-1 rounded-full bg-secondary px-2 py-0.5 font-mono text-[11px] text-foreground/80">{{ hoveredEntry()!.key }}</span>
-                }
-              </p>
-            </div>
-
-            <button
-              type="button"
-              (click)="cancel()"
-              class="inline-flex items-center rounded-full border border-border bg-secondary px-3 py-2 text-sm font-medium text-foreground transition-colors hover:bg-secondary/80"
-            >
-              Cancel
-            </button>
-          </div>
-        </div>
-      </div>
-    }
-  `
+  templateUrl: './theme-picker-overlay.component.html'
 })
 export class ThemePickerOverlayComponent {
   readonly picker = inject(ElementPickerService);
-  private readonly registry = inject(ThemeRegistryService);
+  readonly registry = inject(ThemeRegistryService);
 
   readonly hoveredEntry = computed(() => {
     return this.registry.getDefinition(this.picker.hoveredKey());