Fix loading indicator visibility and dark mode navigation styling by Copilot · Pull Request #661 · phoenixvc/Mystira.App

Copilot · 2026-02-10T15:23:22Z

Loading indicator appeared for unauthenticated users during initial render. Navigation items had poor visibility in dark mode due to improper color inheritance.

Changes

AdventuresSection component

Gated loading indicator behind isAuthenticated check
Replaced Bootstrap grid with flexbox container for proper vertical centering
Added unit tests with namespace aliases to resolve ContentBundle ambiguity

Dark mode navigation

Added color: inherit to .nav-link i and .nav-link span to ensure proper color inheritance from parent
Added background-color: transparent to dark mode hover states to prevent unwanted backgrounds

Mapper configuration

Added [MapperIgnoreSource(nameof(BranchRequest.EchoLog))] to suppress unmapped property warning

/* Before: icons/text didn't inherit nav-link color */
.nav-link {
    color: var(--nav-link-color) !important;
}

/* After: explicit inheritance ensures visibility */
.nav-link i,
.nav-link span {
    color: inherit;
}

Original prompt

the loading adventures shouldnt be there i not logged in on the home page.

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

JustAGhosT · 2026-02-10T15:25:00Z

@copilot when logged in the loading indicator is not preoperly centered

JustAGhosT · 2026-02-10T15:26:32Z

@copilot darkmode header ontover still has issues

…sSection Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

JustAGhosT · 2026-02-10T15:27:33Z

@copilot notice indicated in red the vertical space with an colour that is slightly different than the rest

why is it visible, what is it used ffor>

JustAGhosT · 2026-02-10T15:32:52Z

@copilot ix additional issues above and address

