PROUT
+
+
{
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor
deleted file mode 100644
index 1ddac6b..0000000
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor
+++ /dev/null
@@ -1,13 +0,0 @@
-@typeparam TItem
-
-
-{
- [Parameter] public TItem? Value { get; set; }
- [Parameter] public EventCallback ValueChanged { get; set; }
- [Parameter] public IEnumerable Items { get; set; } = [];
- [Parameter] public Func? LabelSelector { get; set; }
- [Parameter] public DropdownTheme Theme { get; set; }
-
- private bool ContentVisile = false;
- private DateTime ContentLastFocusOut = DateTime.Now;
- private ElementReference Content;
-
- public async Task OpenAsync()
- {
- if (DateTime.Now - ContentLastFocusOut >= TimeSpan.FromSeconds(0.2))
- {
- await Content.FocusAsync();
- ContentVisile = true;
- }
- }
-
- public void Close() => ContentVisile = false;
-
- private void HandleDropdownAddFocusOut()
- {
- ContentLastFocusOut = DateTime.Now;
- ContentVisile = false;
- }
-
- private async Task HandleItemClicked() => await ValueChanged.InvokeAsync(Value);
-
-}
\ No newline at end of file
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor.css
deleted file mode 100644
index 253d8f6..0000000
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor.css
+++ /dev/null
@@ -1,33 +0,0 @@
-.dropdown-content {
- overflow: hidden;
- display: flex;
- flex-direction: column;
- border-radius: var(--small-radius);
- position: fixed;
- animation-name: fade-in;
- animation-duration: 0.4s;
- margin-top: 4px;
-}
-
-.drowdown-element {
- width: fit-content;
-}
-
- .drowdown-element:hover {
- cursor: pointer;
- }
-
-.invisible {
- display: none;
-}
-
-.dropdown-content.navigation {
- gap: 4px;
- background: var(--violet);
- box-shadow: var(--drop-shadow);
- padding: 4px 6px;
-}
-
- .drowdown-element.navigation:hover {
- color: var(--light-grey);
- }
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownTheme.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownTheme.cs
deleted file mode 100644
index e225ac5..0000000
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownTheme.cs
+++ /dev/null
@@ -1,7 +0,0 @@
-namespace GameIdeas.BlazorApp.Shared.Components.Dropdown;
-
-public enum DropdownTheme
-{
- Navigation,
- Account
-}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor
new file mode 100644
index 0000000..e921fb2
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor
@@ -0,0 +1,30 @@
+ TextChanged { get; set; }
+ [Parameter] public EventCallback ClearClicked { get; set; }
+ [Parameter] public EventCallback SearchClicked { get; set; }
+ [Parameter] public SearchInputIcon Icon { get; set; }
+
+ protected override void OnInitialized()
+ {
+ Text = string.Empty;
+ }
+
+ public void SetText(string str)
+ {
+ Text = str;
+ }
+
+ private async Task HandleTextChanged()
+ {
+ await TextChanged.InvokeAsync(Text);
+ }
+
+ private async Task HandleClearClicked()
+ {
+ Text = string.Empty;
+ await TextChanged.InvokeAsync(string.Empty);
+ await ClearClicked.InvokeAsync();
+ }
+ private async Task HandleSearchClicked()
+ {
+ await TextChanged.InvokeAsync(Text);
+ await SearchClicked.InvokeAsync();
+ }
+}
\ No newline at end of file
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor.css
new file mode 100644
index 0000000..17aca87
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor.css
@@ -0,0 +1,58 @@
+.search-container {
+ display: flex;
+ flex-direction: row;
+ gap: 4px;
+ height: 28px;
+ padding-left: 8px;
+ padding-right: 2px;
+ border-radius: var(--small-radius);
+ background: var(--black);
+ overflow: hidden;
+ align-items: center;
+ width: 140px;
+}
+
+::deep .search-field {
+ border: none !important;
+ outline: none !important;
+ background: none !important;
+ color: var(--white);
+ height: 100%;
+ padding: 0;
+ min-width: 0;
+}
+
+.clear-icon {
+ min-height: 18px;
+ min-width: 18px;
+ height: 18px;
+ width: 18px;
+}
+
+ .clear-icon:hover {
+ cursor: pointer;
+ }
+
+ .clear-icon svg {
+ fill: var(--white);
+ }
+
+.search-icon {
+ min-height: 24px;
+ min-width: 24px;
+ height: 24px;
+ width: 24px;
+}
+
+ .search-icon:hover {
+ cursor: pointer;
+ }
+
+ .search-icon svg {
+ fill: var(--white);
+ }
+
+ .search-icon.dropdown svg {
+ fill: var(--violet);
+ transform: scale(.8, .5);
+ }
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInputIcon.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInputIcon.cs
new file mode 100644
index 0000000..3f731f2
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInputIcon.cs
@@ -0,0 +1,7 @@
+namespace GameIdeas.BlazorApp.Shared.Components.Search;
+
+public enum SearchInputIcon
+{
+ Search,
+ Dropdown
+}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor
new file mode 100644
index 0000000..837f2ad
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor
@@ -0,0 +1,15 @@
+@typeparam TItem
+
+
+{
+ [Parameter] public EventCallback?> ValueChanged { get; set; }
+ [Parameter] public SelectElement? Value { get; set; }
+ [Parameter] public SelectListTheme Theme { get; set; }
+ private async Task HandleItemClicked()
+ {
+ if (Value == null)
+ {
+ return;
+ }
+
+ Value.IsSelected = true;
+ StateHasChanged();
+ await ValueChanged.InvokeAsync(Value);
+ }
+}
\ No newline at end of file
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.css
new file mode 100644
index 0000000..8f975aa
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.css
@@ -0,0 +1,67 @@
+.select-element {
+ display: flex;
+ flex-direction: row;
+ width: fit-content;
+ width: 100%;
+ gap: 6px;
+ height: 20px;
+ align-items: center;
+}
+
+ .select-element:hover {
+ cursor: pointer;
+ }
+
+.selected {
+ width: 12px;
+ min-width: 12px;
+ height: 12px;
+ min-height: 12px;
+}
+
+.selected svg {
+ display: block;
+ fill: var(--white)
+}
+
+/***** Navigation Theme *****/
+.navigation {
+ padding: 4px 8px;
+}
+ .navigation:hover {
+ background: var(--violet-selected);
+ }
+
+ .navigation .selected {
+ display: none;
+ }
+
+/***** Sort Theme *****/
+.sort {
+ padding: 2px 6px;
+}
+
+ .sort:hover {
+ background: var(--low-white);
+ }
+
+ .sort .select-label {
+ text-wrap: nowrap;
+ margin-right: 6px;
+ }
+
+/***** Filter Theme *****/
+.filter {
+ padding: 2px 6px;
+}
+
+ .filter:hover {
+ background: var(--low-white);
+ }
+
+ .filter .select-label {
+ text-wrap: nowrap;
+ margin-right: 6px;
+ }
+
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectElement.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectElement.cs
new file mode 100644
index 0000000..5e0e8f4
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectElement.cs
@@ -0,0 +1,9 @@
+namespace GameIdeas.BlazorApp.Shared.Components.Select.Models;
+
+public class SelectElement
+{
+ public TItem? Item { get; set; }
+ public string? Label { get; set; }
+ public bool IsSelected { get; set; } = false;
+ public bool IsNew { get; set; } = false;
+}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectTheme.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectTheme.cs
new file mode 100644
index 0000000..f0c1d1f
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectTheme.cs
@@ -0,0 +1,8 @@
+namespace GameIdeas.BlazorApp.Shared.Components.Select.Models;
+
+public enum SelectListTheme
+{
+ Navigation,
+ Sort,
+ Filter
+}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor
new file mode 100644
index 0000000..c9495fc
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor
@@ -0,0 +1,33 @@
+@using GameIdeas.BlazorApp.Shared.Components.Search
+@using GameIdeas.BlazorApp.Shared.Components.Select.Components
+@typeparam TItem
+
+
+{
+ [Parameter] public IEnumerable? Values { get; set; }
+ [Parameter] public EventCallback?> ValuesChanged { get; set; }
+ [Parameter] public IEnumerable> Items { get; set; } = [];
+ [Parameter] public SelectListTheme Theme { get; set; }
+ [Parameter] public bool AlignRight { get; set; }
+
+ private bool IsContentOpen
+ {
+ get => InputFocus || ContentFocus;
+ }
+
+ private bool InputFocus = false;
+ private bool ContentFocus = false;
+ private SearchInput? SearchInput;
+ private ElementReference ContentElement;
+ private ElementReference BaseElement;
+
+ private async Task HandleItemClicked(SelectElement selectedValue)
+ {
+ Values = Items.Where(x => x.IsSelected && x.Item != null).Select(x => x.Item!);
+ SearchInput?.SetText(string.Join(", ", Values));
+ await ValuesChanged.InvokeAsync(Values);
+ }
+
+ private async Task HandleTextChanged()
+ {
+ await BaseElement.FocusAsync();
+ }
+
+ private void HandleFocusIn()
+ {
+ InputFocus = true;
+ }
+
+ private void HandleContentFocusIn()
+ {
+ ContentFocus = true;
+ }
+
+ private async Task HandleContentFocusOut()
+ {
+ await Task.Delay(TimeSpan.FromSeconds(0.3));
+ ContentFocus = false;
+ }
+
+ private async Task HandleFocusOut()
+ {
+ await Task.Delay(TimeSpan.FromSeconds(0.3));
+ InputFocus = false;
+ }
+
+ private async Task HandleSearchClicked()
+ {
+ if (!IsContentOpen)
+ {
+ await ContentElement.FocusAsync();
+ }
+ else
+ {
+ await BaseElement.FocusAsync();
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.css
new file mode 100644
index 0000000..0884707
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.css
@@ -0,0 +1,49 @@
+.select-list {
+ position: relative;
+}
+
+.select-container {
+ margin-top: 4px;
+ position: absolute;
+}
+
+.align-right {
+ right: 0;
+}
+
+.select-content {
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ border-radius: var(--small-radius);
+ animation-name: fade-in;
+ animation-duration: 0.4s;
+}
+
+.line {
+ margin: 2px 6px;
+ border-bottom: 2px solid var(--low-white);
+}
+
+
+/***** Navigation Theme *****/
+.select-content.navigation {
+ background: var(--violet);
+ box-shadow: var(--drop-shadow);
+}
+
+/***** Sort Theme *****/
+.select-content.sort {
+ background: var(--semi-black);
+ box-shadow: var(--drop-shadow);
+ padding: 4px 0;
+}
+
+/***** Filter Theme *****/
+.select-content.filter {
+ background: var(--semi-black);
+ box-shadow: var(--drop-shadow);
+ padding: 4px 0;
+ min-width: 150px;
+}
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor
new file mode 100644
index 0000000..0aee122
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor
@@ -0,0 +1,37 @@
+@using GameIdeas.BlazorApp.Shared.Components.Select.Components
+@typeparam TItem
+
+
+{
+ [Parameter] public RenderFragment? Button { get; set; }
+ [Parameter] public TItem? Value { get; set; }
+ [Parameter] public EventCallback ValueChanged { get; set; }
+ [Parameter] public TItem? Header { get; set; }
+ [Parameter] public EventCallback HeaderChanged { get; set; }
+ [Parameter] public IEnumerable> Items { get; set; } = [];
+ [Parameter] public IEnumerable> Headers { get; set; } = [];
+ [Parameter] public SelectListTheme Theme { get; set; }
+ [Parameter] public bool AlignRight { get; set; }
+
+ private bool ContentVisile = false;
+ private DateTime ContentLastFocusOut = DateTime.Now;
+ private ElementReference Container;
+
+ public async Task OpenAsync()
+ {
+ if (DateTime.Now - ContentLastFocusOut >= TimeSpan.FromSeconds(0.2))
+ {
+ await Container.FocusAsync();
+ ContentVisile = true;
+ }
+ }
+
+ public void Close() => ContentVisile = false;
+
+ private async Task HandleButtonClicked() => await OpenAsync();
+
+ private void HandleFocusOut()
+ {
+ ContentLastFocusOut = DateTime.Now;
+ ContentVisile = false;
+ }
+
+ private async Task HandleItemClicked(SelectElement selectedValue)
+ {
+ foreach (var item in Items)
+ {
+ item.IsSelected = false;
+ }
+
+ selectedValue.IsSelected = true;
+ Value = selectedValue.Item;
+ await ValueChanged.InvokeAsync(Value);
+ }
+
+ private async Task HandleHeaderClicked(SelectElement selectedValue)
+ {
+ foreach (var header in Headers)
+ {
+ header.IsSelected = false;
+ }
+
+ selectedValue.IsSelected = true;
+ Header = selectedValue.Item;
+ await HeaderChanged.InvokeAsync(Header);
+ }
+}
\ No newline at end of file
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css
new file mode 100644
index 0000000..3e5473b
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css
@@ -0,0 +1,40 @@
+.select-list {
+ position: relative;
+}
+
+.select-container {
+ margin-top: 4px;
+ position: absolute;
+}
+
+.align-right {
+ right: 0;
+}
+
+.select-content {
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ border-radius: var(--small-radius);
+ animation-name: fade-in;
+ animation-duration: 0.4s;
+}
+
+.line {
+ margin: 2px 6px;
+ border-bottom: 2px solid var(--low-white);
+}
+
+
+/***** Navigation Theme *****/
+.select-content.navigation {
+ background: var(--violet);
+ box-shadow: var(--drop-shadow);
+}
+
+/***** Sort Theme *****/
+.select-content.sort {
+ background: var(--semi-black);
+ box-shadow: var(--drop-shadow);
+ padding: 4px 0;
+}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor
new file mode 100644
index 0000000..f0eb5ab
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor
@@ -0,0 +1,13 @@
+ MaxChanged { get; set; }
+ [Parameter] public int Min { get; set; }
+ [Parameter] public EventCallback MinChanged { get; set; }
+
+ private async Task HandleSlideTwoInput()
+ {
+ if (Params.ValueMax - Params.ValueMin <= Params.Gap)
+ {
+ Params.ValueMin = Params.ValueMax - Params.Gap;
+ }
+
+ Max = Params.Max;
+ await MaxChanged.InvokeAsync(Params.Max);
+ }
+
+ private async Task HandleSlideOnInput()
+ {
+ if (Params.ValueMax - Params.ValueMin <= Params.Gap)
+ {
+ Params.ValueMax = Params.ValueMin + Params.Gap;
+ }
+
+ Min = Params.Min;
+ await MinChanged.InvokeAsync(Params.Min);
+ }
+
+ private string FillColor()
+ {
+ var percent1 = (double)(Params.ValueMin - Params.Min) / (Params.Max - Params.Min) * 100;
+ var percent2 = (double)(Params.ValueMax - Params.Min) / (Params.Max - Params.Min) * 100;
+ return $"background: linear-gradient(to right, var(--light-grey) {percent1}% , var(--violet) {percent1}% , var(--violet) {percent2}%, var(--light-grey) {percent2}%)";
+ }
+
+ private string StatusColor(int value)
+ {
+ string str = "--thumb-color: var({0});";
+
+ int firstTier = (int)Math.Floor(0.33 * Params.Max);
+ int secondTier = (int)Math.Ceiling(0.66 * Params.Max);
+
+ return value switch
+ {
+ int x when x <= firstTier => string.Format(str, "--red"),
+ int x when x >= secondTier => string.Format(str, "--green"),
+ _ => string.Format(str, "--yellow"),
+ };
+ }
+}
\ No newline at end of file
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor.css
new file mode 100644
index 0000000..cf23999
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor.css
@@ -0,0 +1,86 @@
+.container {
+ position: relative;
+ width: 100%;
+}
+
+input[type="range"] {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ width: 100%;
+ outline: none;
+ margin: auto;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ background-color: transparent;
+ pointer-events: none;
+}
+
+.slider-track {
+ width: 100%;
+ height: 2px;
+ margin: auto;
+ border-radius: 2px;
+}
+
+input[type="range"]::-webkit-slider-runnable-track {
+ -webkit-appearance: none;
+ height: 2px;
+}
+
+input[type="range"]::-moz-range-track {
+ -moz-appearance: none;
+ height: 2px;
+}
+
+input[type="range"]::-ms-track {
+ appearance: none;
+ height: 2px;
+}
+
+input[type="range"]::-webkit-slider-thumb {
+ -webkit-appearance: none;
+ height: 1em;
+ width: 1em;
+ background-color: var(--thumb-color);
+ cursor: pointer;
+ margin-top: -6px;
+ pointer-events: auto;
+ border-radius: 50%;
+}
+
+input[type="range"]::-moz-range-thumb {
+ -webkit-appearance: none;
+ height: 1em;
+ width: 1em;
+ cursor: pointer;
+ border-radius: 50%;
+ background-color: var(--thumb-color);
+ pointer-events: auto;
+ border: none;
+}
+
+input[type="range"]::-ms-thumb {
+ appearance: none;
+ height: 1em;
+ width: 1em;
+ cursor: pointer;
+ border-radius: 50%;
+ background-color: var(--thumb-color);
+ pointer-events: auto;
+}
+
+.values {
+ display: flex;
+ position: absolute;
+ margin-top: 10px;
+ width: 100%;
+ font-weight: bold;
+ justify-content: space-between;
+}
+
+.value {
+ width: 1em;
+ text-align:center;
+}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRangeParams.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRangeParams.cs
new file mode 100644
index 0000000..b82f00b
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRangeParams.cs
@@ -0,0 +1,10 @@
+namespace GameIdeas.BlazorApp.Shared.Components.SliderRange;
+
+public class SliderRangeParams
+{
+ public int Min{ get; set; }
+ public int Max { get; set; }
+ public int ValueMin { get; set; }
+ public int ValueMax { get; set; }
+ public int Gap { get; set; } = 0;
+}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor.cs
deleted file mode 100644
index 722958a..0000000
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor.cs
+++ /dev/null
@@ -1,46 +0,0 @@
-using GameIdeas.BlazorApp.Pages.Games.Models;
-using GameIdeas.BlazorApp.Shared.Components.Dropdown;
-using GameIdeas.Resources;
-using Microsoft.AspNetCore.Components;
-
-namespace GameIdeas.BlazorApp.Shared.Headers;
-
-public partial class HeaderBase
-{
- [Parameter] public RenderFragment? Body { get; set; }
- [Parameter] public EventCallback AddTypeChanged { get; set; }
-
- private DropdownContent? DropdownAdd;
- private readonly IEnumerable AddTypes =
- [
- new AddTypeParams(AddType.Manual, ResourcesKey.ManualAdd),
- new AddTypeParams(AddType.Auto, ResourcesKey.AutoAdd)
- ];
-
- private AccountSettings? AccountSettings;
-
- private void HandleIconClicked()
- {
- throw new NotImplementedException();
- }
-
- private async Task HandleMoreButton()
- {
- if (DropdownAdd != null)
- {
- await DropdownAdd.OpenAsync();
- }
-
- AccountSettings?.Close();
- }
-
- private async Task HandleAddTypeClickedAsync(AddTypeParams value)
- {
- await AddTypeChanged.InvokeAsync(value.AddType);
- }
-
- private void HandleAccountClicked()
- {
- AccountSettings?.Toggle();
- }
-}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor
similarity index 55%
rename from src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor
rename to src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor
index d6c82f0..17f9cc6 100644
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor
@@ -1,11 +1,15 @@
@using GameIdeas.BlazorApp.Pages.Games
@using GameIdeas.BlazorApp.Pages.Games.Models
-@using GameIdeas.BlazorApp.Shared.Components.Dropdown
+@using GameIdeas.BlazorApp.Shared.Components.Account
+@using GameIdeas.BlazorApp.Shared.Components.Select
+@using GameIdeas.BlazorApp.Shared.Components.Select.Models
@using GameIdeas.Resources
+@inherits LayoutComponentBase
+
+
+
-
@if (!AuthentificationService.IsLogin)
{
@@ -36,10 +36,13 @@
else
{
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/AccountSettings.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/AccountSettings.razor.cs
similarity index 91%
rename from src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/AccountSettings.razor.cs
rename to src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/AccountSettings.razor.cs
index 97ff274..4e36135 100644
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/AccountSettings.razor.cs
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/AccountSettings.razor.cs
@@ -2,7 +2,7 @@ using GameIdeas.BlazorApp.Services;
using GameIdeas.Shared.Dto;
using Microsoft.AspNetCore.Components.Forms;
-namespace GameIdeas.BlazorApp.Shared.Headers;
+namespace GameIdeas.BlazorApp.Shared.Components.Account;
public partial class AccountSettings (
AuthentificationService AuthentificationService)
@@ -39,17 +39,17 @@ public partial class AccountSettings (
{
if (EditContext?.Validate() == false)
{
- LoginDto.Password = string.Empty;
return;
}
IsLoading = true;
await Task.Delay(TimeSpan.FromSeconds(5));
+ Close();
+ AuthentificationService.Login();
IsLoading = false;
LoginDto = new();
- Close();
- AuthentificationService.Login();
+ EditContext = new EditContext(LoginDto);
}
private void HandleLogoutClicked()
{
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/AccountSettings.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/AccountSettings.razor.css
similarity index 89%
rename from src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/AccountSettings.razor.css
rename to src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/AccountSettings.razor.css
index de479fc..6a651ee 100644
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/AccountSettings.razor.css
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/AccountSettings.razor.css
@@ -4,8 +4,8 @@
position: fixed;
animation-name: fade-in;
animation-duration: 0.4s;
- border: 2px solid var(--light-grey);
- background: var(--black);
+ border: 2px solid var(--low-white);
+ background: var(--semi-black);
right: 10px;
margin-top: 4px;
}
@@ -17,7 +17,7 @@
.login-form {
display: flex;
flex-direction: column;
- padding: 20px 6px;
+ padding: 20px 8px;
gap: 20px;
max-width: 400px;
}
@@ -30,8 +30,8 @@
}
::deep .input-text {
- background: var(--light-grey);
- border: 2px solid rgb(255, 255, 255, 0.3);
+ background: var(--low-white);
+ border: 2px solid var(--low-white);
border-radius: var(--small-radius);
padding: 6px;
color: var(--white);
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/LoginValidator.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/LoginValidator.cs
similarity index 85%
rename from src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/LoginValidator.cs
rename to src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/LoginValidator.cs
index 931bd7b..629c3c9 100644
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/LoginValidator.cs
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Account/LoginValidator.cs
@@ -1,7 +1,7 @@
using FluentValidation;
using GameIdeas.Shared.Dto;
-namespace GameIdeas.BlazorApp.Shared.Headers;
+namespace GameIdeas.BlazorApp.Shared.Components.Account;
public class LoginValidator : AbstractValidator
+
}
+ @ResourcesKey.UserManager
+
+
@ResourcesKey.Logout
- @* *@
-
\ No newline at end of file
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor.cs
deleted file mode 100644
index 97c8b71..0000000
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Dropdown/DropdownContent.razor.cs
+++ /dev/null
@@ -1,36 +0,0 @@
-using Microsoft.AspNetCore.Components;
-
-namespace GameIdeas.BlazorApp.Shared.Components.Dropdown;
-
-public partial class DropdownContent
- @foreach (var item in Items)
- {
-
-
- @(LabelSelector != null ? LabelSelector.Invoke(item) : item?.ToString())
-
- }
-
+
+
+ @if (!string.IsNullOrEmpty(Text))
+ {
+
+ }
+
+
+
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor.cs
new file mode 100644
index 0000000..d8f6e14
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor.cs
@@ -0,0 +1,39 @@
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Shared.Components.Search;
+
+public partial class SearchInput
+{
+ [Parameter] public string? Text { get; set; }
+ [Parameter] public EventCallback
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.cs
new file mode 100644
index 0000000..917c9a6
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.cs
@@ -0,0 +1,22 @@
+using GameIdeas.BlazorApp.Shared.Components.Select.Models;
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Shared.Components.Select.Components;
+
+public partial class SelectListElement
+ @if (Value != null && Value.IsSelected)
+ {
+
+ }
+
+
+ @Value?.Label
+
+
+
+
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.cs
new file mode 100644
index 0000000..5d5e07c
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.cs
@@ -0,0 +1,71 @@
+using GameIdeas.BlazorApp.Shared.Components.Search;
+using GameIdeas.BlazorApp.Shared.Components.Select.Models;
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Shared.Components.Select;
+
+public partial class MultipleSelectList
+
+ @if (IsContentOpen)
+ {
+
+
+ @foreach (var item in Items)
+ {
+
+ }
+
+
+
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.cs
new file mode 100644
index 0000000..59423dd
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.cs
@@ -0,0 +1,64 @@
+using GameIdeas.BlazorApp.Shared.Components.Select.Models;
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Shared.Components.Select;
+
+public partial class SelectList
+
+ @if (ContentVisile)
+ {
+
+
+ @foreach (var item in Headers)
+ {
+
+ }
+
+
+
+
+
+
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor.cs
new file mode 100644
index 0000000..bdc2846
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor.cs
@@ -0,0 +1,57 @@
+using Microsoft.AspNetCore.Components;
+using System.Threading.Tasks;
+
+namespace GameIdeas.BlazorApp.Shared.Components.SliderRange;
+
+public partial class SliderRange
+{
+ [Parameter] public SliderRangeParams Params { get; set; } = new();
+ [Parameter] public int Max { get; set; }
+ [Parameter] public EventCallback
+ @Params.ValueMin
+ @Params.ValueMax
+
+
- 
+
@Body
@@ -18,21 +22,23 @@
+
-
+
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor.cs
new file mode 100644
index 0000000..f3e335a
--- /dev/null
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor.cs
@@ -0,0 +1,34 @@
+using GameIdeas.BlazorApp.Pages.Games.Models;
+using GameIdeas.BlazorApp.Shared.Components.Account;
+using GameIdeas.BlazorApp.Shared.Components.Select.Models;
+using GameIdeas.Resources;
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Shared.Layouts.Header;
+
+public partial class HeaderLayout : LayoutComponentBase
+{
+ [Parameter] public EventCallback AddTypeChanged { get; set; }
+
+ private readonly IEnumerable> SelectElements = [
+ new SelectElement { Item = AddType.Manual, Label = ResourcesKey.ManualAdd },
+ new SelectElement { Item = AddType.Auto, Label = ResourcesKey.AutoAdd }
+ ];
+
+ private AccountSettings? AccountSettings;
+
+ private void HandleIconClicked()
+ {
+ throw new NotImplementedException();
+ }
+
+ private async Task HandleAddTypeClickedAsync(AddType value)
+ {
+ await AddTypeChanged.InvokeAsync(value);
+ }
+
+ private void HandleAccountClicked()
+ {
+ AccountSettings?.Toggle();
+ }
+}
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor.css
similarity index 98%
rename from src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor.css
rename to src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor.css
index 3648621..7661644 100644
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Headers/HeaderBase.razor.css
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Layouts/Header/HeaderLayout.razor.css
@@ -42,7 +42,7 @@
flex-direction: row;
background: var(--violet);
border-radius: var(--small-radius);
- overflow: hidden;
+ overflow: visible;
}
.button {
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/wwwroot/css/app.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/wwwroot/css/app.css
index b9df5af..725eae6 100644
--- a/src/GameIdeas/Client/GameIdeas.BlazorApp/wwwroot/css/app.css
+++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/wwwroot/css/app.css
@@ -8,8 +8,9 @@
--yellow: #FFC107;
--green: #43F8C0;
--light-grey: #5C5C5E;
- --black: rgba(44, 43, 46, 0.8);
+ --black: rgba(0, 0, 0, 0.8);
--white: #fff;
+ --low-white: rgb(255, 255, 255, 0.1);
--semi-black: rgba(0, 0, 0, 0.5);
--line-black: rgba(0, 0, 0, 0.2);
--small-radius: 4px;
diff --git a/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs b/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs
index 2509e89..d81c880 100644
--- a/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs
+++ b/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs
@@ -10,6 +10,7 @@ public class Translations (TranslationService translationService)
public string Logout => translationService.Translate(nameof(Logout));
public string EnterUsername => translationService.Translate(nameof(EnterUsername));
public string EnterPassword => translationService.Translate(nameof(EnterPassword));
+ public string UserManager => translationService.Translate(nameof(UserManager));
}
public static class ResourcesKey
@@ -28,4 +29,5 @@ public static class ResourcesKey
public static string Logout => _instance?.Logout ?? throw new InvalidOperationException("ResourcesKey.Logout is not initialized.");
public static string EnterUsername => _instance?.EnterUsername ?? throw new InvalidOperationException("ResourcesKey.EnterUsername is not initialized.");
public static string EnterPassword => _instance?.EnterPassword ?? throw new InvalidOperationException("ResourcesKey.EnterPassword is not initialized.");
+ public static string UserManager => _instance?.UserManager ?? throw new InvalidOperationException("ResourcesKey.UserManager is not initialized.");
}
\ No newline at end of file
diff --git a/src/GameIdeas/GameIdeas.Shared/Constants/GlobalConstants.cs b/src/GameIdeas/GameIdeas.Shared/Constants/GlobalConstants.cs
new file mode 100644
index 0000000..21d357b
--- /dev/null
+++ b/src/GameIdeas/GameIdeas.Shared/Constants/GlobalConstants.cs
@@ -0,0 +1,7 @@
+namespace GameIdeas.Shared.Constants;
+
+public class GlobalConstants
+{
+ public const string EnterKeyCode = "Enter";
+ public const string PadEnterKeyCode = "NumpadEnter";
+}
diff --git a/src/GameIdeas/GameIdeas.Shared/Dto/GameDto.cs b/src/GameIdeas/GameIdeas.Shared/Dto/GameDto.cs
new file mode 100644
index 0000000..293a672
--- /dev/null
+++ b/src/GameIdeas/GameIdeas.Shared/Dto/GameDto.cs
@@ -0,0 +1,7 @@
+namespace GameIdeas.Shared.Dto;
+
+public class GameDto
+{
+ public string? Name { get; set; }
+ public string? ReleaseDate { get; set; }
+}
\ No newline at end of file
diff --git a/src/GameIdeas/GameIdeas.Shared/Enum/SortType.cs b/src/GameIdeas/GameIdeas.Shared/Enum/SortType.cs
new file mode 100644
index 0000000..e3091cc
--- /dev/null
+++ b/src/GameIdeas/GameIdeas.Shared/Enum/SortType.cs
@@ -0,0 +1,7 @@
+namespace GameIdeas.Shared.Enum;
+
+public enum SortType
+{
+ Ascending,
+ Descending
+}
diff --git a/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json b/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json
index ea987f0..5feb362 100644
--- a/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json
+++ b/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json
@@ -5,5 +5,6 @@
"Login": "Se connecter",
"Logout": "Se déconnecter",
"EnterUsername": "Nom d'utilisateur",
- "EnterPassword": "Mot de passe"
+ "EnterPassword": "Mot de passe",
+ "UserManager": "Gestion des utilisateurs"
}
\ No newline at end of file