...dialog

API/API.csproj

@@ -8,7 +8,7 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="HotChocolate.AspNetCore" Version="14.0.0"/>
+        <PackageReference Include="HotChocolate.AspNetCore" Version="16.1.2"/>
     </ItemGroup>
 
     <ItemGroup>

Device/MauiProgram.cs

@@ -23,7 +23,9 @@ public static class MauiProgram
                 fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
             });
 
+#pragma warning disable CA1416 // BlazorWebView requires Android 23+, project targets 21+
         builder.Services.AddMauiBlazorWebView();
+#pragma warning restore CA1416
 
 #if DEBUG
         builder.Services.AddBlazorWebViewDeveloperTools();

Device/wwwroot/css/app.css

@@ -37,9 +37,7 @@
     --info-hover: #451376;
     --info-border-hover: #210b36;
 
-    --dialog-border-color: black;
-    --dialog-border-width: 2px;
-    --dialog-radius: 6px;
+    --dialog-radius: 12px;
 }
 
 html {

Pages/Dialog/ConfirmationDialogComponent.razor

@@ -2,24 +2,25 @@
 @inject IMyDialogService MyDialogService
 @inject IJSRuntime JsRuntime
 
-
 @inject NavigationManager NavigationManager
 
 @if (MyDialogService.IsVisible)
 {
-    <div class="confirmDialogBackground" onclick="@CloseDialog">
-        <div class="confirmDialogContainer"
+    <div class="dialogOverlay" onclick="@CloseDialog">
+        <div class="dialogContainer dialogConfirm"
              @onclick:preventDefault="true"
              @onclick:stopPropagation="true">
 
-            <div class="confirmDialogHeader">
-                @MyDialogService.GetDialogContents().Title
+            <div class="dialogHeader">
+                <div class="dialogTitle">@MyDialogService.GetDialogContents().Title</div>
+                <button class="dialogCloseBtn" @onclick="CloseDialog">&times;</button>
             </div>
-            <div class="confirmDialogBody">
+
+            <div class="dialogBody">
                 @MyDialogService.GetDialogContents().Message
             </div>
 
-            <div class="confirmDialogFooter">
+            <div class="dialogFooter">
                 <ButtonComponent MyButtonType="MyButtonType.Secondary"
                                  OnClick="MyDialogService.GetDialogContents().OnCancel">
                     Cancel
@@ -33,71 +34,97 @@
     </div>
 
     <style>
-        .pageContents * {
-            filter: blur(2px);
-        }
-
-        .confirmDialogBackground {
+        .dialogOverlay {
             position: fixed;
             top: 0;
             left: 0;
             width: 100vw;
             height: 100vh;
-            background-color: rgba(0, 0, 0, 0.5);
+            background-color: rgba(0, 0, 0, 0.6);
             display: flex;
+            align-items: flex-start;
+            justify-content: center;
+            z-index: 1000;
+            padding-top: 64px;
         }
 
-
-        .confirmDialogContainer {
-            margin-left: auto;
-            margin-right: auto;
-            margin-top: 64px;
-            width: 800px;
-            height: 600px;
-
-            background-color: var(--background);
-            border-width: var(--dialog-border-width);
-            border-style: solid;
-            border-color: var(--dialog-border-color);
+        .dialogContainer {
+            background-color: var(--paper);
             border-radius: var(--dialog-radius);
-
-            padding: 8px;
-
-
-            box-shadow: 1px 2px 2px black;
-
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
             display: flex;
             flex-direction: column;
-
+            max-height: calc(100vh - 128px);
+            overflow: hidden;
         }
 
-        .confirmDialogHeader {
-            font-size: 1.4em;
-            padding: 12px;
+        .dialogConfirm {
+            width: 480px;
         }
 
-        .confirmDialogBody {
-            padding: 12px;
-            flex-grow: 1;
+        .dialogHeader {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding: 16px 20px;
+            border-bottom: 1px solid var(--paper-border);
+            background-color: var(--accent);
+            border-radius: var(--dialog-radius) var(--dialog-radius) 0 0;
+            min-height: 56px;
         }
 
-        .confirmDialogFooter {
+        .dialogTitle {
+            font-size: 1.25rem;
+            font-weight: 700;
+            color: white;
+        }
+
+        .dialogCloseBtn {
+            background: none;
+            border: none;
+            color: rgba(255, 255, 255, 0.7);
+            font-size: 1.5rem;
+            cursor: pointer;
+            padding: 0;
+            line-height: 1;
+            width: 32px;
+            height: 32px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: 6px;
+            transition: background 0.15s, color 0.15s;
+        }
+
+        .dialogCloseBtn:hover {
+            background: rgba(255, 255, 255, 0.15);
+            color: white;
+        }
+
+        .dialogBody {
+            padding: 20px;
+            overflow-y: auto;
+            flex: 1;
+            color: var(--text-primary, #ddd);
+            line-height: 1.6;
+        }
+
+        .dialogFooter {
             display: flex;
             gap: 12px;
             justify-content: flex-end;
-            padding: 12px;
+            padding: 16px 20px;
+            border-top: 1px solid var(--paper-border);
+            background-color: var(--background);
+            border-radius: 0 0 var(--dialog-radius) var(--dialog-radius);
         }
-
     </style>
 }
 
-
 @code {
-
     protected override void OnInitialized()
     {
         base.OnInitialized();
-
         MyDialogService.Subscribe(() => InvokeAsync(StateHasChanged));
     }
 
@@ -106,11 +133,8 @@
         MyDialogService.Unsubscribe(() => InvokeAsync(StateHasChanged));
     }
 
-
     public void CloseDialog()
     {
         MyDialogService.Hide();
     }
-
-
 }

Pages/Dialog/EntityDialogComponent.razor

@@ -1,31 +1,30 @@
 @implements IDisposable;
 @inject IEntityDialogService entityDialogService
 
-<div class="dialogBackground" onclick="@CloseDialog">
-
-    <div class="dialogContainer"
+<div class="dialogOverlay" onclick="@CloseDialog">
+    <div class="dialogContainer entityDialog"
          @onclick:preventDefault="true"
          @onclick:stopPropagation="true">
         @if (entity == null)
         {
-            <div>Entity is null</div>
+            <div class="dialogBody">Entity is null</div>
         }
         else
         {
             <div class="dialogHeader">
-                @if (entityDialogService.HasHistory())
-                {
-                    <button class="backButton" @onclick="entityDialogService.BackDialog">
-                        <div class="backButtonIcon"></div>
-                    </button>
-                }
-
-                <div class="dialogTitle">
-                    @entity.Info().Name
+                <div class="dialogHeaderLeft">
+                    @if (entityDialogService.HasHistory())
+                    {
+                        <button class="dialogBackBtn" @onclick="entityDialogService.BackDialog" title="Back">
+                            &#8592;
+                        </button>
+                    }
+                    <div class="dialogTitle">@entity.Info().Name</div>
                 </div>
-
+                <button class="dialogCloseBtn" @onclick="CloseDialog">&times;</button>
             </div>
-            <div class="dialogContent">
+
+            <div class="dialogBody">
                 <CascadingValue Value="@entity">
                     <EntityVanguardAddedComponent/>
                     <EntityInfoComponent/>
@@ -39,105 +38,117 @@
                     <EntityWeaponsComponent/>
                     <EntityAbilitiesComponent/>
                 </CascadingValue>
-
             </div>
-            <div class="dialogFooter"></div>
         }
-
     </div>
-
 </div>
 
 <style>
-
-    .pageContents * {
-        filter: blur(2px);
-    }
-
-
-    .dialogBackground {
+    .dialogOverlay {
         position: fixed;
         top: 0;
         left: 0;
         width: 100vw;
         height: 100vh;
-        background-color: rgba(0, 0, 0, 0.5);
+        background-color: rgba(0, 0, 0, 0.6);
         display: flex;
+        align-items: flex-start;
+        justify-content: center;
+        z-index: 1000;
+        padding-top: 64px;
     }
 
     .dialogContainer {
-        margin-left: auto;
-        margin-right: auto;
-        margin-top: 64px;
-        width: 800px;
-        height: 600px;
-
-        background-color: var(--background);
-        border-width: var(--dialog-border-width);
-        border-style: solid;
-        border-color: var(--dialog-border-color);
+        background-color: var(--paper);
         border-radius: var(--dialog-radius);
+        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
+        display: flex;
+        flex-direction: column;
+        max-height: calc(100vh - 128px);
+        overflow: hidden;
+    }
 
-
-        box-shadow: 1px 2px 2px black;
-
+    .entityDialog {
+        width: 800px;
+        max-width: calc(100% - 32px);
     }
 
     .dialogHeader {
-        width: 100%;
-        background-color: var(--accent);
-        border-top-left-radius: var(--dialog-radius);
-        border-top-right-radius: var(--dialog-radius);
-        border-bottom: 4px solid black;
         display: flex;
         align-items: center;
-        justify-content: flex-start;
+        justify-content: space-between;
+        padding: 12px 16px;
+        border-bottom: 1px solid var(--paper-border);
+        background-color: var(--accent);
+        border-radius: var(--dialog-radius) var(--dialog-radius) 0 0;
+        min-height: 52px;
+        gap: 8px;
     }
 
-    .backButton {
-        margin-left: 16px;
-        padding: 12px;
-
-        border: 1px solid var(--accent);
+    .dialogHeaderLeft {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        min-width: 0;
     }
 
-    .backButton:hover {
-        background-color: var(--primary-hover);
-        border: 1px solid var(--primary-border-hover);
+    .dialogBackBtn {
+        background: none;
+        border: none;
+        color: rgba(255, 255, 255, 0.8);
+        font-size: 1.4rem;
+        cursor: pointer;
+        padding: 4px 8px;
+        line-height: 1;
+        border-radius: 6px;
+        transition: background 0.15s, color 0.15s;
     }
 
-    .backButtonIcon {
-        height: 32px;
-        width: 32px;
-        border: solid white;
-        border-width: 0 9px 9px 0;
-        transform: rotate(135deg);
+    .dialogBackBtn:hover {
+        background: rgba(255, 255, 255, 0.15);
+        color: white;
     }
 
     .dialogTitle {
-        padding: 16px;
-        font-size: 2rem;
-        font-weight: bold;
+        font-size: 1.25rem;
+        font-weight: 700;
+        color: white;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
     }
 
-    .dialogContent {
-        flex-grow: 1;
-        padding: 6px;
+    .dialogCloseBtn {
+        background: none;
+        border: none;
+        color: rgba(255, 255, 255, 0.7);
+        font-size: 1.5rem;
+        cursor: pointer;
+        padding: 0;
+        line-height: 1;
+        width: 32px;
+        height: 32px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 6px;
+        transition: background 0.15s, color 0.15s;
+    }
+
+    .dialogCloseBtn:hover {
+        background: rgba(255, 255, 255, 0.15);
+        color: white;
+    }
+
+    .dialogBody {
+        padding: 20px;
         overflow-y: auto;
-        overflow-x: hidden;
-
-        height: 800px;
-    }
-
-    .dialogFooter {
-        width: 100%;
-        height: 6px;
-        background-color: var(--paper);
+        flex: 1;
+        color: var(--text-primary, #ddd);
     }
 </style>
 
 @code {
-
     EntityModel entity = default!;
 
     private int refresh;
@@ -146,7 +157,6 @@
     {
         base.OnInitialized();
         entity = EntityData.Get()[entityDialogService.GetEntityId() ?? string.Empty];
-
         entityDialogService.Subscribe(OnUpdate);
     }
 
@@ -157,9 +167,8 @@
 
     void OnUpdate()
     {
-        entity = EntityData.Get()[entityDialogService.GetEntityId()];
+        entity = EntityData.Get()[entityDialogService.GetEntityId() ?? string.Empty];
         refresh++;
-
         StateHasChanged();
     }
 
@@ -167,5 +176,4 @@
     {
         entityDialogService.CloseDialog();
     }
-
 }

Pages/Dialog/GlossaryDialogComponent.razor

@@ -2,31 +2,34 @@
 @inject IGlossaryService glossaryService
 @inject IGlossaryDialogService glossaryDialogService
 
-
-<div class="dialogBackground" onclick="@CloseDialog">
+<div class="dialogOverlay" onclick="@CloseDialog">
     <div class="dialogContainer glossaryDialog"
          @onclick:preventDefault="true"
          @onclick:stopPropagation="true">
 
         @if (term == null)
         {
-            <div>Term is null</div>
+            <div class="dialogBody">Term is null</div>
         }
         else
         {
             <div class="dialogHeader">
-                @if (glossaryDialogService.HasHistory())
-                {
-                    <button class="backButton" @onclick="glossaryDialogService.BackDialog">
-                        <div class="backButtonIcon"></div>
-                    </button>
-                }
-                <div class="dialogTitle">
-                    @term.Term
+                <div class="dialogHeaderLeft">
+                    @if (glossaryDialogService.HasHistory())
+                    {
+                        <button class="dialogBackBtn" @onclick="glossaryDialogService.BackDialog" title="Back">
+                            &#8592;
+                        </button>
+                    }
+                    <div class="dialogTitle">@term.Term</div>
+                </div>
+                <div class="dialogHeaderRight">
+                    <span class="glossaryCategory">@term.Category</span>
+                    <button class="dialogCloseBtn" @onclick="CloseDialog">&times;</button>
                 </div>
-                <div class="glossaryDialogCategory">@term.Category</div>
             </div>
-            <div class="dialogContent">
+
+            <div class="dialogBody">
                 <div class="glossaryDefinition">@((MarkupString)RenderMarkdown(term.LongDefinition))</div>
 
                 @if (term.RelatedEntityIds.Count > 0)
@@ -55,112 +58,131 @@
                     </div>
                 }
             </div>
-            <div class="dialogFooter"></div>
         }
     </div>
-
 </div>
 
 <style>
-
-
-    .pageContents * {
-        filter: blur(2px);
-    }
-
-
-    .dialogBackground {
+    .dialogOverlay {
         position: fixed;
         top: 0;
         left: 0;
         width: 100vw;
         height: 100vh;
-        background-color: rgba(0, 0, 0, 0.5);
+        background-color: rgba(0, 0, 0, 0.6);
         display: flex;
+        align-items: flex-start;
+        justify-content: center;
+        z-index: 1000;
+        padding-top: 64px;
     }
 
     .dialogContainer {
-        margin-left: auto;
-        margin-right: auto;
-        margin-top: 64px;
-        width: 800px;
-        height: 600px;
-
-        background-color: var(--background);
-        border-width: var(--dialog-border-width);
-        border-style: solid;
-        border-color: var(--dialog-border-color);
-        border-radius: var(--dialog-radius);
-
-
-        box-shadow: 1px 2px 2px black;
-
-    }
-
-    .dialogHeader {
-        width: 100%;
-        background-color: var(--accent);
-        border-top-left-radius: var(--dialog-radius);
-        border-top-right-radius: var(--dialog-radius);
-        border-bottom: 4px solid black;
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-    }
-
-    .backButton {
-        margin-left: 16px;
-        padding: 12px;
-
-        border: 1px solid var(--accent);
-    }
-
-    .backButton:hover {
-        background-color: var(--primary-hover);
-        border: 1px solid var(--primary-border-hover);
-    }
-
-    .backButtonIcon {
-        height: 32px;
-        width: 32px;
-        border: solid white;
-        border-width: 0 9px 9px 0;
-        transform: rotate(135deg);
-    }
-
-    .dialogTitle {
-        padding: 16px;
-        font-size: 2rem;
-        font-weight: bold;
-    }
-
-    .dialogContent {
-        flex-grow: 1;
-        padding: 6px;
-        overflow-y: auto;
-        overflow-x: hidden;
-
-        height: 800px;
-    }
-
-    .dialogFooter {
-        width: 100%;
-        height: 6px;
         background-color: var(--paper);
+        border-radius: var(--dialog-radius);
+        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
+        display: flex;
+        flex-direction: column;
+        max-height: calc(100vh - 128px);
+        overflow: hidden;
     }
 
     .glossaryDialog {
         max-width: 600px;
+        width: calc(100% - 32px);
     }
 
-    .glossaryDialogCategory {
-        font-size: 0.8rem;
-        opacity: 0.7;
-        margin-left: 12px;
+    .dialogHeader {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 12px 16px;
+        border-bottom: 1px solid var(--paper-border);
+        background-color: var(--accent);
+        border-radius: var(--dialog-radius) var(--dialog-radius) 0 0;
+        min-height: 52px;
+        gap: 8px;
+    }
+
+    .dialogHeaderLeft {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        min-width: 0;
+    }
+
+    .dialogHeaderRight {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        flex-shrink: 0;
+    }
+
+    .dialogBackBtn {
+        background: none;
+        border: none;
+        color: rgba(255, 255, 255, 0.8);
+        font-size: 1.4rem;
+        cursor: pointer;
+        padding: 4px 8px;
+        line-height: 1;
+        border-radius: 6px;
+        transition: background 0.15s, color 0.15s;
+    }
+
+    .dialogBackBtn:hover {
+        background: rgba(255, 255, 255, 0.15);
+        color: white;
+    }
+
+    .dialogTitle {
+        font-size: 1.25rem;
+        font-weight: 700;
+        color: white;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+    .dialogCloseBtn {
+        background: none;
+        border: none;
+        color: rgba(255, 255, 255, 0.7);
+        font-size: 1.5rem;
+        cursor: pointer;
+        padding: 0;
+        line-height: 1;
+        width: 32px;
+        height: 32px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 6px;
+        transition: background 0.15s, color 0.15s;
+    }
+
+    .dialogCloseBtn:hover {
+        background: rgba(255, 255, 255, 0.15);
+        color: white;
+    }
+
+    .glossaryCategory {
+        font-size: 0.75rem;
+        color: rgba(255, 255, 255, 0.6);
+        text-transform: uppercase;
+        letter-spacing: 0.5px;
+        font-weight: 600;
+    }
+
+    .dialogBody {
+        padding: 20px;
+        overflow-y: auto;
+        flex: 1;
+        color: var(--text-primary, #ddd);
     }
 
     .glossaryDefinition {
-        line-height: 1.6;
+        line-height: 1.7;
     }
 
     .glossaryDefinition p {
@@ -168,15 +190,16 @@
     }
 
     .glossaryRelatedSection {
-        margin-top: 20px;
+        margin-top: 24px;
         padding-top: 16px;
         border-top: 1px solid var(--info-secondary-border);
     }
 
     .glossaryRelatedTitle {
-        font-weight: 800;
-        font-size: 1rem;
+        font-weight: 700;
+        font-size: 0.95rem;
         margin-bottom: 8px;
+        color: var(--text-primary, #ddd);
     }
 
     .glossaryRelatedList {
@@ -222,5 +245,4 @@
     {
         return Markdown.ToHtml(text);
     }
-
 }

Pages/Dialog/SearchDialogComponent.razor

@@ -2,141 +2,196 @@
 @inject ISearchService searchService
 @inject IJSRuntime jsRuntime
 
-
 @inject NavigationManager navigationManager
 
 @if (searchService.IsLoaded() && searchService.IsVisible)
 {
-    <div id="searchBackground" class="searchBackground" onclick="@CloseDialog">
-        <div class="searchContainer"
+    <div class="dialogOverlay" onclick="@CloseDialog">
+        <div class="dialogContainer searchDialog"
              @onclick:preventDefault="true"
              @onclick:stopPropagation="true">
 
-            <FormLayoutComponent>
-                <FormTextComponent OnFocus="OnFocus" Id="searchInput" Placeholder="Search..."
-                                   OnInput="SearchChanged"></FormTextComponent>
-            </FormLayoutComponent>
-
-            <div class="searchBox">
-                @if (SearchText.Length > 0)
-                {
-                    foreach (var searchSection in searchService.Searches)
-                    {
-                        var searchPoints = searchSection.Value.FindAll(x => x.Title.ToLower().Contains(SearchText.ToLower()));
-
-                        @if (searchPoints.Count > 0)
-                        {
-                            <div>
-                                <div class="searchSectionTitle">
-                                    @searchSection.Key
-                                </div>
-                                <div class="searchContents">
-                                    @foreach (var searchPoint in searchPoints)
-                                    {
-                                        <div>
-                                            <button class="searchLink @searchPoint.PointType.ToLower()"
-                                                    label="@searchPoint.Title"
-                                                    @onclick="() => OnSearch(searchPoint)">
-                                                @searchPoint.Title
-                                            </button>
-                                            @if (!searchPoint.Summary.Trim().Equals(""))
-                                            {
-                                                <i> - @searchPoint.Summary</i>
-                                            }
-                                        </div>
-                                    }
-                                </div>
-                            </div>
-                        }
-                    }
-                }
+            <div class="dialogHeader">
+                <div class="dialogTitle">Search</div>
+                <button class="dialogCloseBtn" @onclick="CloseDialog">&times;</button>
             </div>
 
+            <div class="dialogBody">
+                <div class="searchInputWrapper">
+                    <FormTextComponent OnFocus="OnFocus" Id="searchInput" Placeholder="Type to search..."
+                                       OnInput="SearchChanged"></FormTextComponent>
+                </div>
+
+                <div class="searchResults">
+                    @if (SearchText.Length > 0)
+                    {
+                        foreach (var searchSection in searchService.Searches)
+                        {
+                            var searchPoints = searchSection.Value.FindAll(x => x.Title.ToLower().Contains(SearchText.ToLower()));
+
+                            if (searchPoints.Count > 0)
+                            {
+                                <div class="searchSection">
+                                    <div class="searchSectionTitle">@searchSection.Key</div>
+                                    <div class="searchSectionItems">
+                                        @foreach (var searchPoint in searchPoints)
+                                        {
+                                            <button class="searchItem @searchPoint.PointType.ToLower()"
+                                                    @onclick="() => OnSearch(searchPoint)">
+                                                <span class="searchItemTitle">@searchPoint.Title</span>
+                                                @if (!string.IsNullOrWhiteSpace(searchPoint.Summary))
+                                                {
+                                                    <span class="searchItemSummary"> - @searchPoint.Summary</span>
+                                                }
+                                            </button>
+                                        }
+                                    </div>
+                                </div>
+                            }
+                        }
+                    }
+                </div>
+            </div>
         </div>
     </div>
 
     <style>
-        .pageContents * {
-            filter: blur(2px);
-        }
-
-        .searchBackground {
+        .dialogOverlay {
             position: fixed;
             top: 0;
             left: 0;
             width: 100vw;
             height: 100vh;
-            background-color: rgba(0, 0, 0, 0.5);
+            background-color: rgba(0, 0, 0, 0.6);
             display: flex;
+            align-items: flex-start;
+            justify-content: center;
+            z-index: 1000;
+            padding-top: 64px;
         }
 
-        .searchBox {
-            padding: 12px;
-            overflow-y: scroll;
-            overflow-x: hidden;
-            height: 530px;
-            border: 1px solid black;
-            border-radius: 2px;
-        }
-
-        .searchContents {
+        .dialogContainer {
+            background-color: var(--paper);
+            border-radius: var(--dialog-radius);
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
             display: flex;
             flex-direction: column;
-            gap: 6px;
-            align-items: flex-start;
-
-            padding: 12px;
+            max-height: calc(100vh - 128px);
+            overflow: hidden;
         }
 
+        .searchDialog {
+            width: 600px;
+            max-width: calc(100% - 32px);
+        }
+
+        .dialogHeader {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding: 12px 20px;
+            border-bottom: 1px solid var(--paper-border);
+            background-color: var(--accent);
+            border-radius: var(--dialog-radius) var(--dialog-radius) 0 0;
+            min-height: 52px;
+        }
+
+        .dialogTitle {
+            font-size: 1.25rem;
+            font-weight: 700;
+            color: white;
+        }
+
+        .dialogCloseBtn {
+            background: none;
+            border: none;
+            color: rgba(255, 255, 255, 0.7);
+            font-size: 1.5rem;
+            cursor: pointer;
+            padding: 0;
+            line-height: 1;
+            width: 32px;
+            height: 32px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: 6px;
+            transition: background 0.15s, color 0.15s;
+        }
+
+        .dialogCloseBtn:hover {
+            background: rgba(255, 255, 255, 0.15);
+            color: white;
+        }
+
+        .dialogBody {
+            padding: 20px;
+            overflow-y: auto;
+            flex: 1;
+        }
+
+        .searchInputWrapper {
+            margin-bottom: 16px;
+        }
+
+        .searchResults {
+            display: flex;
+            flex-direction: column;
+            gap: 16px;
+        }
+
+        .searchSection {
+            display: flex;
+            flex-direction: column;
+        }
 
         .searchSectionTitle {
-            font-weight: bolder;
+            font-weight: 700;
+            font-size: 0.85rem;
+            text-transform: uppercase;
+            letter-spacing: 0.5px;
+            color: var(--info-secondary-border);
+            margin-bottom: 8px;
+            padding-bottom: 4px;
+            border-bottom: 1px solid var(--paper-border);
         }
 
-
-        .searchContainer {
-            margin-left: auto;
-            margin-right: auto;
-            margin-top: 64px;
-            width: 800px;
-            height: 600px;
-
-            background-color: var(--background);
-            border-width: var(--dialog-border-width);
-            border-style: solid;
-            border-color: var(--dialog-border-color);
-            border-radius: var(--dialog-radius);
-
-            padding: 8px;
-
-
-            box-shadow: 1px 2px 2px black;
-
+        .searchSectionItems {
+            display: flex;
+            flex-direction: column;
+            gap: 4px;
         }
 
-        .searchLink {
-            text-decoration: underline;
+        .searchItem {
+            display: block;
+            width: 100%;
+            text-align: left;
+            background: none;
+            border: none;
+            border-radius: 6px;
+            padding: 8px 12px;
+            color: var(--text-primary, #ddd);
+            cursor: pointer;
+            transition: background 0.15s;
         }
 
-        @@media only screen and (max-width: 1025px) {
-            .searchContainer {
-                height: 300px;
-
-            }
-
-            .searchBox {
-                height: 230px;
-            }
+        .searchItem:hover {
+            background: var(--paper-hover);
+            color: white;
         }
 
+        .searchItemTitle {
+            font-weight: 600;
+        }
+
+        .searchItemSummary {
+            color: var(--info-secondary-border);
+            font-size: 0.9rem;
+        }
     </style>
 }
 
-
 @code {
-
-    private ElementReference searchBox;
-
     private string SearchText { get; set; } = "";
 
     protected override void OnInitialized()
@@ -148,7 +203,6 @@
         timer.Enabled = false;
     }
 
-
     private void FocusTimer(object? sender, ElapsedEventArgs e)
     {
         jsRuntime.InvokeVoidAsync("SetFocusToElement", "searchInput");
@@ -173,7 +227,6 @@
         timer.Elapsed -= FocusTimer;
     }
 
-
     public void CloseDialog()
     {
         searchService.Hide();
@@ -207,5 +260,4 @@
     {
         timer.Enabled = false;
     }
-
 }

Pages/Pages/BuildCalculator/Parts/ArmyComponent.razor

@@ -131,9 +131,10 @@
                         armyCount[entity.Info().Name]++;
                     }
 
-                    if (entity.Production() != null && entity.Production().BuildTime + entitiesAtTime.Key > lastInterval)
+                    var production = entity.Production();
+                    if (production != null && production.BuildTime + entitiesAtTime.Key > lastInterval)
                     {
-                        lastInterval = entity.Production().BuildTime + entitiesAtTime.Key;
+                        lastInterval = production.BuildTime + entitiesAtTime.Key;
                     }
                 }
             }

Pages/Pages/BuildCalculator/Parts/BankComponent.razor

@@ -110,15 +110,17 @@
 
         _supplyTaken = (from ordersAtInterval in ordersOverTime
             from order in ordersAtInterval.Value
-            where order.Supply() != null
-            where order.Supply().Takes > 0
-            select order.Supply().Takes).Sum();
+            let supply = order.Supply()
+            where supply != null
+            where supply.Takes > 0
+            select supply.Takes).Sum();
 
         _supplyGranted = (from ordersAtInterval in ordersOverTime
             from order in ordersAtInterval.Value
-            where order.Supply() != null
-            where order.Supply().Grants > 0
-            select order.Supply().Grants).Sum();
+            let supply = order.Supply()
+            where supply != null
+            where supply.Grants > 0
+            select supply.Grants).Sum();
 
         _extraBuildings = 0;
         if (_supplyGranted > 160)

Pages/Pages/BuildCalculator/Parts/BuildChartComponent.razor

@@ -205,7 +205,9 @@ else
             var armyValue = 0;
             foreach (var unit in army)
             {
-                armyValue += unit.Production().Alloy + unit.Production().Ether;
+                var unitProduction = unit.Production();
+                if (unitProduction != null)
+                    armyValue += unitProduction.Alloy + unitProduction.Ether;
             }
 
 

Pages/Pages/Database/DatabasePage.razor

@@ -202,7 +202,8 @@
         else
         {
             immortals = (from entity in factions
-                where entity.VanguardAdded() == null || entity.VanguardAdded().ImmortalId == selectedImmortalType
+                let vanguardAdded = entity.VanguardAdded()
+                where vanguardAdded == null || vanguardAdded.ImmortalId == selectedImmortalType
                 select entity).ToList();
         }
 

Pages/Pages/Database/Entity/Parts/EntityProductionComponent.razor

@@ -211,9 +211,9 @@
     [CascadingParameter] public string StyleType { get; set; } = "Detailed";
 
 
-    private EntityProductionModel Production => Entity!.Production();
+    private EntityProductionModel? Production => Entity!.Production();
     private List<EntityRequirementModel> Requirements => Entity!.Requirements();
-    private EntitySupplyModel Supply => Entity!.Supply();
+    private EntitySupplyModel? Supply => Entity!.Supply();
 
 
     protected override void OnParametersSet()

Pages/Pages/Database/Entity/Parts/EntityVanguardsComponent.razor

@@ -8,6 +8,7 @@
 
             var requirements = entity.Requirements();
             var vanguardAdded = entity.VanguardAdded();
+            if (vanguardAdded == null) continue;
             var replaced = EntityData.Get()[vanguardAdded.ReplaceId];
             var immortal = EntityData.Get()[vanguardAdded.ImmortalId];
 
@@ -38,6 +39,7 @@
 
                 var requirements = entity.Requirements();
                 var vanguard = entity.VanguardAdded();
+                if (vanguard == null) continue;
                 var productionBuilding = (from building in requirements
                     where building.Requirement == RequirementType.Production_Building
                     select building).First().Id;

Pages/Pages/EconomyComparison/Parts/ChartComponent.razor

@@ -71,8 +71,6 @@
     }
 
 
-    int lastRequestedRefreshIndex;
-
     void IDisposable.Dispose()
     {
         economyComparisonService.Unsubscribe(OnBuilderOrderChanged);

Pages/Pages/StoragePage.razor

@@ -168,8 +168,8 @@
     private string? _faction;
     private string? _immortal;
 
-    private string? Faction => _faction == null ? DataType.FACTION_QRath : _faction;
-    private string? Immortal => _immortal == null ? DataType.IMMORTAL_Orzum : _immortal;
+    private string Faction => _faction ?? DataType.FACTION_QRath;
+    private string Immortal => _immortal ?? DataType.IMMORTAL_Orzum;
 
 
     private int? _buildingInputDelay;

Pages/Portals/SearchPortal.razor

@@ -6,8 +6,6 @@
 <SearchDialogComponent></SearchDialogComponent>
 
 @code {
-    private string test = "Q";
-
     protected override void OnInitialized()
     {
         searchService.Subscribe(OnUpdate);

Services/Immortal/BuildOrderService.cs

@@ -282,7 +282,8 @@ public class BuildOrderService : IBuildOrderService
     {
         return (from ordersAtTime in _buildOrder.StartedOrders
             from orders in ordersAtTime.Value
-            where ordersAtTime.Key + (orders.Production() == null ? 0 : orders.Production().BuildTime) <= interval
+            let production = orders.Production()
+            where ordersAtTime.Key + (production?.BuildTime ?? 0) <= interval
             select orders).ToList();
     }
 
@@ -290,15 +291,14 @@ public class BuildOrderService : IBuildOrderService
     {
         return (from ordersAtTime in _buildOrder.StartedOrders
             from orders in ordersAtTime.Value
-            where orders.Harvest() != null
-            where ordersAtTime.Key + (orders.Production() == null
-                      ? 0
-                      : orders.Production().BuildTime) <= interval
-                  && !orders.Harvest().IsDepleted(
+            let production = orders.Production()
+            let harvest = orders.Harvest()
+            where harvest != null
+            let buildTime = production?.BuildTime ?? 0
+            where ordersAtTime.Key + buildTime <= interval
+                  && !harvest.IsDepleted(
                       interval,
-                      ordersAtTime.Key + (orders.Production() == null
-                          ? 0
-                          : orders.Production().BuildTime))
+                      ordersAtTime.Key + buildTime)
             select orders).ToList();
     }
 

Services/Immortal/EconomyService.cs

@@ -11,7 +11,7 @@ public class EconomyService : IEconomyService
 
     public List<EconomyModel> GetOverTime()
     {
-        return buildEconomyOverTime;
+        return buildEconomyOverTime ?? [];
     }
 
     public void Subscribe(Action action)
@@ -67,6 +67,7 @@ public class EconomyService : IEconomyService
 
     public EconomyModel GetEconomy(int atInterval)
     {
+        if (buildEconomyOverTime == null) return new EconomyModel();
         return atInterval >= buildEconomyOverTime.Count
             ? buildEconomyOverTime.Last()
             : buildEconomyOverTime[atInterval];
@@ -218,7 +219,7 @@ public class EconomyService : IEconomyService
 
     private void CarryOverEconomyFromPreviousInterval(int interval, EconomyModel economyAtSecond)
     {
-        if (interval <= 0) return;
+        if (interval <= 0 || buildEconomyOverTime == null) return;
 
         economyAtSecond.Alloy = buildEconomyOverTime[interval - 1].Alloy;
         economyAtSecond.Ether = buildEconomyOverTime[interval - 1].Ether;

Services/Services.csproj

@@ -16,8 +16,8 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Blazored.LocalStorage" Version="4.3.0-preview.1"/>
-        <PackageReference Include="Microsoft.JSInterop" Version="8.0.14"/>
+        <PackageReference Include="Blazored.LocalStorage" Version="4.5.0"/>
+        <PackageReference Include="Microsoft.JSInterop" Version="10.0.8"/>
         <PackageReference Include="YamlDotNet" Version="11.2.1"/>
     </ItemGroup>
 

Services/Website/MyDialogService.cs

@@ -4,16 +4,16 @@ namespace Services.Website;
 
 public class DialogContents
 {
-    public string Title { get; set; }
-    public string Message { get; set; }
-    public string ConfirmButtonLabel { get; set; }
+    public string Title { get; set; } = string.Empty;
+    public string Message { get; set; } = string.Empty;
+    public string ConfirmButtonLabel { get; set; } = string.Empty;
     public EventCallback<EventArgs> OnConfirm { get; set; }
     public EventCallback<EventArgs> OnCancel { get; set; }
 }
 
 public class MyDialogService : IMyDialogService
 {
-    private DialogContents _dialogContents;
+    private DialogContents _dialogContents = null!;
 
     public bool IsVisible { get; set; }
 

Services/Website/PermissionService.cs

@@ -7,8 +7,7 @@ public class PermissionService : IPermissionService, IDisposable
     private readonly IStorageService _storageService;
     private IJSRuntime _jsRuntime;
     private IToastService _toastService;
-    private bool isLoaded;
-    private bool isStorageEnabled = false;
+
 
     public PermissionService(IJSRuntime jsRuntime, IToastService toastService, IStorageService storageService)
     {

Services/Website/StorageService.cs

@@ -45,12 +45,12 @@ public class StorageService : IStorageService
 
     public T GetValue<T>(string forKey)
     {
-        return _localStorageService.GetItem<T>(forKey);
+        return _localStorageService.GetItem<T>(forKey)!;
     }
 
     public void SetValue<T>(string key, T value)
     {
-        if (key.Equals(StorageKeys.EnabledStorage) && value.Equals(true))
+        if (value != null && key.Equals(StorageKeys.EnabledStorage) && value.Equals(true))
         {
             _localStorageService.SetItem(key, value);
             NotifyDataChanged();

Web/App.razor

@@ -80,9 +80,7 @@
         --info: #451376;
         --info-border: #210b36;
 
-        --dialog-border-color: black;
-        --dialog-border-width: 2px;
-        --dialog-radius: 6px;
+        --dialog-radius: 12px;
 
         --info-secondary: #1e1e2e;
         --info-secondary-border: #3a3a5c;

Web/PageLayout.razor

@@ -68,7 +68,7 @@
 @code {
 
     private bool _isDarkMode = true;
-    private MudThemeProvider _mudThemeProvider;
+    private MudThemeProvider _mudThemeProvider = null!;
 
     bool _drawerOpen = true;
 

Web/wwwroot/css/app.css

@@ -37,9 +37,7 @@
     --info-hover: #451376;
     --info-border-hover: #210b36;
 
-    --dialog-border-color: black;
-    --dialog-border-width: 2px;
-    --dialog-radius: 6px;
+    --dialog-radius: 12px;
 }
 
 html {