Warning: /home/runner/work/Mystira.App/Mystira.App/src/Mystira.App.Application/Mappers/ScenarioMapper.cs(55,5): warning RMG020: The member EchoLog on the mapping source type Mystira.Contracts.App.Requests.Scenarios.BranchRequest is not mapped to any member on the mapping target type Mystira.App.Domain.Models.Branch [/home/runner/work/Mystira.App/Mystira.App/src/Mystira.App.Application/Mystira.App.Application.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(43,78): error CS0104: 'ContentBundle' is an ambiguous reference between 'Mystira.App.Domain.Models.ContentBundle' and 'Mystira.App.PWA.Models.ContentBundle' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(43,9): error CS1929: 'ISetup<IApiClient, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.ContentBundle>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(44,80): error CS0104: 'Scenario' is an ambiguous reference between 'Mystira.App.Domain.Models.Scenario' and 'Mystira.App.PWA.Models.Scenario' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(44,9): error CS1929: 'ISetup<IApiClient, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.Scenario>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(62,106): error CS0104: 'UserProfile' is an ambiguous reference between 'Mystira.App.Domain.Models.UserProfile' and 'Mystira.App.PWA.Models.UserProfile' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(62,9): error CS1929: 'ISetup<IProfileService, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.UserProfile>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(63,46): error CS1061: 'IGameSessionService' does not contain a definition for 'GetInProgressSessionsAsync' and no accessible extension method 'GetInProgressSessionsAsync' accepting a first argument of type 'IGameSessionService' could be found (are you missing a using directive or an assembly reference?) [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(63,116): error CS0104: 'GameSession' is an ambiguous reference between 'Mystira.App.Domain.Models.GameSession' and 'Mystira.App.PWA.Models.GameSession' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(64,78): error CS0104: 'ContentBundle' is an ambiguous reference between 'Mystira.App.Domain.Models.ContentBundle' and 'Mystira.App.PWA.Models.ContentBundle' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(64,9): error CS1929: 'ISetup<IApiClient, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.ContentBundle>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(65,80): error CS0104: 'Scenario' is an ambiguous reference between 'Mystira.App.Domain.Models.Scenario' and 'Mystira.App.PWA.Models.Scenario' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(65,9): error CS1929: 'ISetup<IApiClient, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.Scenario>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(80,106): error CS0104: 'UserProfile' is an ambiguous reference between 'Mystira.App.Domain.Models.UserProfile' and 'Mystira.App.PWA.Models.UserProfile' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(80,9): error CS1929: 'ISetup<IProfileService, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.UserProfile>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(81,46): error CS1061: 'IGameSessionService' does not contain a definition for 'GetInProgressSessionsAsync' and no accessible extension method 'GetInProgressSessionsAsync' accepting a first argument of type 'IGameSessionService' could be found (are you missing a using directive or an assembly reference?) [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(81,116): error CS0104: 'GameSession' is an ambiguous reference between 'Mystira.App.Domain.Models.GameSession' and 'Mystira.App.PWA.Models.GameSession' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(82,78): error CS0104: 'ContentBundle' is an ambiguous reference between 'Mystira.App.Domain.Models.ContentBundle' and 'Mystira.App.PWA.Models.ContentBundle' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(82,9): error CS1929: 'ISetup<IApiClient, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.ContentBundle>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(83,80): error CS0104: 'Scenario' is an ambiguous reference between 'Mystira.App.Domain.Models.Scenario' and 'Mystira.App.PWA.Models.Scenario' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
Error: /home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Components/AdventuresSectionTests.cs(83,9): error CS1929: 'ISetup<IApiClient, Task<List>>' does not contain a definition for 'ReturnsAsync' and the best extension method overload 'SequenceExtensions.ReturnsAsync<List>(ISetupSequentialResult<Task<List>>, List)' requires a receiver of type 'Moq.Language.ISetupSequentialResult<System.Threading.Tasks.Task<System.Collections.Generic.List<Mystira.App.Domain.Models.Scenario>>>' [/home/runner/work/Mystira.App/Mystira.App/tests/Mystira.App.PWA.Tests/Mystira.App.PWA.Tests.csproj]
17 Warning(s)
20 Error(s)

Time Elapsed 00:00:32.64
Error: Process completed with exit code 1.

Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Copilot · 2026-02-10T15:34:34Z

@copilot when logged in the loading indicator is not preoperly centered

<img width="1867" height="632" alt="image" src="https://github.com/user-attachments/assets/1b42067a-b3ca-450b-a7cd-de63607e1b...

Fixed in commit d123645. Changed the loading indicator to use flexbox centering instead of Bootstrap grid:

Changes:

Replaced row justify-content-center my-5 with a flexbox container
Added .loading-indicator-container with display: flex, align-items: center, justify-content: center
Set min-height: 400px for proper vertical spacing
Added margin: 0 auto to the spinner itself

The loading indicator is now properly centered both horizontally and vertically when authenticated users are loading adventures.

…per warning Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Copilot · 2026-02-10T15:39:55Z

@copilot ix additional issues above and address

Warning: /home/runner/work/Mystira.App/Mystira.App/src/Mystira.App.Application/Mappers/ScenarioMapper.cs(55,5): warning RMG020: The member EchoLog on...

Fixed all issues in commits eda652c and 3d1859b:

Build Errors Fixed (eda652c):

Resolved ambiguous ContentBundle reference in tests using namespace alias
Fixed ScenarioMapper warning by adding [MapperIgnoreSource(nameof(BranchRequest.EchoLog))]

Dark Mode Header Hover Fixed (3d1859b):

Added background-color: transparent !important to nav-link hover styles in dark mode
Applied to both @media (prefers-color-scheme: dark) and html[data-theme="dark"] selectors
Removes unwanted light background that appeared on hover

All builds should now pass.

Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

JustAGhosT · 2026-02-21T19:10:32Z

@copilot compare with dev, is this ix still needed

Copilot · 2026-02-21T19:11:50Z

@copilot compare with dev, is this ix still needed

Compared with dev branch - all fixes are still needed:

Loading indicator fix (AdventuresSection.razor): Dev still shows loading for unauthenticated users. My fix gates it behind isAuthenticated check.
Dark mode nav styling (MainLayout.razor.css): Dev doesn't have color: inherit for .nav-link i and .nav-link span, causing poor visibility in dark mode.
Loading centering (AdventuresSection.razor.css): Dev uses Bootstrap grid, my fix uses flexbox for proper vertical centering.
Build errors (ScenarioMapper.cs, AdventuresSectionTests.cs): Fixed ambiguous references and mapper warnings.

The dev branch is at commit 0eb4d44, which doesn't include any of these UI/UX fixes.

Initial plan

ec535f9

Copilot AI assigned Copilot and JustAGhosT Feb 10, 2026

Copilot started work on behalf of JustAGhosT February 10, 2026 15:23 View session

Fix: Only show loading indicator for authenticated users in Adventure…

5a2b3df

…sSection Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Copilot AI changed the title ~~[WIP] Remove loading adventures from home page when not logged in~~ Fix loading indicator appearing for unauthenticated users on home page Feb 10, 2026

Copilot AI requested a review from JustAGhosT February 10, 2026 15:32

Copilot finished work on behalf of JustAGhosT February 10, 2026 15:32

Copilot started work on behalf of JustAGhosT February 10, 2026 15:32 View session

Fix: Center loading indicator properly for authenticated users

d123645

Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Copilot finished work on behalf of JustAGhosT February 10, 2026 15:35

Copilot started work on behalf of JustAGhosT February 10, 2026 15:35 View session

Copilot AI and others added 2 commits February 10, 2026 15:38

Fix: Resolve build errors - ambiguous ContentBundle reference and map…

eda652c

…per warning Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Fix: Remove unwanted background on dark mode header hover

3d1859b

Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Copilot finished work on behalf of JustAGhosT February 10, 2026 15:40

Copilot started work on behalf of JustAGhosT February 10, 2026 15:47 View session

Fix: Ensure nav-link icons and text inherit color properly in dark mode

398669f

Co-authored-by: JustAGhosT <5531814+JustAGhosT@users.noreply.github.com>

Copilot AI changed the title ~~Fix loading indicator appearing for unauthenticated users on home page~~ Fix loading indicator visibility and dark mode navigation styling Feb 10, 2026

Copilot finished work on behalf of JustAGhosT February 10, 2026 15:49

Copilot started work on behalf of JustAGhosT February 21, 2026 19:10 View session

Copilot finished work on behalf of JustAGhosT February 21, 2026 19:12

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Comments

Fix loading indicator visibility and dark mode navigation styling#661

Fix loading indicator visibility and dark mode navigation styling#661
Copilot wants to merge 6 commits intodevfrom
copilot/remove-loading-adventures-home

Copilot AI commented Feb 10, 2026 •

edited

Loading

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

Copilot AI commented Feb 10, 2026

Uh oh!

Copilot AI commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 21, 2026

Uh oh!

Copilot AI commented Feb 21, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Comments

Conversation

Copilot AI commented Feb 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changes

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 10, 2026

Uh oh!

Copilot AI commented Feb 10, 2026

Uh oh!

Copilot AI commented Feb 10, 2026

Uh oh!

JustAGhosT commented Feb 21, 2026

Uh oh!

Copilot AI commented Feb 21, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Copilot AI commented Feb 10, 2026 •

edited

Loading