Add hover and active sample

mhrastegari · Feb 14, 2023 · 93868ac · 93868ac
1 parent 585f099
commit 93868ac
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/Pages/FetchData.razor b/Pages/FetchData.razor
@@ -25,7 +25,7 @@ else
         <tbody>
             @foreach (var forecast in forecasts)
             {
-                <tr>
+                <tr class="table-item">
                     <td>@forecast.Date.ToShortDateString()</td>
                     <td>@forecast.TemperatureC</td>
                     <td>@forecast.TemperatureF</td>

diff --git a/wwwroot/styles/app.css b/wwwroot/styles/app.css
@@ -56,9 +56,15 @@ html, body {
     flex-direction: column;
 }
 
+.table-item:hover {
+    background-color: whitesmoke;
+}
 
-/* Default Blazor styles */
+.table-item:active {
+    background-color: lightgray;
+}
 
+/* Default Blazor styles */
 *,
 *::after,
 *::before {