Skip to content
This repository was archived by the owner on Nov 17, 2023. It is now read-only.

Commit e9aa525

Browse files
authored
Merge pull request #1705 from dotnet-architecture/feature/refresh-spa-theme
Refresh SPA theme
2 parents 08d3a2b + 5afcd37 commit e9aa525

File tree

252 files changed

+65128
-19053
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

252 files changed

+65128
-19053
lines changed

README.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,12 @@
66

77
Sample .NET Core reference application, powered by Microsoft, based on a simplified microservices architecture and Docker containers.
88

9+
## SPA Application (Angular)
10+
11+
![](img/eshop-spa-app-home.png)
12+
13+
## MVC application (ASP.NET Core)
14+
915
![](img/eshop-webmvc-app-screenshot.png)
1016

1117
## Build Status (GitHub Actions)

img/eshop-spa-app-home.png

1.13 MB
Loading

img/eshop-webmvc-app-screenshot.png

0 Bytes
Loading
-83.8 KB
Loading
-183 KB
Loading
-190 KB
Loading
-83.1 KB
Loading
24.4 KB
Loading
24.4 KB
Loading
-1.14 KB
Loading
-110 KB
Loading
-51.8 KB
Loading
-187 KB
Loading
-81 KB
Loading
-86.2 KB
Loading
-76.1 KB
Loading
-12.7 KB
Loading
Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,3 @@
11
CatalogBrand
2-
Azure
32
.NET
4-
Visual Studio
5-
SQL Server
63
Other
7-
CatalogBrandTestOne
8-
CatalogBrandTestTwo
Binary file not shown.
Binary file not shown.

src/Services/Catalog/Catalog.API/Setup/CatalogItems.csv

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,13 @@ T-Shirt,.NET,".NET Bot Black Hoodie, and more",.NET Bot Black Hoodie,19.5,1.png,
33
Mug,.NET,.NET Black & White Mug,.NET Black & White Mug,8.50,2.png,89,true
44
T-Shirt,Other,Prism White T-Shirt,Prism White T-Shirt,12,3.png,56,false
55
T-Shirt,.NET,.NET Foundation T-shirt,.NET Foundation T-shirt,12,4.png,120,false
6-
Sheet,Other,Roslyn Red Sheet,Roslyn Red Sheet,8.5,5.png,55,false
6+
Pin,Other,Roslyn Red Pin,Roslyn Red Pin,8.5,5.png,55,false
77
T-Shirt,.NET,.NET Blue Hoodie,.NET Blue Hoodie,12,6.png,17,false
88
T-Shirt,Other,Roslyn Red T-Shirt,Roslyn Red T-Shirt,12,7.png,8,false
99
T-Shirt,Other,Kudu Purple Hoodie,Kudu Purple Hoodie,8.5,8.png,34,false
1010
Mug,Other,Cup<T> White Mug,Cup<T> White Mug,12,9.png,76,false
11-
Sheet,.NET,.NET Foundation Sheet,.NET Foundation Sheet,12,10.png,11,false
12-
Sheet,.NET,Cup<T> Sheet,Cup<T> Sheet,8.5,11.png,3,false
11+
Pin,.NET,.NET Foundation Pin,.NET Foundation Pin,12,10.png,11,false
12+
Pin,.NET,Cup<T> Pin,Cup<T> Pin,8.5,11.png,3,false
1313
T-Shirt,Other,Prism White TShirt,Prism White TShirt,12,12.png,0,false
14-
Mug, Other, De los Palotes, pepito, 12, 12.png, 0, false
14+
Mug,.NET,Modern .NET Black & White Mug,Modern .NET Black & White Mug,8.50,13.png,89,true
15+
Mug,Other,Modern Cup<T> White Mug,Modern Cup<T> White Mug,12,14.png,76,false
Binary file not shown.
Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
11
CatalogType
22
Mug
33
T-Shirt
4-
Sheet
5-
USB Memory Stick
6-
CatalogTypeTestOne
7-
CatalogTypeTestTwo
4+
Pin
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# Catalog set up
2+
3+
The catalog images have been updated to the new SPA looks.
4+
5+
If you want to use the classical images:
6+
7+
1. Drop the `Microsoft.eShopOnContainers.Services.CatalogDb` database from the `sqldata` container.
8+
2. Rename `CatalogItems-MVC.zip` as `CatalogItems.zip`
9+
3. Rebuild the `catalog-api` service with `docker-compose build catalog-api`
10+
4. Restart the application as usual

