diff --git a/static/icons/applications.svg b/static/icons/applications.svg new file mode 100644 index 00000000..d0768feb --- /dev/null +++ b/static/icons/applications.svg @@ -0,0 +1,13 @@ + + + + Combined Shape + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/static/icons/funding.svg b/static/icons/funding.svg new file mode 100644 index 00000000..a765aeb7 --- /dev/null +++ b/static/icons/funding.svg @@ -0,0 +1,13 @@ + + + + Shape + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index c555ed13..3416aa08 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -14,57 +14,13 @@ } } -.portfolio-breadcrumbs { - margin-bottom: $gap * 2; - color: $color-gray-dark; - font-size: $h5-font-size; - - .icon-link { - color: $color-blue; - font-weight: normal; - } - - .icon--tiny { - padding: $gap 0; - } - - .icon { - @include icon-color($color-blue); - margin: 0 ($gap * 0.5) 0 0; - } - - .portfolio-breadcrumbs__home { - &.icon-link--disabled { - color: $color-gray-dark; - opacity: 1; - .icon { - @include icon-color($color-gray-dark); - } - } - } - - .portfolio-breadcrumbs__crumb { - .icon { - @include icon-color($color-gray-medium); - } - - .icon-link { - color: $color-gray-medium; - pointer-events: none; - &.icon-link--disabled { - opacity: 1; - } - } - } -} - .portfolio-header { flex-direction: column; @include media($small-screen) { flex-direction: row; } - margin: 2 * $gap; + margin-bottom: $gap * 4; .col--grow { overflow: inherit; @@ -72,6 +28,10 @@ .portfolio-header__name { @include h1; + h1 { + margin: ($gap * 2) $gap ($gap * 2) $gap; + font-size: 3.5rem; + } } .portfolio-header__budget { @@ -98,11 +58,19 @@ font-size: $small-font-size; .icon-link { - padding: 0.8rem 1.2rem; + padding: 0.8rem 1.6rem; + + color: $color-gray; + opacity: 0.3; + .icon { + @include icon-color($color-gray); + } + &.active { - color: $color-gray; + opacity: 1; + color: $color-blue; .icon { - @include icon-color($color-gray); + @include icon-color($color-blue); } } diff --git a/templates/portfolios/admin.html b/templates/portfolios/admin.html index 40010a53..c2539c2f 100644 --- a/templates/portfolios/admin.html +++ b/templates/portfolios/admin.html @@ -4,8 +4,6 @@ {% from "components/text_input.html" import TextInput %} {% from 'components/save_button.html' import SaveButton %} -{% set secondary_breadcrumb = "navigation.portfolio_navigation.portfolio_admin" | translate %} - {% block portfolio_content %}
diff --git a/templates/portfolios/base.html b/templates/portfolios/base.html index 92479d0f..127200c3 100644 --- a/templates/portfolios/base.html +++ b/templates/portfolios/base.html @@ -4,10 +4,6 @@
- {% block portfolio_breadcrumbs %} - {% include "portfolios/breadcrumbs.html" %} - {% endblock %} -
{% block portfolio_header %} {% include "portfolios/header.html" %} {% endblock %} diff --git a/templates/portfolios/breadcrumbs.html b/templates/portfolios/breadcrumbs.html deleted file mode 100644 index ec6dcc6f..00000000 --- a/templates/portfolios/breadcrumbs.html +++ /dev/null @@ -1,19 +0,0 @@ -{% from "components/icon.html" import Icon %} - -
- - {{ Icon("home") }} - - {{ portfolio.name }} Portfolio - - -
- {% if secondary_breadcrumb %} - {{ Icon("caret_right", classes="icon--tiny") }} -
- {{ secondary_breadcrumb }} -
- {% endif %} -
-
diff --git a/templates/portfolios/header.html b/templates/portfolios/header.html index d1928123..44a528ce 100644 --- a/templates/portfolios/header.html +++ b/templates/portfolios/header.html @@ -2,7 +2,7 @@ {% from "components/tooltip.html" import Tooltip %} {% macro Link(icon, text, url, active=False) %} - +
{{ Icon(icon) }}
{{ text }}
@@ -13,24 +13,7 @@
- {{ secondary_breadcrumb or portfolio.name }} -
-
-
- Available budget - {{ - Tooltip( - ('portfolios.task_orders.available_budget_help_description' | translate), - title='' - ) - }} -
-
- - - - -
+

{{ portfolio.name }}

@@ -40,6 +23,18 @@
+ {{ Link( + icon='funding', + text='navigation.portfolio_navigation.breadcrumbs.funding' | translate, + url=url_for("task_orders.portfolio_funding", portfolio_id=portfolio.id), + active=request.url_rule.endpoint == "task_orders.portfolio_funding", + ) }} + {{ Link( + icon='applications', + text='navigation.portfolio_navigation.breadcrumbs.applications' | translate, + url=url_for("applications.portfolio_applications", portfolio_id=portfolio.id), + active=request.url_rule.endpoint == "applications.portfolio_applications", + ) }} {% if user_can(permissions.VIEW_PORTFOLIO_REPORTS) %} {{ Link( icon='chart-pie', @@ -48,12 +43,6 @@ active=request.url_rule.endpoint == "portfolios.reports", ) }} {% endif %} - {{ Link( - icon='dollar-sign', - text='navigation.portfolio_navigation.breadcrumbs.funding' | translate, - url=url_for("task_orders.portfolio_funding", portfolio_id=portfolio.id), - active=request.url_rule.endpoint == "task_orders.portfolio_funding", - ) }} {% if user_can(permissions.VIEW_PORTFOLIO_ADMIN) %} {{ Link( icon='cog', diff --git a/templates/portfolios/reports/index.html b/templates/portfolios/reports/index.html index b67ce156..4c997ac6 100644 --- a/templates/portfolios/reports/index.html +++ b/templates/portfolios/reports/index.html @@ -3,8 +3,6 @@ {% from "components/icon.html" import Icon %} {% from "components/empty_state.html" import EmptyState %} -{% set secondary_breadcrumb = "navigation.portfolio_navigation.breadcrumbs.reports" | translate %} - {% block portfolio_content %}
diff --git a/templates/portfolios/task_orders/index.html b/templates/portfolios/task_orders/index.html index 309e7664..e95a7a7f 100644 --- a/templates/portfolios/task_orders/index.html +++ b/templates/portfolios/task_orders/index.html @@ -4,8 +4,6 @@ {% extends "portfolios/base.html" %} -{% set secondary_breadcrumb = "navigation.portfolio_navigation.breadcrumbs.funding" | translate %} - {% block portfolio_content %} {% macro ViewLink(task_order) %} diff --git a/tests/routes/portfolios/test_admin.py b/tests/routes/portfolios/test_admin.py index 569dc5cc..52ae1965 100644 --- a/tests/routes/portfolios/test_admin.py +++ b/tests/routes/portfolios/test_admin.py @@ -1,4 +1,5 @@ from flask import url_for +from unittest.mock import Mock from atst.domain.permission_sets import PermissionSets from atst.domain.portfolio_roles import PortfolioRoles @@ -110,7 +111,7 @@ def test_no_update_member_permissions_without_edit_access(client, user_session): def test_rerender_admin_page_if_member_perms_form_does_not_validate( - client, user_session + client, user_session, monkeypatch ): portfolio = PortfolioFactory.create() user = UserFactory.create() @@ -128,13 +129,12 @@ def test_rerender_admin_page_if_member_perms_form_does_not_validate( "members_permissions-0-perms_portfolio_mgmt": "view_portfolio_admin", } - response = client.post( - url_for("portfolios.edit_members", portfolio_id=portfolio.id), - data=form_data, - follow_redirects=True, + mock_route = Mock() + monkeypatch.setattr("atst.routes.portfolios.admin.render_admin_page", mock_route) + client.post( + url_for("portfolios.edit_members", portfolio_id=portfolio.id), data=form_data ) - assert response.status_code == 200 - assert "Portfolio Administration" in response.data.decode() + mock_route.assert_called() def test_cannot_update_portfolio_ppoc_perms(client, user_session): diff --git a/translations.yaml b/translations.yaml index d6601539..9e5af217 100644 --- a/translations.yaml +++ b/translations.yaml @@ -394,6 +394,7 @@ navigation: admin: Admin funding: Funding reports: Reports + applications: Applications budget_report: Budget Report portfolio_admin: Portfolio Administration portfolio_funding: Funding