Customizes Tax App

CSharp/OidcSamples/OidcSamples.TaxApp/Pages/Index.cshtml

@@ -4,45 +4,64 @@
     ViewData["Title"] = "Home page";
 }
 
-<h1 class="col-lg-7 mt-5">General Directorate of Region Taxes and Real Estate</h1>
+<div class="container">
-<div class="col-lg-7 d-flex flex-column">
+
-    <p class="lead mt-2">Welcome @Model.FirstName @Model.LastName!</p>
+    <div class="col-lg-7">
-    <div class="bg-dark rounded py-3 px-4 mt-4">
+        <p class="lead mt-5">Welcome @Model.FirstName @Model.LastName!</p>
-        <h2 class="font-weight-bold mt-3 text-warning">Your total tax is:</h2>
+        <h1 class="mt-4">General Directorate of Region Taxes and Real Estate</h1>
-        <p class="font-weight-bold text-light" style="font-size: 64px">@Model.TotalTax.ToString("N0") IQD</p>
+    </div>
+
+    <div class="col-lg-7 d-flex flex-column justify-content-center rounded py-3 px-4 shadow-sm"
+        style="margin-top: 60px; margin-bottom: 60px;">
+        <h3 class="font-weight-bold mt-3 text-custom">Your total tax is:</h3>
+        <p class="font-weight-bold text-black" style="font-size: 50px">@Model.TotalTax.ToString("N0") IQD</p>
+     </div>
+
+    <div class="container mt-5">
+        <h4 class="mt-5 mb-3 font-weight-bold">Taxable Properties</h4>
+            <table class="table mt-3 rounded table-bordered">
+                <thead class="table-primary">
+                    <tr>
+                        <th scope="col">Area</th>
+                        <th scope="col">Adress</th>
+                    </tr>
+                </thead>
+                <tbody>
+
+                    @foreach (var realEstate in Model.RealEstate)
+                    {
+                        <tr>
+                            <td>@realEstate.Area</td>
+                            <td>@realEstate.Address</td>
+                        </tr>
+                    }
+                </tbody>
+            </table>
+    </div>
+
+    <div class="container">
+        <h4 class="mt-5 mb-3 font-weight-bold">Vehicles</h4>
+        <table class="table mt-3 rounded table-bordered">
+            <thead class="table-primary">
+                <tr>
+                    <th scope="col">Model</th>
+                    <th scope="col">License Plate</th>
+                    <th scope="col">Color</th>
+                    <th scope="col">Type</th>
+                </tr>
+            </thead>
+            <tbody>
+
+                @foreach (var vehicle in Model.Vehicles)
+                {
+                    <tr>
+                        <td>@vehicle.Model</td>
+                        <td>@vehicle.LicensePlate</td>
+                        <td>@vehicle.Color</td>
+                        <td>@vehicle.Type</td>
+                    </tr>
+                }
+            </tbody>
+        </table>
     </div>
 </div>
-
-<h3>Taxable Properties</h3>
-
-<h4 class="my-4">Vehicles</h4>
-
-<table class="table col-lg-7 mt-3">
-    <thead class="bg-dark">
-        <tr>   
-            <th scope="col" class="text-light">Model</th>
-            <th scope="col" class="text-light">License Plate</th>
-            <th scope="col" class="text-light">Color</th>
-            <th scope="col" class="text-light">Type</th>
-        </tr>
-    </thead>
-    <tbody>
-
-
-@foreach (var vehicle in Model.Vehicles)
-    {
-
-        <tr>
-            <td>@vehicle.Model</td>
-            <td>@vehicle.LicensePlate</td>
-            <td>@vehicle.Color</td>
-            <td>@vehicle.Type</td>
-        </tr>
-
-    }
-
-       
-      
-    </tbody>
-</table>
-

CSharp/OidcSamples/OidcSamples.TaxApp/Pages/Index.cshtml.cs

@@ -29,7 +29,7 @@ namespace OidcSamples.TaxApp.Pages
     public class RealEstate
     {
         public int Id { get; set; }
-        public int Area { get; set; }
+        public double Area { get; set; }
         public string Address { get; set; }
         public string Citizen_upn { get; set; }
     }

CSharp/OidcSamples/OidcSamples.TaxApp/Pages/Shared/_Layout.cshtml

@@ -11,10 +11,10 @@
         integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
 </head>
 
-<body>
+<body class="bg-light">
     <header>
         <nav
-            class="navbar navbar-expand-sm justify-content-between navbar-toggleable-sm navbar-light bg-warning border-bottom box-shadow mb-3">
+            class="navbar navbar-expand-sm justify-content-between navbar-toggleable-sm navbar-light bg-custom text-light border-bottom box-shadow mb-3">
             <div class="container d-inline-flex justify-content-between w-100">
 
                 <img style="height: 72px;" src="~/images/logo.svg" alt="">
@@ -26,13 +26,13 @@
                 <div class="navbar-collapse collapse flex-grow-0">
                     <ul class="navbar-nav">@if (User.Identity.IsAuthenticated)
                         {
-                            <span class="mr-sm-4 my-sm-0 my-2 bg-light text-secondary px-3 py-2 rounded"
+                            <span class="mr-sm-4 my-sm-0 my-2 border border-white text-white px-3 py-2 rounded"
                                 style="font-weight: bold;">@User.Claims.First(c
                             =>
                             c.Type
                             ==
                             "name").Value</span>
-                            <a class="btn btn-secondary" role="button" asp-controller="Authentication"
+                            <a class="btn btn-light" role="button" asp-controller="Authentication"
                                 asp-action="Logout">Logout</a>
                         }
                     </ul>
@@ -46,9 +46,9 @@
         </main>
     </div>
 
-    <footer class="border-top footer text-muted">
+    <footer class="border-top footer text-custom mt-5 position-static">
         <div class="container">
-            &copy; 2021 - OidcSamples.TaxApp - <a asp-area="" asp-page="/Privacy">Privacy</a>
+            &copy; 2021 - Tax Service
         </div>
     </footer>
 

CSharp/OidcSamples/OidcSamples.TaxApp/wwwroot/css/site.css

@@ -18,7 +18,8 @@ a {
   border-color: #1861ac;
 }
 
-.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
+.nav-pills .nav-link.active,
+.nav-pills .show > .nav-link {
   color: #fff;
   background-color: #1b6ec2;
   border-color: #1861ac;
@@ -43,7 +44,7 @@ html {
 }
 
 .box-shadow {
-  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
+  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
 }
 
 button.accept-policy {
@@ -69,3 +70,11 @@ body {
   white-space: nowrap;
   line-height: 60px; /* Vertically center the text there */
 }
+
+.bg-custom {
+  background-color: #485460;
+}
+
+.text-custom {
+  color: #485460;
+}