10 | About
11 |
12 |
13 | Sorry, there's nothing at this address.
10 |Counter
6 | 7 |Current count: @currentCount
8 | 9 | 10 | 11 | @code { 12 | private int currentCount = 0; 13 | 14 | private void IncrementCount() 15 | { 16 | currentCount++; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/NetClient.Elastic/Pages/FetchData.razor: -------------------------------------------------------------------------------- 1 | @page "/fetchdata" 2 | @inject HttpClient Http 3 | 4 |Weather forecast
7 | 8 |This component demonstrates fetching data from the server.
9 | 10 | @if (forecasts == null) 11 | { 12 |Loading...
13 | } 14 | else 15 | { 16 || Date | 20 |Temp. (C) | 21 |Temp. (F) | 22 |Summary | 23 |
|---|---|---|---|
| @forecast.Date.ToShortDateString() | 30 |@forecast.TemperatureC | 31 |@forecast.TemperatureF | 32 |@forecast.Summary | 33 |
Persons!
9 | 10 | Welcome to your new app. 11 || Id | 15 |Name | 16 |Location | 18 |Action | 19 ||
|---|---|---|---|---|
| @item.Id | 26 |@item.FullName | 27 |@item.Email | 28 |@(item.City+", "+item.Country) | 29 |30 | 31 | 32 | 33 | | 34 |
21 |
22 | An error has occurred. This application may no longer respond until reloaded.
23 |
24 |
25 | An unhandled exception has occurred. See browser dev tools for details.
26 |
27 | Reload
28 | 🗙
29 |
30 |
31 |
32 |
42 |
43 |
--------------------------------------------------------------------------------
/src/NetClient.Elastic/Program.cs:
--------------------------------------------------------------------------------
1 | using Autofac.Extensions.DependencyInjection;
2 | using NetClient.Elastic.Extensions;
3 | using Serilog;
4 |
5 | namespace NetClient.Elastic
6 | {
7 | public class Program
8 | {
9 | public static async Task Main(string[] args)
10 | {
11 | await BuildHost(args).RunAsync();
12 | }
13 |
14 | public static IHost BuildHost(string[] args) =>
15 | Host.CreateDefaultBuilder(args)
16 | .ConfigureLogging((host, builder) => builder.ClearProviders().AddSerilog(host.Configuration))
17 | .UseSerilog()
18 | .UseServiceProviderFactory(new AutofacServiceProviderFactory())
19 | .ConfigureWebHostDefaults(webBuilder => webBuilder.UseStartup
4 |
7 |
8 |
9 |
14 | @Body
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/src/NetClient.Elastic/Shared/MainLayout.razor.css:
--------------------------------------------------------------------------------
1 | .page {
2 | position: relative;
3 | display: flex;
4 | flex-direction: column;
5 | }
6 |
7 | main {
8 | flex: 1;
9 | }
10 |
11 | .sidebar {
12 | background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
13 | }
14 |
15 | .top-row {
16 | background-color: #f7f7f7;
17 | border-bottom: 1px solid #d6d5d5;
18 | justify-content: flex-end;
19 | height: 3.5rem;
20 | display: flex;
21 | align-items: center;
22 | }
23 |
24 | .top-row ::deep a, .top-row ::deep .btn-link {
25 | white-space: nowrap;
26 | margin-left: 1.5rem;
27 | text-decoration: none;
28 | }
29 |
30 | .top-row ::deep a:hover, .top-row ::deep .btn-link:hover {
31 | text-decoration: underline;
32 | }
33 |
34 | .top-row ::deep a:first-child {
35 | overflow: hidden;
36 | text-overflow: ellipsis;
37 | }
38 |
39 | @media (max-width: 640.98px) {
40 | .top-row:not(.auth) {
41 | display: none;
42 | }
43 |
44 | .top-row.auth {
45 | justify-content: space-between;
46 | }
47 |
48 | .top-row ::deep a, .top-row ::deep .btn-link {
49 | margin-left: 0;
50 | }
51 | }
52 |
53 | @media (min-width: 641px) {
54 | .page {
55 | flex-direction: row;
56 | }
57 |
58 | .sidebar {
59 | width: 250px;
60 | height: 100vh;
61 | position: sticky;
62 | top: 0;
63 | }
64 |
65 | .top-row {
66 | position: sticky;
67 | top: 0;
68 | z-index: 1;
69 | }
70 |
71 | .top-row.auth ::deep a:first-child {
72 | flex: 1;
73 | text-align: right;
74 | width: 0;
75 | }
76 |
77 | .top-row, article {
78 | padding-left: 2rem !important;
79 | padding-right: 1.5rem !important;
80 | }
81 | }
82 |
--------------------------------------------------------------------------------
/src/NetClient.Elastic/Shared/NavMenu.razor:
--------------------------------------------------------------------------------
1 |
9 |
10 |
11 |
28 |
29 |
30 | @code {
31 | private bool collapseNavMenu = true;
32 |
33 | private string NavMenuCssClass => collapseNavMenu ? "collapse" : null;
34 |
35 | private void ToggleNavMenu()
36 | {
37 | collapseNavMenu = !collapseNavMenu;
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/src/NetClient.Elastic/Shared/NavMenu.razor.css:
--------------------------------------------------------------------------------
1 | .navbar-toggler {
2 | background-color: rgba(255, 255, 255, 0.1);
3 | }
4 |
5 | .top-row {
6 | height: 3.5rem;
7 | background-color: rgba(0,0,0,0.4);
8 | }
9 |
10 | .navbar-brand {
11 | font-size: 1.1rem;
12 | }
13 |
14 | .oi {
15 | width: 2rem;
16 | font-size: 1.1rem;
17 | vertical-align: text-top;
18 | top: -2px;
19 | }
20 |
21 | .nav-item {
22 | font-size: 0.9rem;
23 | padding-bottom: 0.5rem;
24 | }
25 |
26 | .nav-item:first-of-type {
27 | padding-top: 1rem;
28 | }
29 |
30 | .nav-item:last-of-type {
31 | padding-bottom: 1rem;
32 | }
33 |
34 | .nav-item ::deep a {
35 | color: #d7d7d7;
36 | border-radius: 4px;
37 | height: 3rem;
38 | display: flex;
39 | align-items: center;
40 | line-height: 3rem;
41 | }
42 |
43 | .nav-item ::deep a.active {
44 | background-color: rgba(255,255,255,0.25);
45 | color: white;
46 | }
47 |
48 | .nav-item ::deep a:hover {
49 | background-color: rgba(255,255,255,0.1);
50 | color: white;
51 | }
52 |
53 | @media (min-width: 641px) {
54 | .navbar-toggler {
55 | display: none;
56 | }
57 |
58 | .collapse {
59 | /* Never collapse the sidebar for wide screens */
60 | display: block;
61 | }
62 | }
63 |
--------------------------------------------------------------------------------
/src/NetClient.Elastic/Shared/SurveyPrompt.razor:
--------------------------------------------------------------------------------
1 |
2 |
3 | @Title
4 |
5 |
6 | Please take our
7 | brief survey
8 |
9 | and tell us what you think.
10 |
11 |
12 | @code {
13 | // Demonstrates how a parent component can supply parameters
14 | [Parameter]
15 | public string Title { get; set; }
16 | }
17 |
--------------------------------------------------------------------------------
/src/NetClient.Elastic/Startup.cs:
--------------------------------------------------------------------------------
1 | using Elastic.Apm.NetCoreAll;
2 | using HealthChecks.UI.Client;
3 | using Microsoft.AspNetCore.Diagnostics.HealthChecks;
4 | using NetClient.Elastic.Extensions;
5 | using NetClient.Elastic.Services;
6 | using NetClient.Elastic.Tasks;
7 | using Prometheus;
8 | using Refit;
9 | using Serilog;
10 |
11 | namespace NetClient.Elastic
12 | {
13 | public class Startup
14 | {
15 | public Startup(IConfiguration configuration)
16 | {
17 | Configuration = configuration;
18 | }
19 |
20 | public IConfiguration Configuration { get; }
21 |
22 | public virtual void ConfigureServices(IServiceCollection services)
23 | {
24 | // Adds all custom configurations for this service.
25 | services.Configure
30 | ```
31 |
32 | #### Using Open Iconic's SVG Sprite
33 |
34 | Open Iconic also comes in a SVG sprite which allows you to display all the icons in the set with a single request. It's like an icon font, without being a hack.
35 |
36 | Adding an icon from an SVG sprite is a little different than what you're used to, but it's still a piece of cake. *Tip: To make your icons easily style able, we suggest adding a general class to the* `