diff --git a/styles/components/_empty_state.scss b/styles/components/_empty_state.scss index 0e102a4d..12405e05 100644 --- a/styles/components/_empty_state.scss +++ b/styles/components/_empty_state.scss @@ -1,28 +1,20 @@ .empty-state { - text-align: center; - padding: 5rem ($gap * 2) 2rem; - display: flex; - flex-direction: column; - align-items: center; + padding: $gap * 3; max-width: 100%; + background-color: $color-gray-lightest; + margin-top: $gap * 5; - > .icon { - @include icon-size(50); - @include icon-color($color-gray-light); + hr { + margin-left: -$gap * 3; + margin-right: -$gap * 3; } - &__message { - font-weight: $font-bold; - } + &__footer { + text-align: center; - &__sub-message { - @include h4; - - color: $color-gray; - max-width: 100%; - - @include media($large-screen) { - @include h3; + a.usa-button { + width: 60%; + display: inline-block; } } } diff --git a/templates/applications/index.html b/templates/applications/index.html index bc7ae431..2d3e7d42 100644 --- a/templates/applications/index.html +++ b/templates/applications/index.html @@ -24,12 +24,11 @@ {% if not portfolio.applications %} {{ EmptyState( - 'This portfolio doesn’t have any applications', - action_label='Add a new application' if can_create_applications else None, - action_href=url_for('applications.create_new_application_step_1', portfolio_id=portfolio.id) if can_create_applications else None, - icon='cloud', - sub_message=None if can_create_applications else 'Please contact your JEDI Cloud portfolio administrator to set up a new application.', - add_perms=can_create_applications + header="You don't have any Applications yet", + message="You can manage multiple Applications within a single Portfolio as long as the funding sources are the same.", + button_text="Create Your First Application", + button_link=url_for("applications.view_new_application_step_1", portfolio_id=portfolio.id), + view_only_text="Contact your portfolio administrator to add an application." ) }} {% else %} diff --git a/templates/components/empty_state.html b/templates/components/empty_state.html index a9d9ff5e..9989e4f8 100644 --- a/templates/components/empty_state.html +++ b/templates/components/empty_state.html @@ -1,20 +1,14 @@ -{% from "components/icon.html" import Icon %} - -{% macro EmptyState(message, action_label, action_href, icon=None, sub_message=None, add_perms=True) -%} -
{{ message }}
+