1
0

Added russian captions support to badges, fixed svg images display on gallery page

This commit is contained in:
Michael Gordeev
2019-12-18 23:42:53 +03:00
parent 0d5109c48c
commit 75c15b9ed0
8 changed files with 72 additions and 72 deletions
@@ -24,9 +24,14 @@
<span asp-validation-for="Name" class="text-danger"></span> <span asp-validation-for="Name" class="text-danger"></span>
</div> </div>
<div> <div>
<label asp-for="Description"></label> <label asp-for="EnglishDescription"></label>
<input asp-for="Description" type="text" /> <input asp-for="EnglishDescription" type="text" />
<span asp-validation-for="Description" class="text-danger"></span> <span asp-validation-for="EnglishDescription" class="text-danger"></span>
</div>
<div>
<label asp-for="RussianDescription"></label>
<input asp-for="RussianDescription" type="text" />
<span asp-validation-for="RussianDescription" class="text-danger"></span>
</div> </div>
<div> <div>
<label asp-for="Image"></label> <label asp-for="Image"></label>
@@ -36,36 +41,10 @@
</div> </div>
<span asp-validation-for="Image" class="text-danger"></span> <span asp-validation-for="Image" class="text-danger"></span>
</div> </div>
<div> <partial name="Preview.cshtml" />
<label>Preview:</label>
<div class="badge" id="preview"></div>
</div>
<input type="submit" value="Create" class="btn" /> <input type="submit" value="Create" class="btn" />
</form> </form>
</article> </article>
<link type="text/css" rel="stylesheet" href="~/css/Admin.css" /> <link type="text/css" rel="stylesheet" href="~/css/Admin.css" />
<style type="text/css">
.badge {
height: 50px;
width: 50px;
margin: 10px 0px;
background-size: contain;
}
.image-selector {
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
}
</style>
<script type="text/javascript">
UpdatePreview();
function UpdatePreview() {
var preview = document.getElementById("preview");
preview.title = document.getElementById("Description").value;
preview.style.backgroundImage = "url(/images/Badges/" + document.getElementById("Image").value + ".png)";
}
</script>
@@ -13,7 +13,8 @@
<article> <article>
<p class="form-group"> <p class="form-group">
<b>@Html.DisplayNameFor(model => model.Name):</b> @Model.Name<br /> <b>@Html.DisplayNameFor(model => model.Name):</b> @Model.Name<br />
<b>@Html.DisplayNameFor(model => model.Description):</b> @Model.Description<br /> <b>@Html.DisplayNameFor(model => model.EnglishDescription):</b> @Model.EnglishDescription<br />
<b>@Html.DisplayNameFor(model => model.RussianDescription):</b> @Model.RussianDescription<br />
<b>@Html.DisplayNameFor(model => model.Image):</b> @(Model.Image).png<br /> <b>@Html.DisplayNameFor(model => model.Image):</b> @(Model.Image).png<br />
<b>Preview:</b> <b>Preview:</b>
@@ -24,9 +24,14 @@
<span asp-validation-for="Name" class="text-danger"></span> <span asp-validation-for="Name" class="text-danger"></span>
</div> </div>
<div> <div>
<label asp-for="Description"></label> <label asp-for="EnglishDescription"></label>
<input asp-for="Description" type="text" /> <input asp-for="EnglishDescription" type="text" />
<span asp-validation-for="Description" class="text-danger"></span> <span asp-validation-for="EnglishDescription" class="text-danger"></span>
</div>
<div>
<label asp-for="RussianDescription"></label>
<input asp-for="RussianDescription" type="text" />
<span asp-validation-for="RussianDescription" class="text-danger"></span>
</div> </div>
<div> <div>
<label asp-for="Image"></label> <label asp-for="Image"></label>
@@ -36,36 +41,10 @@
</div> </div>
<span asp-validation-for="Image" class="text-danger"></span> <span asp-validation-for="Image" class="text-danger"></span>
</div> </div>
<div> <partial name="Preview.cshtml" />
<label>Preview:</label>
<div class="badge" id="preview"></div>
</div>
<input type="submit" value="Save" class="btn" /> <input type="submit" value="Save" class="btn" />
</form> </form>
</article> </article>
<link type="text/css" rel="stylesheet" href="~/css/Admin.css" /> <link type="text/css" rel="stylesheet" href="~/css/Admin.css" />
<style type="text/css">
.badge {
height: 50px;
width: 50px;
margin: 10px 0px;
background-size: contain;
}
.image-selector {
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
}
</style>
<script type="text/javascript">
UpdatePreview();
function UpdatePreview()
{
var preview = document.getElementById("preview");
preview.title = document.getElementById("Description").value;
preview.style.backgroundImage = "url(/images/Badges/" + document.getElementById("Image").value + ".png)";
}
</script>
@@ -20,7 +20,10 @@
@Html.DisplayNameFor(model => model.Name) @Html.DisplayNameFor(model => model.Name)
</th> </th>
<th> <th>
@Html.DisplayNameFor(model => model.Description) @Html.DisplayNameFor(model => model.EnglishDescription)
</th>
<th>
@Html.DisplayNameFor(model => model.RussianDescription)
</th> </th>
<th> <th>
@Html.DisplayNameFor(model => model.Image) @Html.DisplayNameFor(model => model.Image)
@@ -36,7 +39,8 @@
<div class="badge" style="background-image: url(/images/Badges/@(item.Image).png)" title="@(item.Description)"></div> <div class="badge" style="background-image: url(/images/Badges/@(item.Image).png)" title="@(item.Description)"></div>
</td> </td>
<td>@item.Name</td> <td>@item.Name</td>
<td>@item.Description</td> <td>@item.EnglishDescription</td>
<td>@item.RussianDescription</td>
<td>@item.Image</td> <td>@item.Image</td>
<td> <td>
<a asp-action="Edit" asp-route-id="@item.Name">Edit</a> | <a asp-action="Edit" asp-route-id="@item.Name">Edit</a> |
@@ -0,0 +1,29 @@
<div>
<label>Preview:</label>
<div class="badge" id="preview"></div>
</div>
<style type="text/css">
.badge
{
height: 50px;
width: 50px;
margin: 10px 0px;
background-size: contain;
}
.image-selector
{
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
}
</style>
<script type="text/javascript">
UpdatePreview();
function UpdatePreview()
{
var preview = document.getElementById("preview");
preview.title = document.getElementById("EnglishDescription").value;
preview.style.backgroundImage = "url(/images/Badges/" + document.getElementById("Image").value + ".png)";
}
</script>
@@ -16,7 +16,6 @@
<b>@Html.DisplayNameFor(model => model.Order):</b> @Model.Order<br /> <b>@Html.DisplayNameFor(model => model.Order):</b> @Model.Order<br />
<b>@Html.DisplayNameFor(model => model.EnglishTitle):</b> @Model.EnglishTitle<br /> <b>@Html.DisplayNameFor(model => model.EnglishTitle):</b> @Model.EnglishTitle<br />
<b>@Html.DisplayNameFor(model => model.RussianTitle):</b> @Model.RussianTitle<br /> <b>@Html.DisplayNameFor(model => model.RussianTitle):</b> @Model.RussianTitle<br />
<b>@Html.DisplayNameFor(model => model.Title):</b> @Model.Title<br />
<b>@Html.DisplayNameFor(model => model.Username):</b> @Model.Username<br /> <b>@Html.DisplayNameFor(model => model.Username):</b> @Model.Username<br />
<b>@Html.DisplayNameFor(model => model.Url):</b> @Model.Url<br /> <b>@Html.DisplayNameFor(model => model.Url):</b> @Model.Url<br />
<b>@Html.DisplayNameFor(model => model.CanContactMe):</b> @Html.DisplayFor(model => model.CanContactMe)<br /> <b>@Html.DisplayNameFor(model => model.CanContactMe):</b> @Html.DisplayFor(model => model.CanContactMe)<br />
+12 -3
View File
@@ -1,6 +1,7 @@
using System.ComponentModel; using System.ComponentModel;
using System.ComponentModel.DataAnnotations; using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema; using System.ComponentModel.DataAnnotations.Schema;
using System.Globalization;
namespace MyWebsite.Models namespace MyWebsite.Models
{ {
@@ -10,10 +11,18 @@ namespace MyWebsite.Models
[Column(TypeName = "varchar(10)")] [Column(TypeName = "varchar(10)")]
[DisplayName("ID")] [DisplayName("ID")]
public string Name { get; set; } public string Name { get; set; }
[Column(TypeName = "varchar(100)")]
[Required]
[DisplayName("Caption")] [DisplayName("Caption")]
public string Description { get; set; } public string Description => CultureInfo.CurrentUICulture.TwoLetterISOLanguageName == "ru" && !string.IsNullOrWhiteSpace(RussianDescription) ? RussianDescription : EnglishDescription;
[Required]
[Column(TypeName = "varchar(50)")]
[DisplayName("Caption (en)")]
public string EnglishDescription { get; set; }
[Column(TypeName = "varchar(50)")]
[DisplayName("Caption (ru)")]
public string RussianDescription { get; set; }
[Column(TypeName = "varchar(20)")] [Column(TypeName = "varchar(20)")]
[Required] [Required]
[DisplayName("Image name")] [DisplayName("Image name")]
+2 -2
View File
@@ -2,7 +2,7 @@
.gallery img .gallery img
{ {
object-fit: cover; object-fit: cover;
max-height: 300px; height: 300px;
max-width: 100%; max-width: 100%;
margin: 2px; margin: 2px;
transition: .25s; transition: .25s;
@@ -19,7 +19,7 @@
{ {
.gallery img .gallery img
{ {
max-height: none; height: initial;
} }
.gallery img:hover .gallery img:hover