more CSS tweaks, removed 'view' button

This commit is contained in:
Lynne Megido 2020-09-17 23:47:13 +10:00
parent f571265130
commit d890307d6b
Signed by: lynnesbian
GPG Key ID: F0A184B5213D9F90
2 changed files with 23 additions and 15 deletions

View File

@ -12,21 +12,20 @@
<div class="document"> <div class="document">
<div class="document-column left" style="background-image:url('/img/placeholder.png');"></div> <div class="document-column left" style="background-image:url('/img/placeholder.png');"></div>
<div class="document-column centre"> <div class="document-column centre">
<div class="title">@Html.DisplayFor(modelItem => item.Title)</div> <div class="title"><a href="/Content/@item.Filename">@Html.DisplayFor(modelItem => item.Title)</a></div>
<div class="authors">By @Html.DisplayFor(modelItem => item.Authors)</div> <div class="authors">By @Html.DisplayFor(modelItem => item.Authors)</div>
<div class="category">Category: @Html.DisplayFor(modelItem => item.Category)</div> <div class="category">Category: @Html.DisplayFor(modelItem => item.Category)</div>
<div class="tags">@Html.DisplayFor(modelItem => item.Tags)</div> <div class="tags">@Html.DisplayFor(modelItem => item.Tags)</div>
@{string hash = item.Hash.Substring(0, 8);} @{string hash = item.Hash.Substring(0, 8);}
<div class="metadata"> <div class="metadata">
@Html.DisplayFor(modelItem => item.Filename) | @Html.DisplayFor(modelItem => item.Filename) |
<span title="@item.Size bytes">@Html.DisplayFor(modelItem => item.Size)</span> | <span title="@item.Size bytes">@Html.DisplayFor(modelItem => item.Size)</span> |
<span title="SHA256 digest: @Html.DisplayFor(modelItem => item.Hash)">@hash...</span> <span title="SHA256 digest: @Html.DisplayFor(modelItem => item.Hash)">@hash...</span>
</div> </div>
</div> </div> @* end of document-column centre *@
<div class="document-column right"> <div class="document-column right">
@* TODO: replace these with font awesome or something *@ @* TODO: replace these with font awesome or something *@
<div class="vertical-buttons"> <div class="vertical-buttons">
<a href="/Content/@item.Filename" class="button simple">View</a>
<a asp-page="./Documents/Details" asp-route-id="@item.ID" class="button simple">Details</a> <a asp-page="./Documents/Details" asp-route-id="@item.ID" class="button simple">Details</a>
<a asp-page="./Documents/Edit" asp-route-id="@item.ID" class="button simple">Edit</a> <a asp-page="./Documents/Edit" asp-route-id="@item.ID" class="button simple">Edit</a>
<a href="#" class="button simple">Delete</a> <a href="#" class="button simple">Delete</a>

View File

@ -19,7 +19,12 @@ h1, h2, h3, h4, h5, h6 {
} }
a { a {
text-decoration: none; text-decoration: underline dotted transparent;
color: #a66;
transition: 0.2s;
}
a:not(.button):hover {
text-decoration: underline dotted;
} }
.button { .button {
@ -103,6 +108,10 @@ main {
.document-column { .document-column {
width: 10%; width: 10%;
padding: 0 10px;
display: flex;
flex-direction: column;
justify-content: center;
} }
.document-column.left { .document-column.left {
background-size: contain; background-size: contain;
@ -147,13 +156,13 @@ main {
width: min-content; width: min-content;
} }
@media only screen and (min-width: 900px) { @media only screen and (min-width: 1000px) {
.documents { .documents {
max-width: 80%; max-width: 80%;
} }
} }
@media only screen and (min-width: 600px) and (max-width: 899px) { @media only screen and (min-width: 600px) and (max-width: 999px) {
.documents { .documents {
max-width: 90%; max-width: 90%;
} }