Skip to content

Commit 3b5ece3

Browse files
sjefvanleeuwensjefvanleeuwen
committed
Update Readme
1 parent b601fc4 commit 3b5ece3

File tree

1 file changed

+6
-166
lines changed

1 file changed

+6
-166
lines changed

‎readme.md‎

Lines changed: 6 additions & 166 deletions
Original file line numberDiff line numberDiff line change
@@ -36,175 +36,15 @@ Install-Package Blazorized.AdminLte.Content -Version 3.0.5
3636
```
3737
or visit https://www.nuget.org/packages/Blazorized.AdminLte.Content/ for more installation options.
3838

39-
## Index
39+
## Getting Started
4040

41-
Depending on running WASM or Server, change your `index.html` or `_Host.cshtml`.
42-
Contents from the Blazor Component Library are served from : `_content/Blazor.AdminLte`
4341

44-
As a starting point:
45-
46-
```html
47-
<!DOCTYPE html>
48-
<html lang="en">
49-
<head>
50-
<meta charset="utf-8" />
51-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
52-
<title>Blazor.AdminLte.Site</title>
53-
<base href="~/" />
54-
<!-- Google Font: Source Sans Pro -->
55-
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
56-
<!-- Font Awesome Icons -->
57-
<link rel="stylesheet" href="_content/Blazor.AdminLte/plugins/fontawesome-free/css/all.min.css">
58-
<!-- Theme style -->
59-
<link rel="stylesheet" href="_content/Blazor.AdminLte/dist/css/adminlte.min.css">
60-
<link href="css/site.css" rel="stylesheet" />
61-
</head>
62-
<body class="hold-transition sidebar-mini">
63-
<div class="wrapper">
64-
<app>
65-
<component type="typeof(App)" render-mode="ServerPrerendered" />
66-
</app>
67-
<div id="blazor-error-ui">
68-
<environment include="Staging,Production">
69-
An error has occurred. This application may no longer respond until reloaded.
70-
</environment>
71-
<environment include="Development">
72-
An unhandled exception has occurred. See browser dev tools for details.
73-
</environment>
74-
<a href="" class="reload">Reload</a>
75-
<a class="dismiss">🗙</a>
76-
</div>
77-
</div>
78-
<script src="_framework/blazor.server.js"></script>
79-
<!-- jQuery -->
80-
<script src="_content/Blazor.AdminLte/plugins/jquery/jquery.min.js"></script>
81-
<!-- Bootstrap 4 -->
82-
<script src="_content/Blazor.AdminLte/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
83-
<!-- AdminLTE App -->
84-
<script src="_content/Blazor.AdminLte/dist/js/adminlte.min.js"></script>
85-
</body>
86-
</html>
87-
```
42+
Depending on running WASM or Server, change your
43+
[`index.html`](./src/Blazor.AdminLte.Wasm/wwwroot/index.html) or
44+
[`_Host.cshtml`](./src/Blazor.AdminLte.Site/Pages/_Host.cshtml).
45+
Contents from the Blazor Component Library are served from : `_content/Blazor.AdminLte`
8846

89-
The example includes markup that shows how to setup your starter page in Blazor.
90-
91-
92-
```html
93-
@inherits LayoutComponentBase
94-
@inject NavigationManager NavigationManager
95-
<NavBar>
96-
<NavBarLeft>
97-
<NavBarMenuItem Link="/">Home</NavBarMenuItem>
98-
<NavBarMenuItem>Content</NavBarMenuItem><!-- defaults to # -->
99-
</NavBarLeft>
100-
<NavBarSearch></NavBarSearch>
101-
<NavBarRight>
102-
<NavBarDropDown>
103-
<NavBarBadge Color="Color.Danger" Icon="far fa-comments">3</NavBarBadge>
104-
<NavBarDropDownMenu>
105-
<NavBarDropDownMenuItem>
106-
<UserMessage DateTime="DateTime.Now.AddMinutes(-2)" ProfilePicture="dist/img/user7-128x128.jpg" Icon="fas fa-star">
107-
<UserName>Patricia Maundrell</UserName>
108-
<Message>Follow up</Message>
109-
</UserMessage>
110-
</NavBarDropDownMenuItem>
111-
<DropdownDivider />
112-
<NavBarDropDownMenuItem>
113-
<UserMessage DateTime="DateTime.Now.AddHours(-4)" ProfilePicture="dist/img/user1-128x128.jpg" Icon="fas fa-star" IconColor="Color.Warning">
114-
<UserName>Brad Diesel</UserName>
115-
<Message>Call me whenever you can...</Message>
116-
</UserMessage>
117-
</NavBarDropDownMenuItem>
118-
<DropdownDivider />
119-
<NavBarDropDownMenuItem>
120-
<UserMessage DateTime="DateTime.Now.AddDays(-8)" ProfilePicture="dist/img/user8-128x128.jpg" Icon="fas fa-star" IconColor="Color.Danger">
121-
<UserName>John Pierce</UserName>
122-
<Message>I got your message bro</Message>
123-
</UserMessage>
124-
</NavBarDropDownMenuItem>
125-
<DropdownDivider />
126-
<NavBarDropDownMenuItem>
127-
<UserMessage DateTime="DateTime.Now.AddDays(-31)" ProfilePicture="dist/img/user3-128x128.jpg" Icon="fas fa-star">
128-
<UserName>Nora Silvester</UserName>
129-
<Message>The subject goes here</Message>
130-
</UserMessage>
131-
</NavBarDropDownMenuItem>
132-
<DropdownDivider />
133-
<DropdownFooter OnClick="SeeAllMessages">See All Messages</DropdownFooter>
134-
</NavBarDropDownMenu>
135-
</NavBarDropDown>
136-
<NavBarDropDown>
137-
<NavBarBadge Color="Color.Warning" Icon="far fa-bell">15</NavBarBadge>
138-
<NavBarDropDownMenu>
139-
<DropdownHeader>15 Notifications</DropdownHeader>
140-
<DropdownDivider></DropdownDivider>
141-
<NotificationMessage DateTime="@DateTime.Now.AddMinutes(-3)" Icon="fas fa-envelope mr-2">
142-
<Message>4 new messages</Message>
143-
</NotificationMessage>
144-
<DropdownDivider></DropdownDivider>
145-
<NotificationMessage DateTime="@DateTime.Now.AddHours(-12)" Icon="fas fa-users mr-2">
146-
<Message>8 friend requests</Message>
147-
</NotificationMessage>
148-
<DropdownDivider></DropdownDivider>
149-
<NotificationMessage DateTime="@DateTime.Now.AddDays(-2)" Icon="fas fa-file mr-2">
150-
<Message>3 new reports</Message>
151-
</NotificationMessage>
152-
<DropdownDivider></DropdownDivider>
153-
<DropdownFooter OnClick="SeeAllNotifications">See All Notifications</DropdownFooter>
154-
</NavBarDropDownMenu>
155-
</NavBarDropDown>
156-
<NavBarSideBarControl></NavBarSideBarControl>
157-
</NavBarRight>
158-
</NavBar>
159-
<SideBarContainer>
160-
<BrandLogo Link="https://adminlte.io/" Logo="dist/img/AdminLTELogo.png">AdminLTE 3</BrandLogo>
161-
<SideBar>
162-
<!-- Sidebar user panel (optional) -->
163-
<SideBarUserPanel UserImage="dist/img/user2-160x160.jpg">Alexander Pierce</SideBarUserPanel>
164-
<SideBarSearch></SideBarSearch>
165-
<SideBarMenu>
166-
<SideBarTreeView MenuState="MenuState.Open" Icon="fas fa-tachometer-alt">
167-
<Title>Starter Pages</Title>
168-
<Items>
169-
<SideBarMenuItem Icon="far fa-circle" NavLinkState="NavLinkState.Active">
170-
Active Page
171-
</SideBarMenuItem>
172-
<SideBarMenuItem Icon="far fa-circle">
173-
Inactive Page
174-
</SideBarMenuItem>
175-
</Items>
176-
</SideBarTreeView>
177-
<SideBarMenuItem Icon="fas fa-th">
178-
Simple Link
179-
<span class="right badge badge-danger">New</span>
180-
</SideBarMenuItem>
181-
</SideBarMenu>
182-
</SideBar>
183-
</SideBarContainer>
184-
<ContentWrapper>
185-
@Body
186-
</ContentWrapper>
187-
<ControlSideBar>Hello World!</ControlSideBar>
188-
<MainFooter>
189-
<Default>
190-
<strong>Copyright &copy; 2014-2020 <a href="https://adminlte.io">AdminLTE.io</a>.</strong> All rights reserved.
191-
</Default>
192-
<Right>
193-
Blazorized by Sjef van Leeuwen
194-
</Right>
195-
</MainFooter>
196-
@code {
197-
private void SeeAllMessages(MouseEventArgs args)
198-
{
199-
NavigationManager.NavigateTo("see-all-messages");
200-
}
201-
202-
private void SeeAllNotifications(MouseEventArgs args)
203-
{
204-
NavigationManager.NavigateTo("see-all-notifications");
205-
}
206-
}
207-
```
47+
The site shared components [`MainLayout.razor`](./src/Blazor.AdminLte.Site.Shared/MainLayout.razor) includes markup that shows how to setup your starter page in Blazor.
20848

20949
With such markup you can render something like this:
21050

0 commit comments

Comments
 (0)