diff --git a/atst/ui_modules.py b/atst/ui_modules.py index 748ca980..96bdab07 100644 --- a/atst/ui_modules.py +++ b/atst/ui_modules.py @@ -46,3 +46,12 @@ class SidenavItem(UIModule): active=active, icon=icon, subnav=subnav) + +class EmptyState(UIModule): + def render(self, message, actionLabel, actionHref, icon=None): + return self.render_string( + "components/empty_state.html.to", + message=message, + actionLabel=actionLabel, + actionHref=actionHref, + icon=icon) diff --git a/scss/components/_empty_state.scss b/scss/components/_empty_state.scss index d11f5083..be8675ad 100644 --- a/scss/components/_empty_state.scss +++ b/scss/components/_empty_state.scss @@ -1,15 +1,27 @@ .empty-state { text-align: center; - padding-top: 10rem; - - p { - font-family: $font-sans; - font-weight: 300; - line-height: 10rem; - font-size: 44px; - line-height: 5rem; - margin: 0 auto; - padding-bottom: 2rem; - max-width: 40%; + padding: 6rem ($gap * 2) 0; + display: flex; + flex-direction: column; + align-items: center; + + @include media($medium-screen) { + padding: 8rem ($gap * 4) 0; } -} \ No newline at end of file + + .icon { + @include icon-size(50); + @include icon-color($color-gray-light); + } + + p { + @include h2; + line-height: 1.2; + max-width: 15em; + color: $color-gray; + + @include media($large-screen) { + @include h1; + } + } +} diff --git a/templates/components/empty_state.html.to b/templates/components/empty_state.html.to new file mode 100644 index 00000000..30246ddb --- /dev/null +++ b/templates/components/empty_state.html.to @@ -0,0 +1,9 @@ +
+

{{ message }}

+ + {% if icon %} + {% module Icon(icon) %} + {% end %} + + {{ actionLabel }} +
diff --git a/templates/requests.html.to b/templates/requests.html.to index 66dbcd9d..bd0c9e8c 100644 --- a/templates/requests.html.to +++ b/templates/requests.html.to @@ -31,67 +31,79 @@ {% block content %} +{% if not requests %} -{% module Alert('Pending Financial Verification', - message="

Your next step is to create a Task Order (T.O.) associated with JEDI Cloud. Please consult a Contracting Officer (KO) or Contracting Officer Representative (COR) to help with this step.

" -) %} + {% module EmptyState( + 'There are currently no active requests for you to see.', + actionLabel='Create a new JEDI Cloud Request', + actionHref='/requests/new', + icon='document' + )%} -
+{% else %} - +
-
- - - - - - - - - - - - - {% for r in requests %} - - + +
+ + + +
+ +
+ + +
+ + +
+
Order IDRequest DateRequesterTotal AppsStatusActions
- {{ r['order_id'] }} - {% if r['is_new'] %}New -
+ + + + + + + + + + + + {% for r in requests %} + + + {% end %} + + + + + + {% end %} - - - - - - - {% end %} - -
Order IDRequest DateRequesterTotal AppsStatusActions
+ {{ r['order_id'] }} + {% if r['is_new'] %}New + {{ r['date'] }}{{ r['full_name'] }}{{ r['app_count'] }}{{ r['status'] }} + Download + Approval +
{{ r['date'] }}{{ r['full_name'] }}{{ r['app_count'] }}{{ r['status'] }} - Download - Approval -
+ + +
-
+ +{% end %} {% end %} diff --git a/templates/workspace_members.html.to b/templates/workspace_members.html.to index a27a0b0b..074628da 100644 --- a/templates/workspace_members.html.to +++ b/templates/workspace_members.html.to @@ -2,91 +2,73 @@ {% block workspace_content %} +{% if not members %} - +{% else %} -{#
-
-
- + + + +
+ + + + + + + + + + + {% for m in members %} + + + + + + + {% end %} + +
Name Status FlagStatusWorkspace Role
{{ m['first_name'] }} {{ m['last_name'] }}{% if m['num_projects'] == '0' %} No Project Access {% end %}{{ m['status'] }}{{ m['workspace_role'] }}
-
#} - - -
- - - - - - - - - - - {% for m in members %} - - - - - - - {% end %} - -
Name Status FlagStatusWorkspace Role
{{ m['first_name'] }} {{ m['last_name'] }}{% if m['num_projects'] == '0' %} No Project Access {% end %}{{ m['status'] }}{{ m['workspace_role'] }}
-
+{% end %} {% end %} diff --git a/templates/workspace_projects.html.to b/templates/workspace_projects.html.to index e4008c3c..34b0933b 100644 --- a/templates/workspace_projects.html.to +++ b/templates/workspace_projects.html.to @@ -2,31 +2,44 @@ {% block workspace_content %} -{% for project in projects %} -
-
-

{{ project['name'] }} ({{ len(project['environments'])}} environments)

- - {% module Icon('edit') %} - edit - -
- -
{% end %} {% end %}