From 5633ef9b06d0c5a96e77f89455dc29f8b030ceac Mon Sep 17 00:00:00 2001
From: Maxime Adler <madler@sqli.com>
Date: Wed, 16 Apr 2025 16:22:30 +0200
Subject: [PATCH] Add style for rows

---
 .../Pages/Games/Components/GameRow.razor.css  | 40 ++++++++++++++++++-
 1 file changed, 38 insertions(+), 2 deletions(-)

diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameRow.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameRow.razor.css
index 31b603a..ad76215 100644
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameRow.razor.css
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameRow.razor.css
@@ -1,6 +1,7 @@
 .row {
     display: grid;
     grid-template-columns: 48px 5fr 70px 2fr 3fr 60px 30px 30px;
+    grid-gap: 8px;
     text-wrap: nowrap;
     height: 64px;
     background: var(--input-secondary);
@@ -14,6 +15,10 @@
     font-weight: bold;
 }
 
+.release-date, .storage, .max-value {
+    color: rgb(184, 184, 184);
+}
+
 .pill {
     width: fit-content;
     height: 24px;
@@ -31,9 +36,40 @@
 .platform-pill {
     color: var(--violet); 
     cursor: pointer;
-
+    text-decoration: none;
 }
 
     .platform-pill:hover {
         text-decoration: underline;
-    }
\ No newline at end of file
+    }
+
+.detail {
+    transform: scale(0.8, 1.2) rotate(-90deg);
+    background: none;
+    border: none;
+    outline: none;
+    cursor: pointer;
+}
+
+::deep .detail svg {
+    fill: var(--white);
+}
+
+.value {
+    font-size: 24px;
+    font-weight: bold;
+}
+
+.max-value {
+    translate: 0 200px;
+}
+
+@media screen and (max-width: 800px) {
+    .row {
+        grid-template-columns: 48px 5fr 2fr 3fr 30px 30px;
+    }
+
+    .release-date, .storage {
+        display: none;
+    }
+}
\ No newline at end of file