Design Improvements

Addplug page new loading bar design, dashboard finetuning

src/Elektrifikatsiya/Elektrifikatsiya/Components/Layout/SideMenu.razor

@@ -29,20 +29,24 @@
                     Add Plug
                 </BarLink>
             </BarItem>
-        </BarStart>
-        <BarEnd>
             <BarItem>
                 <BarLink To="/settings" TextColor="TextColor.White">
                     <BarIcon Style="color:white" IconName="IconName.Wrench" />
                     Settings
                 </BarLink>
             </BarItem>
+        </BarStart>
+        <BarEnd>
+            <BarItem>
+                <BarLink To="/login" TextColor="TextColor.White">
+                    <BarIcon Style="color:white" IconName="IconName.Running" />
+                    Logout
+                </BarLink>
+            </BarItem>
         </BarEnd>
     </BarMenu>
 </Bar>
 @code {
     private bool pagesBarVisible = true;
-
-    //TODO: replace logo png with transparent background one
     RenderFragment customIcon =@<img src="/logo.png" style="width:32px; height: 32px" />;
 }

src/Elektrifikatsiya/Elektrifikatsiya/Elektrifikatsiya.csproj

@@ -37,6 +37,7 @@
 		<PackageReference Include="Blazorise" Version="1.2.0" />
 		<PackageReference Include="Blazorise.Charts" Version="1.2.0" />
 		<PackageReference Include="Blazorise.Components" Version="1.2.0" />
+		<PackageReference Include="Blazorise.LoadingIndicator" Version="1.2.0" />
 		<PackageReference Include="Blazorise.Material" Version="1.2.0" />
 		<PackageReference Include="Blazorise.Icons.Material" Version="1.2.0" />
 		<PackageReference Include="BCrypt.Net-Next" Version="4.0.3" />

src/Elektrifikatsiya/Elektrifikatsiya/Pages/AddPlug.razor

@@ -9,7 +9,7 @@
 @inject IDeviceManagmentService DeviceManagmentService
 @inject IAuthenticationService AuthenticationService 
 
-<Div >
+<Div>
 	<Row Style="height:50%; width:100%" Padding="Padding.Is3.OnDesktop.Is0">
 		<Row Style="height:90%; width:100%">
 			<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is1"></Column>
@@ -20,10 +20,16 @@
 					 Shadow="Shadow.Remove"
 					 Border="Border.Is1.RoundedTop">
 					<BarBrand>
+						<Column ColumnSize="ColumnSize.Is9">
 							Add a plug via wifi
+						</Column>
+						<Column ColumnSize="ColumnSize.Is3.Is1.WithOffset">
+							<LoadingIndicator @bind-Visible="@visible">
+							</LoadingIndicator>
+						</Column>
 					</BarBrand>
 				</Bar>
-<ListView  Class="w-100"
+					<ListView Class="w-100"
 							  TItem="IPAddress"
 							  Data="@ipAddresses"
 							  TextField="@((_)=>(""))"
@@ -90,6 +96,8 @@
 @code {
 	List<IPAddress> ipAddresses = new List<IPAddress>();
 
+	bool visible = true;
+
 	protected override void OnInitialized()
 	{
 		ipAddresses.AddRange(MdnsDiscovery.GetChachedDevices());
@@ -97,6 +105,7 @@
 		{
 			ipAddresses.Add(address);
 			InvokeAsync(StateHasChanged);
+			visible = false;
 		};
 	}
 }

src/Elektrifikatsiya/Elektrifikatsiya/Pages/Dashboard.razor

@@ -83,7 +83,7 @@
 	<Row Padding="Padding.Is3">
 		<Column>
 			<Button Color="Color.Primary" Style="border-radius: 0px" Clicked="@(async () => await HandleRedraw())">Aktualisieren</Button>
-			<LineChart @ref="lineChart" TItem="double" />
+			<LineChart Height="Height.Is100" Width="Width.Is100" @ref="lineChart" TItem="double" />
 		</Column>
 	</Row>
 </Div>

src/Elektrifikatsiya/Elektrifikatsiya/Pages/_Host.cshtml

@@ -6,3 +6,4 @@
 }
 
 <component type="typeof(App)" render-mode="Server" />
+<link href="_content/Blazorise.LoadingIndicator/blazorise.loadingindicator.css" rel="stylesheet" />

src/Elektrifikatsiya/Elektrifikatsiya/_Imports.razor

@@ -10,3 +10,4 @@
 @using Elektrifikatsiya
 @using Blazorise
 @using Blazorise.Charts
+@using Blazorise.LoadingIndicator