From 8ecf1dfb7c116ccea0fedb332805c705fa6f7021 Mon Sep 17 00:00:00 2001
From: Alban Crommer <alban@octopuce.fr>
Date: Sat, 23 May 2020 12:58:35 +0000
Subject: [PATCH] [fix] rework the appearance

---
 public/css/site.css | 52 ++++++++++++++++++++++-----------------------
 public/js/app.js    | 18 +++++++++-------
 2 files changed, 36 insertions(+), 34 deletions(-)

diff --git a/public/css/site.css b/public/css/site.css
index 949f15f..c4f874c 100644
--- a/public/css/site.css
+++ b/public/css/site.css
@@ -9,12 +9,6 @@
     border-top: 1px solid #eee;
     padding-top: 6px;
 }
-
-.log h4 {
-    white-space: pre;
-    font-family: monospace;
-}
-
 .log p {
     color: #666;
 }
@@ -23,27 +17,33 @@
 	color: #003e80;
 	padding: 3px 8px;
 }
-.log .actions{
-  display:none;
-}
-.log div.col-2 p {
-    margin: 2px 0px 6px;
-    text-overflow: ellipsis;
-    overflow: hidden;
-}
-.log p.author {
-    font-size: .875rem;
-}
-.log p.server {
-    font-weight: bold;
-}
-.log a.actions-toggle.btn-link.btn-sm {
-    margin: 0;
-    padding: 0;
-    color: #007bff;
-    cursor: pointer;
-}
 .log pre {
     font-size: 1.0rem;
     color: #333;
 }
+
+.log .meta a {
+  color: #666;
+  font-size: .875rem;
+}
+.log .meta p {
+    font-size: .875rem;
+    line-height:1em;
+    margin: 0px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.log .meta p.server {
+    color:#333; 
+}
+.log .meta .actions-toggle {
+    margin: 0;
+    padding: 0;
+    color: #666;
+    cursor: pointer;
+    line-height:1em;
+}
+
+.log .meta .actions{
+  display:none;
+}
diff --git a/public/js/app.js b/public/js/app.js
index d06163e..0631fbe 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -51,18 +51,20 @@ function updatePage(data){
     content += `
 
     <div class="log row">
-      <div class="col-2 text-right">
+      <div class="meta col-lg-2 text-right">
+	  <p class="server">  ${escape(item.server)} </p>
 	  <a href="/log/${id}">
 	    ${date(escape(item.created_at))} <br/>
 	  </a>
 	  <div class="d-none d-lg-block">
-		  <p class="server">  ${escape(item.server)} </p>
 		  <p class="author">  ${escape(item.author)} </p>
-		  <a class="actions-toggle btn-link btn-sm">Actions</a>
-	  </div>
-	  <div class="actions btn-group btn-group-sm" role="group" aria-label="log actions">
-	    <a class="destroy btn btn btn-outline-secondary" href="/destroy/${id}">Remove</a>
-	    <a class="edit btn btn btn-outline-secondary" href="/edit/${id}">Edit</a>
+		  <p>
+		    <a class="actions-toggle btn-link btn-sm">Actions</a>
+		  </p>
+		  <div class="actions btn-group btn-group-sm" role="group" aria-label="log actions">
+		    <a class="destroy btn btn btn-outline-secondary" href="/destroy/${id}">Remove</a>
+		    <a class="edit btn btn btn-outline-secondary" href="/edit/${id}">Edit</a>
+		  </div>
 	  </div>
       </div>
       <div class="col-lg">
@@ -97,5 +99,5 @@ $("input").on("keyup",function(e){
 
 updatePage( initData );
 
-$(".actions-toggle").on("click",(e) => { var el=e.target; $(el).next().show(); $(el).hide(); } )
+$(".actions-toggle").on("click",(e) => { var el=e.target; $(el).parent().siblings('.actions').show(); $(el).hide(); } )