From ab9a3b92e9c96508f4a63f23cdf8eaa33ec533b4 Mon Sep 17 00:00:00 2001
From: Robert Marshall <rob@robware.uk>
Date: Sat, 8 May 2021 12:24:03 +0100
Subject: [PATCH] Introduce actions table style

---
 src/Website/Views/Blog/Manage.cshtml |  6 +++---
 src/Website/wwwroot/css/blog.scss    |  8 --------
 src/Website/wwwroot/css/style.scss   | 27 +++++++++++++++++++++++++++
 3 files changed, 30 insertions(+), 11 deletions(-)

diff --git a/src/Website/Views/Blog/Manage.cshtml b/src/Website/Views/Blog/Manage.cshtml
index 75421e1..a31e93e 100644
--- a/src/Website/Views/Blog/Manage.cshtml
+++ b/src/Website/Views/Blog/Manage.cshtml
@@ -6,10 +6,10 @@
 
 <a href="/blog/edit">New Post</a>
 
-<table class="post-list">
+<table class="actions">
 	@foreach (var post in Model) {
-		<tr class="post-list__post">
-			<td><a href="/blog/view/@post.Url">@post.Title</a></td>
+		<tr>
+			<td class="stretch"><a href="/blog/view/@post.Url">@post.Title</a></td>
 			<td><a href="edit?id=@post.Id"><img src="/images/edit.svg" alt="Edit" title="Edit"/></a></td>
 			<td><a href="/blog/view/@post.Url?preview=true"><img src="/images/blog.svg" alt="Preview" title="Preview"/></a></td>
 			<td><a href="publish?id=@post.Id"><img src="/images/send.svg" alt="Publish" title="Publish" onclick="return confirm('Are you sure?')"/></a></td>
diff --git a/src/Website/wwwroot/css/blog.scss b/src/Website/wwwroot/css/blog.scss
index dbb6673..7a77b10 100644
--- a/src/Website/wwwroot/css/blog.scss
+++ b/src/Website/wwwroot/css/blog.scss
@@ -168,12 +168,4 @@
 	.CodeMirror *{
 		transition: none; // Fix weird scroll issue as a result of site-wide transition.
 	}
-}
-
-.post-list {
-    border-collapse: collapse;
-
-    &__post:hover {
-        background: $Grey-300;
-    }
 }
\ No newline at end of file
diff --git a/src/Website/wwwroot/css/style.scss b/src/Website/wwwroot/css/style.scss
index 2c78e37..1318fe2 100644
--- a/src/Website/wwwroot/css/style.scss
+++ b/src/Website/wwwroot/css/style.scss
@@ -227,6 +227,33 @@ form {
 	}
 }
 
+table.actions {
+	border-collapse: collapse;
+	width:100%;
+
+	tr:hover {
+		background: $Grey-300;
+	}
+
+	td {
+		&.stretch{
+			width: 99%;
+		}
+		
+		&.nowrap{
+			white-space: nowrap;
+		}
+		
+		&:not(:first-child) {
+			padding-left: 5px;
+
+			pre {
+				margin: 0;
+			}
+		}
+	}
+}
+
 @import "blog.scss";
 @import "home.scss";