TopRow ist jetzt Komponente, Experimente mit Cards

CocktailWeb/Pages/Cocktails.razor

@@ -1,12 +1,20 @@
 @page "/cocktails"
 @using CocktailWeb.Data
+@using Microsoft.AspNetCore.Components.Sections
 @using Microsoft.EntityFrameworkCore
 @inject IDbContextFactory<DbDataContext> DataContextFactory;
 @inject IWebHostEnvironment env;
+@layout SideScrollLayout
 <!--<h3>Cocktails</h3>-->
-<a href="/cocktails/add">Cocktail hinzufügen</a>
-
 
+<SectionContent SectionId="TopRow.Title">
+    <label>Cocktails</label>
+</SectionContent>
+<!--
+<p>
+    <a href="/cocktails/add">Cocktail hinzufügen</a>
+</p>
+-->
 <div class="container py-2 border border-5 overflow-auto d-inline-block">
     <div class="row flex-nowrap">
         @foreach (Cocktail c in CocktailListe)
@@ -20,7 +28,7 @@
                         }
                         else
                         {
-                            <img class="card-img-top" src="@($"/img/cocktail-default.jpg")" alt="@c.Name">
+                            <img class="card-img-top mh-50" src="@($"/img/cocktail-default.jpg")" alt="@c.Name">
                         }
                         <div class="card-body">
                             <h5 class="card-title">@c.Name</h5>