Add style for game creation

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor

@@ -72,6 +72,9 @@
         <div id="label-description">@ResourcesKey.Description :</div>
         <InputTextArea class="description" @bind-Value=GameDto.Description />
     </div>
+    <div class="bottom-container">
+        <ValidationSummary class="invalid-content" />
+
     <div class="buttons">
         <button type="reset" class="cancel" @onclick=HandleOnCancel>
             @ResourcesKey.Reset
@@ -80,4 +83,5 @@
             @ResourcesKey.Save
         </button>
     </div>
+    </div>
 </EditForm>

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.css

@@ -1,6 +1,7 @@
 .game-form {
     display: flex;
     flex-direction: row;
+    justify-content: space-between;
     gap: 20px;
 }
 
@@ -35,10 +36,14 @@
     color: var(--white);
 }
 
-    ::deep input[type="date"]::-webkit-calendar-picker-indicator {
-        filter: invert(1);
-        cursor: pointer;
-    }
+::deep input[type="date"]::-webkit-calendar-picker-indicator {
+    filter: invert(1);
+    cursor: pointer;
+}
+
+::deep input[type="number"]::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+}
 
 ::deep textarea {
     resize: vertical;
@@ -68,6 +73,43 @@
     align-content: center;
 }
 
-input[type="number"]::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-}
+.bottom-container {
+    margin-top: 8px;
+    height: 28px;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+}
+
+::deep .invalid-content {
+    display: flex;
+    flex-wrap: wrap;
+    flex-shrink: 1;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    height: auto;
+    text-wrap: nowrap;
+}
+
+::deep .invalid-content li {
+    margin-right: 8px;
+}
+
+.buttons {
+    height: 100%;
+    display: flex;
+    flex-direction: row;
+    gap: 8px;
+}
+
+.buttons button {
+    border: none;
+    outline: none;
+    background: var(--violet);
+    border-radius: var(--small-radius);
+    color: var(--white);
+    font-weight: bold;
+    padding: 0 10px;
+}

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameValidation.cs

@@ -1,5 +1,5 @@
 using FluentValidation;
-using GameIdeas.Shared.Constants;
+using GameIdeas.Resources;
 using GameIdeas.Shared.Dto;
 
 namespace GameIdeas.BlazorApp.Pages.Games.Components;
@@ -9,17 +9,10 @@ public class GameValidation : AbstractValidator<GameDto>
     public GameValidation()
     {
         RuleFor(g => g.Title)
-            .NotEmpty()
-            .NotNull()
-            .Matches(GlobalConstants.RegexName);
-
-        RuleFor(g => g.ReleaseDate)
-            .NotEmpty()
-            .NotNull();
+            .NotEmpty().WithMessage(ResourcesKey.InvalidTitle);
 
         RuleFor(g => g.Interest)
-            .NotNull()
-            .GreaterThanOrEqualTo(1)
-            .LessThanOrEqualTo(5);
+            .GreaterThanOrEqualTo(1).WithMessage(ResourcesKey.InvalidInterest)
+            .LessThanOrEqualTo(5).WithMessage(ResourcesKey.InvalidInterest);
     }
 }