draft style

src/client/js/components/PageList/Draft.jsx

@@ -6,13 +6,17 @@ export default class Draft extends React.Component {
   render() {
     return (
       <li className="page-list-li d-flex align-items-center">
-        <a className="page-list-link" href={this.props.draft.path}>
-          {this.props.draft.path}
-        </a>
         <a href={`${this.props.draft.path}#edit`} target="_blank" rel="noopener noreferrer">
-          <button type="button">Resume</button>
+          <button type="button" className="btn-primary p-0">
+            <span className="icon-note"></span>
+          </button>
+        </a>
+        <button type="button" className="btn-danger p-0" onClick={() => { return this.props.clearDraft(this.props.draft.path) }}>
+          <span className="icon-trash"></span>
+        </button>
+        <a className="page-list-link px-3" href={this.props.draft.path}>
+          {this.props.draft.path}
         </a>
-        <button type="button" onClick={() => { return this.props.clearDraft(this.props.draft.path) }}>Delete</button>
       </li>
     );
   }

src/client/styles/scss/_user.scss

@@ -24,17 +24,19 @@
 
       ul {
         padding-left: 0;
+
         li {
           list-style: none;
         }
       }
+
       .user-page-username {
         font-weight: bold;
       }
-      .user-page-email {
-      }
-      .user-page-introduction {
-      }
+
+      .user-page-email {}
+
+      .user-page-introduction {}
     }
 
     .btn-like,
@@ -62,4 +64,16 @@
       height: 48px;
     }
   }
+
+  .user-page-content {
+    #user-draft-list {
+      button {
+        $size: 1.5em;
+
+        width: $size;
+        height: $size;
+        border-radius: 50%;
+      }
+    }
+  }
 }