src/Services/Identity/Identity.API/Views/Account/Login.cshtml

Lines changed: 19 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,27 @@
11
@model Microsoft.eShopOnContainers.Services.Identity.API.Models.AccountViewModels.LoginViewModel
22

3-
43
@{
54
ViewData["Title"] = "Log in";
5+
6+
var requestQuery = ViewContext.HttpContext.Request.Query;
7+
8+
requestQuery.TryGetValue("ReturnUrl", out var returnUrl);
9+
10+
string partialView;
11+
12+
if (returnUrl[0].Contains("client_id=js"))
13+
{
14+
Layout = "_Layout-SPA";
15+
partialView = "_LoginPartial-SPA.cshtml";
16+
}
17+
else
18+
{
19+
partialView = "_LoginPartial-MVC.cshtml";
20+
}
21+
622
}
7-
<div class="brand-header-block">
8-
<ul class="container">
9-
<li><a asp-area="" asp-controller="Account" asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]">REGISTER</a></li>
10-
<li class="active" style="margin-right: 65px;">LOGIN</li>
11-
</ul>
12-
</div>
13-
<div class="container account-login-container">
14-
<div class="row">
15-
<div class="col-md-12">
16-
<section>
17-
<form asp-controller="Account" asp-action="Login" asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" class="form-horizontal">
18-
<input type="hidden" asp-for="ReturnUrl" />
19-
<h4>ARE YOU REGISTERED?</h4>
20-
<div asp-validation-summary="All" class="text-danger"></div>
21-
<div class="form-group">
22-
<label asp-for="Email" class="control-label form-label"></label>
23-
<input asp-for="Email" class="form-control form-input form-input-center" />
24-
<span asp-validation-for="Email" class="text-danger"></span>
25-
</div>
26-
<div class="form-group">
27-
<label asp-for="Password" class="control-label form-label"></label>
28-
<input asp-for="Password" class="form-control form-input form-input-center" />
29-
<span asp-validation-for="Password" class="text-danger"></span>
30-
</div>
31-
<div class="form-group">
32-
<div class="checkbox">
33-
<label asp-for="RememberMe">
34-
<input asp-for="RememberMe" />
35-
@Html.DisplayNameFor(m => m.RememberMe)
36-
</label>
37-
</div>
38-
</div>
39-
<div class="form-group">
40-
<button type="submit" class="btn btn-default btn-brand btn-brand-big">&nbsp;LOG IN&nbsp;</button>
41-
</div>
42-
<p>
43-
<a asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]" class="text">Register as a new user?</a>
44-
</p>
45-
<p>
46-
Note that for demo purposes you don't need to register and can login with these credentials:
47-
</p>
48-
<p>
49-
User: <b>demouser@microsoft.com</b>
50-
</p>
51-
<p>
52-
Password: <b>Pass@word1</b>
53-
</p>
54-
</form>
55-
</section>
56-
</div>
57-
</div>
58-
</div>
23+
24+
<partial name=@partialView model=@Model />
5925

