Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Blazor server .NET 8 and Blazorise

$
0
0

I have a problem with Blazorise.I started a Blazor Server project. I replaced layout files with the same from Blazorise WASM template.

It works but the sidebar is not visible (it is rendered on HTML).Someone can help me?

I post my code.

App.razorAll js/css are in wwwroot\css folder and wwwroot\js folder

<!DOCTYPE html><html lang="it"><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><base href="/" /><link href="css/bootstrap.min.css?v=5.3.2" rel="stylesheet" /><link href="css/fontawesome.all.min.css?v=6.4.2" rel="stylesheet" /><link href="_content/Blazorise/blazorise.min.css?v=1.3.0.0" rel="stylesheet" /><link href="_content/Blazorise.Bootstrap5/blazorise.bootstrap5.min.css?v=1.3.0.0" rel="stylesheet" /><link href="_content/Blazorise.LoadingIndicator/blazorise.loadingindicator.css" rel="stylesheet" /><link rel="stylesheet" href="SM.styles.css" /><link rel="stylesheet" href="app.css" /><link rel="icon" type="image/png" href="favicon.png" /><HeadOutlet /></head><body><Routes /><script src="js/jquery.min.js?v=3.7.1"></script><script src="js/bootstrap.bundle.min.js?v=5.1.3"></script><script src="js/moment.min.js?v=2.2.4"></script><script src="js/highcharts.min.js"></script><script src="_framework/blazor.web.js"></script><script src="js/blazor-interop.min.js"></script></body></html>

Routes.razor

<Blazorise.ThemeProvider Theme="@_theme"><Router AppAssembly="typeof(App).Assembly"><Found Context="routeData"><RouteView RouteData="routeData" DefaultLayout="typeof(Layout.MainLayout)" /></Found><NotFound><PageTitle>Not found</PageTitle><LayoutView Layout="@typeof(Layout.MainLayout)"><p role="alert">Sorry, there's nothing at this address.</p></LayoutView></NotFound></Router><MessageProvider /><PageProgressProvider /></Blazorise.ThemeProvider>

MainLayout.razor

@inherits LayoutComponentBase<Layout Sider><LayoutSider><LayoutSiderContent><SideMenu /></LayoutSiderContent></LayoutSider><Layout><LayoutHeader Fixed><TopMenu LayoutType="fixed-header" /></LayoutHeader><LayoutContent Padding="Padding.Is4.OnX.Is4.FromTop">            @Body</LayoutContent></Layout></Layout>

SideMenu.razor

implements IDisposable<Bar Breakpoint="Breakpoint.Desktop" NavigationBreakpoint="Breakpoint.Tablet" ThemeContrast="ThemeContrast.Light" Mode="BarMode.VerticalInline" CollapseMode="BarCollapseMode.Small"><BarToggler /><BarBrand><BarItem><BarLink To="/"><BarIcon IconName="_customIcon" />                Project1</BarLink></BarItem></BarBrand><BarMenu><BarStart>                ...</BarStart><BarEnd>                ...</BarEnd></BarMenu></Bar>

Solution

App.razor
<!DOCTYPE html><html lang="it"><head>        ...   <HeadOutlet @rendermode="@InteractiveServer" /></head><body><Routes @rendermode="@InteractiveServer" />        ...</body></html>

Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>