logs-content: Added move up/down mutations

marko/page/logs-content/components/post/component.js

@@ -4,11 +4,24 @@ module.exports = class {
       shortName: "",
       name: "",
       text: "",
+      modal: null,
     }
 
     this.updatePost(input)
   }
 
+  open(modal) {
+    this.state.modal == modal
+  }
+
+  close() {
+    this.state.modal = null
+  }
+
+  move(toPosition) {
+    this.emit("move", toPosition)
+  }
+
   onInput(input) {
     if (this.state == null) {
       return

marko/page/logs-content/components/post/index.marko

@@ -1,5 +1,11 @@
 <div class=["post", component.kindClass("post-type")]>
   <div class="post-meta-row">
+    <div class="options color-menu">
+      <a if(input.post.position != 1) on-click("move", input.post.position - 1)>Up</a>
+      <a if(!input.last) on-click("move", input.post.position + 1)>Down</a>
+      <!--<a on-click("open", "edit") >Edit</a>-->
+      <!--<a on-click("open", "remove") >Remove</a>-->
+    </div>
     <post-meta kind="timestamp" value=input.post.time />
     <post-meta kind="nick" value=input.post.nick />
   </div>

marko/page/logs-content/components/post/style.less

@@ -1,11 +1,31 @@
 div.post {
   margin-bottom: 1ch;
 
-  .post-meta-row {
+  div.post-meta-row {
     padding: 0;
     margin: 0;
   }
-  
+
+  div.options {
+    position: absolute;
+    text-align: right;
+    width: calc(100% - 35.5ch);
+    max-width: 75ch;
+
+    a {
+      display: inline-block;
+      padding: 0 0.5ch;
+      
+      opacity: 0.5;
+      
+      cursor: pointer;
+      user-select: none;
+    }
+    a:hover {
+      opacity: 1;
+    }
+  }
+
   div.post-body {
     font-size: 1.25em;