lynnesbian/Snootalogue
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

more CSS tweaks, removed 'view' button

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

5
Pages/Index.cshtml
View file

@ -12,7 +12,7 @@
<div class="document">
<div class="document-column left" style="background-image:url('/img/placeholder.png');"></div>
<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="category">Category: @Html.DisplayFor(modelItem => item.Category)</div>
<div class="tags">@Html.DisplayFor(modelItem => item.Tags)</div>
@ -22,11 +22,10 @@
<span title="@item.Size bytes">@Html.DisplayFor(modelItem => item.Size)</span> |
<span title="SHA256 digest: @Html.DisplayFor(modelItem => item.Hash)">@hash...</span>
</div>
</div>
</div> @* end of document-column centre *@
<div class="document-column right">
@* TODO: replace these with font awesome or something *@
<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/Edit" asp-route-id="@item.ID" class="button simple">Edit</a>
<a href="#" class="button simple">Delete</a>

15
wwwroot/css/style.css
View file

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