Only show item action buttons on hover

frontend/css/style.css

@@ -63,4 +63,17 @@ footer {
 
 footer:hover {
     opacity: 1;
-}
\ No newline at end of file
+}
+
+th {
+    overflow: hidden;
+}
+
+.entry-toolbar {
+    opacity: 0;
+    transition: opacity .25s;
+}
+
+tr:hover .entry-toolbar {
+    opacity: 1;
+}

frontend/index.html

@@ -148,7 +148,7 @@
                             <th>Name</th>
                             <th>Size</th>
                             <th>Modified</th>
-                            <th style="text-align: right;">Action</th>
+                            <th>&nbsp;</th>
                         </tr>
                     </thead>
                     <tbody>
@@ -166,7 +166,12 @@
                             <th>{{ entry.filePath }}</th>
                             <th>{{ entry.size | prettyFileSize }}</th>
                             <th><span v-my-tooltip="foobar" data-toggle="tooltip" title="{{ entry.mtime }}">{{ entry.mtime | prettyDate }}</span></th>
-                            <th style="text-align: right;"><button class="btn btn-sm btn-danger" v-on:click.stop="delAsk(entry)"><i class="fa fa-trash"></i></button></th>
+                            <th style="text-align: right;">
+                                <span class="entry-toolbar">
+                                    <!-- <button class="btn btn-sm btn-default" v-on:click.stop="renameAsk(entry)" title="Rename"><i class="fa fa-pencil"></i></button> -->
+                                    <button class="btn btn-sm btn-danger" v-on:click.stop="delAsk(entry)" title="Delete"><i class="fa fa-trash"></i></button>
+                                </span>
+                            </th>
                         </tr>
                     </tbody>
                 </table>