I'm new to telerik and MVC. I come from a webforms background.
I wanted to start out with a website that has a sidebar on the left and a menu across the top. The Responsive Panel seems to fit the bill. I'm accustomed to creating a master page in webforms. How do I create something similar to a master page in a core/MVC website where when I make a selection from the item list in the left side bar, it updates the content on the right (iframe?)
I have a dashboard page that will be displayed on a larger flat screen TV. I don't what the menu bar showing just the hamburger button on the nav bar. How would I do this for a large screen format. I'm not sure what to change on the kendo-responsivepanel
How do I configure the button to be visible and the responsive-panel to be hidden by default?
<button id="configure" class="k-rpanel-toggle k-button k-primary btn-toggle">
<span class="k-icon k-i-menu"></span>
</button>
....
<div id="responsive-panel" class="navbar navbar-dark navbar-collapse bg-light mb-4">
<kendo-responsivepanel name="responsive-panel" auto-close="false" breakpoint="758" orientation="top">
@(Html.Kendo().Menu()
.Name("Menu")
.Items(items =>
{
items.Add().Text("Schedule").Action("Index", "Schedule", new { area = "" });
items.Add().Text("Locations")
.Items(ddl =>
{
ddl.Add().Text("Brownwood").Action("Index", "Home", new { locationCode = "BW" });
. . .
});
})
)
</kendo-responsivepanel>
</div>
I want to require a credential to be entered so I can track a users role, etc. What is the recommend way to display the _LoginPartial in the Menu? Or, do I accomplish this by making it part of the <div> ?
What DOESN'T look right:
<
div
class
=
"container menu-content"
>
<
div
class
=
"navbar-collapse collapse"
>
<
partial
name
=
"_CookieConsentPartial"
/>
<
div
id
=
"responsive-panel"
>
@(Html.Kendo().Menu()
.Name("Menu")
.Items(items =>
{
items.Add()
.Text("About")
.Action("About", "Home");
items.Add()
.Text("Customers")
.Action("Index", "Customers");
}))
</
div
>
<
partial
name
=
"_LoginPartial"
/>
</
div
>
<
button
id
=
"configure"
class
=
"k-rpanel-toggle k-button k-primary btn-toggle"
><
span
class
=
"k-icon k-i-hbars"
></
span
></
button
>
</
div
>