From 92e65e75951db4d8bf927f07cebc380c3f9bd96b Mon Sep 17 00:00:00 2001
From: Luis Cielak <luis+dds@promptworks.com>
Date: Mon, 30 Jul 2018 17:26:07 -0400
Subject: [PATCH] Add member placeholder info

---
 templates/member_edit.html.to                 | 73 ++++++++-----------
 .../navigation/workspace_navigation.html.to   | 32 ++++----
 templates/workspace_members.html              | 16 ++--
 3 files changed, 51 insertions(+), 70 deletions(-)

diff --git a/templates/member_edit.html.to b/templates/member_edit.html.to
index 24893bf2..d454152c 100644
--- a/templates/member_edit.html.to
+++ b/templates/member_edit.html.to
@@ -16,40 +16,39 @@
   level="info"
   ) %}
 
-  <div class='panel member-card'>
-    <div class='member-card__header'>
-      <h1 class='member-card__heading'>{{ member_name }}</h1>
-      <dl><dt>Workspace Role</dt> <dd><span class='label label--info'>{{member_workspace_role}}</span></dd></dl>
-    </div>
-    <div class='member-card__details'>
-      <dl>
-        <div>
-          <dt>DOD ID:</dt>
-          <dd>{{ member_id }}</dd>
-        </div>
-        <div>
-          <dt>Email:</dt>
-          <dd>{{ member_email }}</dd>
-        </div>
-      </dl>
-      <a href='#' class='icon-link'>edit account details</a>
+
+  <div class='panel'>
+    <div class='panel__heading'>
+      <h1 class='h2'>
+        {% if is_new_member %}
+        Add new member
+        {% else %}
+        {{ member_name }}
+        {% end %}
+      </h1>
+      <div>Workspace Role</span> <span class="label">{{member_workspace_role}}</div>
     </div>
   </div>
 
-  <form class='search-bar'>
-    <div class='usa-input search-input'>
-      <label for='project-search'>Search by project name</label>
-      <input type='search' id='project-search' name='project-search' placeholder="Search by project name"/>
-      <button type="submit">
-        <span class="hide">Search</span>
-      </button>
+
+  <div class='panel panel__actions'>
+    <div class='row'>
+      <div class='col col--grow'>
+        <form class="usa-search usa-search-small">
+          <label class="usa-sr-only" for="search-field-small">Search small</label>
+          <input id="search-field-small" type="search" name="search" placeholder="Search by project name">
+          <button type="submit">
+            <span class="usa-sr-only">Search</span>
+          </button>
+        </form>
+      </div>
     </div>
-  </form>
+  </div>
 
   <div class='block-list project-list-item'>
     <header class='block-list__header'>
-      <h2 class='block-list__title'>{% module Icon('arrow-down') %} Code.mil</h2>
-      <span><a href="#" class="icon-link icon-link--danger">revoke all access</a></span>
+      <h2 class='block-list__title'>Code.mil</h2>
+      <a class="block-list__header__link icon-link icon-link--danger">revoke all access</a>
     </header>
     <ul>
       <li class='block-list__item project-list-item__environment'>
@@ -57,15 +56,7 @@
           Development
         </span>
         <div class='project-list-item__environment__actions'>
-          <span class="label">no access </span><a href="#" class="icon-link">set role</a>
-        </div>
-      </li>
-      <li class='block-list__item project-list-item__environment'>
-        <span class='project-list-item__environment'>
-          Sandbox
-        </span>
-        <div class='project-list-item__environment__actions'>
-          <span class="label">no access</span><a href="#" class="icon-link">set role</a>
+          <span>no access</span><a href="#" class="icon-link">set role</a>
         </div>
       </li>
       <li class='block-list__item project-list-item__environment'>
@@ -73,17 +64,11 @@
           Production
         </span>
         <div class='project-list-item__environment__actions'>
-        <span class="label label--success">Billing</span><a href="#" class="icon-link">set role</a>
+          <span>Billing</span><a href="#" class="icon-link">set role</a>
         </div>
       </li>
-    </ul>
-  </div>
 
