From add64f763fe2313fc3025ff194277f5bb11a5408 Mon Sep 17 00:00:00 2001
From: Christopher Schreiner <cs@elunic.com>
Date: Sat, 8 Jun 2024 22:11:10 +0200
Subject: [PATCH] chore: css optimizations

---
 .../anime/details/streams/streams.component.html    |  4 ++--
 .../app/anime/details/streams/streams.component.ts  | 13 ++++++++-----
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/frontend/src/app/anime/details/streams/streams.component.html b/frontend/src/app/anime/details/streams/streams.component.html
index 800c5b8..ff24c08 100644
--- a/frontend/src/app/anime/details/streams/streams.component.html
+++ b/frontend/src/app/anime/details/streams/streams.component.html
@@ -1,7 +1,7 @@
-<div class="streams">
+<div class="streams d-flex flex-column gap-3 m-3">
   <a
     href="{{ stream.url }}"
-    class="align-items-center d-flex m-3"
+    class="align-items-center d-flex rounded"
     target="_blank"
     style="gap: 1rem; text-decoration: none"
     *ngFor="let stream of streams"
diff --git a/frontend/src/app/anime/details/streams/streams.component.ts b/frontend/src/app/anime/details/streams/streams.component.ts
index f846686..8ee074c 100644
--- a/frontend/src/app/anime/details/streams/streams.component.ts
+++ b/frontend/src/app/anime/details/streams/streams.component.ts
@@ -4,11 +4,14 @@ import { LegacyStream } from '@services/anime/livechart.service';
 @Component({
   selector: 'myanili-anime-streams',
   templateUrl: './streams.component.html',
-  // styles: [`
-  //   .streams {
-  //     display: grid;
-  //   }
-  // `],
+  styles: [
+    `
+      .streams > a:hover {
+        background-color: rgba(var(--bs-secondary-rgb), 0.1);
+        outline: 0.75rem solid rgba(var(--bs-secondary-rgb), 0.1);
+      }
+    `,
+  ],
 })
 export class StreamsComponent implements OnInit {
   @Input() streams: LegacyStream[] = [];