Share via

layout problem

Saeed Pooladzadeh 241 Reputation points
2022-07-25T11:47:21.727+00:00

Hello,

Why I can't see my menu in Blazor?

Here is my code:

mainLayout:
@inherits LayoutComponentBase

<PageTitle>BlazorApp1</PageTitle>  
  
<div class="page">  
    <div class="sidebar">  
        <saeedMenu />  
        @*<NavMenu/>*@  
    </div>  
  
    <main>  
        @*<div class="top-row px-4">  
            <a href="https://learn.microsoft.com/aspnet/" target="_blank">About</a>  
        </div>*@  
  
        <article class="content px-4">  
            @Body  
        </article>  
    </main>  
</div>  

saeedMenu:

<nav class="navbar navbar-dark navbar-expand-sm" style="width: 100%; background-color: #e7791b; background: linear-gradient(90deg, #e65c00, #F9D423);">  
    <div class="bg-gradient container-fluid">  
        <a class="navbar-brand" href="#"> <img src="../logo/img_avatar1.png" alt="Avatar Logo" style="width:40px;" class="rounded-pill" /> </a>  
        <ul class="navbar-nav">  
            <li class="nav-item active">  
                <a class="nav-link" href="/">Home</a>  
            </li>  
            <li class="nav-item active">  
                <a class="nav-link" href="ImageUpload">UploadImage</a>  
            </li>  
            <li class="nav-item active">  
                <a class="nav-link" href="UploadStory">UploadStory</a>  
            </li>  
            <li class="nav-item active">  
                <a class="nav-link" href="VideoUpload">UploadVideo</a>  
            </li>  
        </ul>  
    </div>  
</nav  

index:

<nav class="navbar navbar-dark navbar-expand-sm" style="width: 100%; background-color: #e7791b; background: linear-gradient(90deg, #e65c00, #F9D423);">
<div class="bg-gradient container-fluid">
<a class="navbar-brand" href="#"> <img src="../logo/img_avatar1.png" alt="Avatar Logo" style="width:40px;" class="rounded-pill" /> </a>
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="ImageUpload">UploadImage</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="UploadStory">UploadStory</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="VideoUpload">UploadVideo</a>
</li>
</ul>
</div>
</nav>

regards,
Saeed

Developer technologies | .NET | Blazor
Developer technologies | ASP.NET Core | Other

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.