-  <div class='block-list project-list-item'>
-    <header class='block-list__header'>
-      <h2 class='block-list__title'>{% module Icon('arrow-right') %} Digital Dojo</h2>
-      <span class="label">no access</span>
-    </header>
+    </ul>
   </div>
 
   <div class='action-group'>
diff --git a/templates/navigation/workspace_navigation.html.to b/templates/navigation/workspace_navigation.html.to
index d516c1b0..65a9525b 100644
--- a/templates/navigation/workspace_navigation.html.to
+++ b/templates/navigation/workspace_navigation.html.to
@@ -1,44 +1,42 @@
-{% from "components.html" import SidenavItem %}
-
 <nav class='sidenav workspace-navigation'>
   <ul>
-    {{ SidenavItem(
+    {% module SidenavItem(
       "Projects",
-      href=url_for("workspaces.workspace_projects", workspace_id="123456"),
-      active=g.matchesPath('\/workspaces\/[A-Za-z0-9]*\/projects'),
+      href=reverse_url('workspace_projects', '123456'),
+      active=matchesPath('\/workspaces\/[A-Za-z0-9]*\/projects'),
       subnav=[
         {
           "label": "Add New Project",
           "href":"/",
-          "active": g.matchesPath('workspaces/projects/new'),
+          "active": matchesPath('workspaces/projects/new'),
           "icon": "plus"
         }
       ]
-    )}}
+    )%}
 
-    {{ SidenavItem(
+    {% module SidenavItem(
       "Members",
-      href="/workspaces/{}/members".format('123456'),
-      active=g.matchesPath('\/workspaces\/[A-Za-z0-9]*\/members'),
+      href=reverse_url('workspace_members', '123456'),
+      active=matchesPath('\/workspaces\/[A-Za-z0-9]*\/members'),
       subnav=[
         {
           "label": "Add New Member",
           "href": "",
-          "active": g.matchesPath('/workspaces/members/new'),
+          "active": matchesPath('/workspaces/members/new'),
           "icon": "plus"
         },
         {
           "label": "Editing Member",
           "href": "",
-          "active": g.matchesPath('/workspaces/123456/members/789/edit')
+          "active": matchesPath('/workspaces/123456/members/789/edit')
         }
       ]
-    )}}
+    )%}
 
-    {{ SidenavItem(
+    {% module SidenavItem(
       "Funding & Reports",
-      href=url_for("workspaces.workspace_projects", workspace_id="123456"),
-      active=g.matchesPath('\/workspaces\/[A-Za-z0-9]*\/reports')
-    )}}
+      href=reverse_url('workspace_projects', '123456'),
+      active=matchesPath('\/workspaces\/[A-Za-z0-9]*\/reports')
+    )%}
   </ul>
 </nav>
diff --git a/templates/workspace_members.html b/templates/workspace_members.html
index 989d1d0e..0f538b05 100644
--- a/templates/workspace_members.html
+++ b/templates/workspace_members.html
@@ -1,17 +1,15 @@
-{% from "components.html" import EmptyState %}
-
-{% extends "base_workspace.html" %}
+{% extends "base_workspace.html.to" %}
 
 {% block workspace_content %}
 
 {% if not members %}
 
-  {{ EmptyState(
+  {% module EmptyState(
     'There are currently no members in this Workspace.',
     actionLabel='Invite a new Member',
     actionHref='/members/new',
     icon='avatar'
-  )}}
+  )%}
 
 
 {% else %}
@@ -61,17 +59,17 @@
         {% for m in members %}
         <tr>
           <td><a href="/workspaces/123456/members/789/edit" class="icon-link icon-link--large">{{ m['first_name'] }} {{ m['last_name'] }}</a></td>
-          <td class='table-cell--shrink'>{% if m['num_projects'] == '0' %} <span class="label label--info">No Project Access</span> {% endif %}</td>
+          <td class='table-cell--shrink'>{% if m['num_projects'] == '0' %} <span class="label label--info">No Project Access</span> {% end %}</td>
           <td>{{ m['status'] }}</a></td>
           <td>{{ m['workspace_role'] }}</a></td>
         </tr>
-        {% endfor %}
+        {% end %}
       </tbody>
     </table>
   </div>
 
-{% endif %}
+{% end %}
 
 
-{% endblock %}
+{% end %}