6026
@section Scripts {
6127
@{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
Lines changed: 21 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -1,106 +1,28 @@
11
@model Microsoft.eShopOnContainers.Services.Identity.API.Models.AccountViewModels.RegisterViewModel
2+
23
@{
34
ViewData["Title"] = "Register";
5+
6+
var requestQuery = ViewContext.HttpContext.Request.Query;
7+
8+
requestQuery.TryGetValue("ReturnUrl", out var returnUrl);
9+
10+
string partialView;
11+
12+
if (returnUrl[0].Contains("client_id=js"))
13+
{
14+
Layout = "_Layout-SPA";
15+
partialView = "_RegisterPartial-SPA.cshtml";
16+
}
17+
else
18+
{
19+
partialView = "_RegisterPartial-MVC.cshtml";
20+
}
21+
422
}
5-
<div class="brand-header-block">
6-
<ul class="container">
7-
<li class="active">REGISTER</li>
8-
<li style="margin-right: 65px;"><a asp-area="" asp-controller="Account" asp-action="Login" asp-route-returnurl="@ViewData["ReturnUrl"]">LOGIN</a></li>
9-
</ul>
10-
</div>
11-
<div class="container register-container">
12-
<form asp-controller="Account" asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" class="form-horizontal">
13-
<h4 class="order-create-section-title">CREATE NEW ACCOUNT</h4>
14-
<div asp-validation-summary="All" class="text-danger"></div>
15-
<div class="row">
16-
<div class="form-group col-sm-6">
17-
<label asp-for="User.Name" class="control-label form-label">NAME</label>
18-
<input asp-for="User.Name" class="form-control form-input" />
19-
<span asp-validation-for="User.Name" class="text-danger" />
20-
</div>
21-
<div class="form-group col-sm-6">
22-
<label asp-for="User.LastName" class="control-label form-label">LAST NAME</label>
23-
<input asp-for="User.LastName" class="form-control form-input" />
24-
<span asp-validation-for="User.LastName" class="text-danger" />
25-
</div>
26-
<div class="form-group col-sm-6">
27-
<label asp-for="User.Street" class="control-label form-label">ADDRESS</label>
28-
<input asp-for="User.Street" class="form-control form-input" />
29-
<span asp-validation-for="User.Street" class="text-danger" />
30-
</div>
31-
<div class="form-group col-sm-6">
32-
<label asp-for="User.City" class="control-label form-label"></label>
33-
<input asp-for="User.City" class="form-control form-input" />
34-
<span asp-validation-for="User.City" class="text-danger" />
35-
</div>
36-
<div class="form-group col-sm-6">
37-
<label asp-for="User.State" class="control-label form-label"></label>
38-
<input asp-for="User.State" class="form-control form-input" />
39-
<span asp-validation-for="User.State" class="text-danger" />
40-
</div>
41-
<div class="form-group col-sm-6">
42-
<label asp-for="User.Country" class="control-label form-label"></label>
43-
<input asp-for="User.Country" class="form-control form-input" />
44-
<span asp-validation-for="User.Country" class="text-danger" />
45-
</div>
46-
<div class="form-group col-sm-6">
47-
<label asp-for="User.ZipCode" class="control-label form-label">POSTCODE</label>
48-
<input asp-for="User.ZipCode" class="form-control form-input" />
49-
<span asp-validation-for="User.ZipCode" class="text-danger" />
50-
</div>
51-
<div class="form-group col-sm-6">
52-
<label asp-for="User.PhoneNumber" class="control-label form-label">PHONE NUMBER</label>
53-
<input asp-for="User.PhoneNumber" class="form-control form-input" />
54-
<span asp-validation-for="User.PhoneNumber" class="text-danger" />
55-
</div>
56-
<div class="form-group col-sm-6">
57-
<label asp-for="User.CardNumber" class="control-label form-label">Card Number</label>
58-
<input asp-for="User.CardNumber" class="form-control form-input" />
59-
<span asp-validation-for="User.CardNumber" class="text-danger" />
60-
</div>
61-
<div class="form-group col-sm-6">
62-
<label asp-for="User.CardHolderName" class="control-label form-label">Cardholder Name</label>
63-
<input asp-for="User.CardHolderName" class="form-control form-input" />
64-
<span asp-validation-for="User.CardHolderName" class="text-danger" />
65-
</div>
66-
<div class="form-group col-sm-3">
67-
<label asp-for="User.Expiration" class="control-label form-label">Expiration Date</label>
68-
<input asp-for="User.Expiration" placeholder="MM/YY" class="form-control form-input form-input-small" />
69-
<span asp-validation-for="User.Expiration" class="text-danger" />
70-
</div>
71-
<div class="form-group col-sm-3">
72-
<label asp-for="User.SecurityNumber" class="control-label form-label">Security Code</label>
73-
<input asp-for="User.SecurityNumber" class="form-control form-input form-input-small" />
74-
<span asp-validation-for="User.SecurityNumber" class="text-danger" />
75-
</div>
76-
</div>
77-
<br /><br />
78-
<div class="row">
79-
<div class="form-group col-sm-6">
80-
<label asp-for="Email" class="control-label form-label"></label>
81-
<input asp-for="Email" class="form-control form-input" />
82-
<span asp-validation-for="Email" class="text-danger"></span>
83-
</div>
84-
<div class="form-group col-sm-offset-6"></div>
85-
<div class="form-group col-sm-6">
86-
<label asp-for="Password" class="control-label form-label"></label>
87-
<input asp-for="Password" class="form-control form-input" />
88-
<span asp-validation-for="Password" class="text-danger"></span>
89-
</div>
90-
<div class="form-group col-sm-6">
91-
<label asp-for="ConfirmPassword" class="control-label form-label"></label>
92-
<input asp-for="ConfirmPassword" class="form-control form-input" />
93-
<span asp-validation-for="ConfirmPassword" class="text-danger"></span>
94-
</div>
95-
</div>
96-
<br /><br />
97-
<div class="form-group">
98-
<button type="submit" class="btn btn-default btn-brand">&nbsp;Register&nbsp;</button>
99-
</div>
100-
<br /><br />
101-
</form>
102-
</div>
23+
24+
<partial name=@partialView model=@Model />
25+
10326
@section Scripts {
10427
@{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
10528
}
106-
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
@model Microsoft.eShopOnContainers.Services.Identity.API.Models.AccountViewModels.LoginViewModel
2+
3+
<div class="brand-header-block">
4+
<ul class="container">
5+
<li><a asp-area="" asp-controller="Account" asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]">REGISTER</a></li>
6+
<li class="active" style="margin-right: 65px;">LOGIN</li>
7+
</ul>
8+
</div>
9+
<div class="container account-login-container">
10+
<div class="row">
11+
<div class="col-md-12">
12+
<section>
13+
<form asp-controller="Account" asp-action="Login" asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" class="form-horizontal">
14+
<input type="hidden" asp-for="ReturnUrl" />
15+
<h4>ARE YOU REGISTERED?</h4>
16+
<div asp-validation-summary="All" class="text-danger"></div>
17+
<div class="form-group">
18+
<label asp-for="Email" class="control-label form-label"></label>
19+
<input asp-for="Email" class="form-control form-input form-input-center" />
20+
<span asp-validation-for="Email" class="text-danger"></span>
21+
</div>
22+
<div class="form-group">
23+
<label asp-for="Password" class="control-label form-label"></label>
24+
<input asp-for="Password" class="form-control form-input form-input-center" />
25+
<span asp-validation-for="Password" class="text-danger"></span>
26+
</div>
27+
<div class="form-group">
28+
<div class="checkbox">
29+
<label asp-for="RememberMe">
30+
<input asp-for="RememberMe" />
31+
@Html.DisplayNameFor(m => m.RememberMe)
32+
</label>
33+
</div>
34+
</div>
35+
<div class="form-group">
36+
<button type="submit" class="btn btn-default btn-brand btn-brand-big">&nbsp;LOG IN&nbsp;</button>
37+
</div>
38+
<p>
39+
<a asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]" class="text">Register as a new user?</a>
40+
</p>
41+
<p>
42+
Note that for demo purposes you don't need to register and can login with these credentials:
43+
</p>
44+
<p>
45+
User: <b>demouser@microsoft.com</b>
46+
</p>
47+
<p>
48+
Password: <b>Pass@word1</b>
49+
</p>
50+
</form>
51+
</section>
52+
</div>
53+
</div>
54+
</div>
Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
@model Microsoft.eShopOnContainers.Services.Identity.API.Models.AccountViewModels.LoginViewModel
2+
3+
<div class="container">
4+
<div class="row">
5+
<div class="col-md-12">
6+
<section>
7+
<form asp-controller="Account" asp-action="Login" asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" class="form-login">
8+
<input type="hidden" asp-for="ReturnUrl" />
9+
<h4 class="text-left mb-4">ARE YOU REGISTERED?</h4>
10+
<div asp-validation-summary="All" class="text-danger"></div>
11+
<div class="form-group">
12+
<label asp-for="Email" class="control-label form-label"></label>
13+
<input asp-for="Email" class="form-control form-input w-100" />
14+
<span asp-validation-for="Email" class="text-danger"></span>
15+
</div>
16+
<div class="form-group">
17+
<label asp-for="Password" class="control-label form-label"></label>
18+
<input asp-for="Password" class="form-control form-input w-100" />
19+
<span asp-validation-for="Password" class="text-danger"></span>
20+
</div>
21+
<div class="d-flex align-items-center justify-content-between">
22+
<div class="checkbox">
23+
<label asp-for="RememberMe">
24+
<input asp-for="RememberMe" class="mr-1" />
25+
@Html.DisplayNameFor(m => m.RememberMe)
26+
</label>
27+
</div>
28+
29+
<button type="submit" class="btn btn-primary">LOG IN</button>
30+
</div>
31+
<div class="form-login-register-link text-center mt-3">
32+
<a class="text-link" asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]">Register as a new user?</a>
33+
</div>
34+
35+
</form>
36+
<div class="form-login-details">
37+
<div>
38+
Note that for demo purposes you don't need to register and can login with these credentials:
39+
</div>
40+
<div>
41+
User: <strong>demouser@microsoft.com</strong> Password: <strong>Pass@word1</strong>
42+
</div>
43+
</div>
44+
</section>
45+
</div>
46+
</div>
47+
</div>

0 commit comments

Comments
 (0)