Change the board import layout from a popup to a full page

This commit also removes the “import a single Trello card” as we couldn’t figure
out some reasonable use case.

We also create a new publication on the server to provide the minimal user
profile informations required to display an avatar.

client/components/import/import.jade

@@ -1,39 +1,52 @@
-template(name="importPopup")
-  if error.get
-    .warning {{_ error.get}}
+template(name="importHeaderBar")
+  h1
+    a.back-btn(href="{{pathFor 'home'}}")
+      i.fa.fa-chevron-left
+    | {{_ 'import-board-title'}}
+
+template(name="import")
+  .wrapper
+    if error.get
+      .warning {{_ error.get}}
+    +Template.dynamic(template=currentTemplate)
+
+template(name="importTextarea")
   form
-    p: label(for='import-textarea') {{_ getLabel}}
-    textarea#import-textarea.js-import-json(placeholder="{{_ 'import-json-placeholder'}}" autofocus)
+    p: label(for='import-textarea') {{_ 'import-board-trello-instruction'}}
+    textarea.js-import-json(placeholder="{{_ 'import-json-placeholder'}}" autofocus)
       | {{jsonText}}
-    if membersMapping
-      div
-        a.show-mapping
-          | {{_ 'import-show-user-mapping'}}
     input.primary.wide(type="submit" value="{{_ 'import'}}")
 
-template(name="mapMembersPopup")
+template(name="importMapMembers")
+  h2 {{_ 'import-map-members'}}
   .map-members
     p {{_ 'import-members-map'}}
     .mapping-list
       each members
-        .mapping
-          a.source
-            div.full-name
-              = fullName
-            div.username
+        a.mapping-item.js-select-member(class="{{#if wekan}}filled{{/if}}")
+          .profile-source
+            .full-name= fullName
+            .username
               | ({{username}})
           .wekan
             if wekan
               +userAvatar(userId=wekan._id)
             else
-              a.member.add-member.js-add-members
+              a.member.add-member
                 i.fa.fa-plus
+      //-
+        Due to the way the flewbox layout is working, we need to set some
+        invisible items so that the last row items have a consistent width.
+        See http://jsfiddle.net/Ln4h3c4n/ for an minimal example of the issue.
+      .mapping-item.ghost-item
+      .mapping-item.ghost-item
+      .mapping-item.ghost-item
+      .mapping-item.ghost-item
+      .mapping-item.ghost-item
     form
       input.primary.wide(type="submit" value="{{_ 'done'}}")
 
-      template(name="addMemberPopup")
-
-template(name="mapMembersAddPopup")
+template(name="importMapMembersAddPopup")
   .select-member
     p
       | {{_ 'import-user-select'}}