Reposition release notes close link

Adrian Simmons created

Signed-off-by: Adrian Simmons <adrian@perlucida.co.uk>

Change summary

ws/static/home.html  |  3 ++-
ws/static/styles.css | 20 ++++++++++++++++----
2 files changed, 18 insertions(+), 5 deletions(-)

Detailed changes

ws/static/home.html 🔗

@@ -71,7 +71,7 @@
                 <h2>Release notes</h2>
                 {{- range . -}}
                 <div id="{{ (index .Releases 0).ID }}" class="release_note card">
-                    <h3>{{ .Name }}: release notes for <a href="{{ (index .Releases 0).URL }}">{{ (index .Releases 0).Tag }}</a> <span class="close"><a href="#">&#x2716;</a></span></h3>
+                    <h3>{{ .Name }}: release notes for <a href="{{ (index .Releases 0).URL }}">{{ (index .Releases 0).Tag }}</a></h3>
                     {{- if eq .Forge "github" "gitea" "forgejo" -}}
                     {{- (index .Releases 0).Content -}}
                     {{- else -}}
@@ -80,6 +80,7 @@
                     </pre>
                     {{- end -}}
                     <p><a class="return_to_project" href="#{{ .ID }}">Back to project</a></p>
+                    <div class="close"><a href="#">&#x2716;</a></div>
                 </div>
                 {{- end -}}
             </div>

ws/static/styles.css 🔗

@@ -116,6 +116,7 @@ a:visited {
 }
 
 .card {
+	position: relative;
 	border: 2px solid var(--card-border);
 	background: var(--card-background);
 	border-radius: 5px;
@@ -136,12 +137,23 @@ a:visited {
 	margin-bottom: 16px;
 }
 
-.close, .delete { float: right; }
-.delete { font-size: 12px; }
+.delete {
+    float: right;
+    font-size: 12px;
+}
+
+.close {
+    position: absolute;
+    top: 2px;
+    right: 3px;
+}
+
 .close > a {
-	text-decoration: none;
-	color: var(--card-border);
+    font-size: 1em;
+    text-decoration: none;
+    color: var(--card-border);
 }
+
 @media (prefers-color-scheme: dark) {
 	.close > a {
 		color: var(--text);