diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 87c080c2..14a39615 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -233,6 +233,26 @@ font-size: 1.6rem; border-top: 0; padding: 3 * $gap 2 * $gap; + + .usa-button-secondary { + color: $color-red; + background-color: $color-red-lightest; + box-shadow: inset 0 0 0 1px $color-red; + } + + .usa-button-disabled { + color: $color-gray-medium; + background-color: $color-gray-lightest; + box-shadow: inset 0 0 0 1px $color-gray-medium; + } + + button { + padding: 0; + margin: 0; + font-size: 1.5rem; + width: 11rem; + height: 3rem; + } } .green { @@ -248,6 +268,15 @@ } } + .usa-button-disabled { + color: $color-gray; + } + + .usa-button-secondary { + color: $color-red; + background-color: $color-red-light; + } + .add-member-link { text-align: right; } diff --git a/templates/fragments/admin/portfolio_members.html b/templates/fragments/admin/portfolio_members.html index b9301368..f08f2ae6 100644 --- a/templates/fragments/admin/portfolio_members.html +++ b/templates/fragments/admin/portfolio_members.html @@ -40,6 +40,9 @@ {{ member_data.member.user_name }} {% if member_data.member.user == user %} (you) + {% set archive_button_class = 'usa-button-disabled' %} + {% else %} + {% set archive_button_class = 'usa-button-secondary' %} {% endif %} {% set heading_perms = [member_data.app_mgmt, member_data.funding, member_data.reporting, member_data.portfolio_mgmt] %} @@ -52,6 +55,9 @@ {% endif %} {% endfor %} + + + {% endfor %} diff --git a/translations.yaml b/translations.yaml index 37b28d51..cb3e9102 100644 --- a/translations.yaml +++ b/translations.yaml @@ -568,6 +568,7 @@ portfolios: settings_info: Learn more about these settings activity_log_title: Activity Log members: + archive_button: Archive User permissions: name: Name app_mgmt: App Mgmt