From c3db3322df4650f0073103c6d78fd132bccb6736 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Wed, 9 Oct 2019 16:47:20 -0400 Subject: [PATCH] Style portfolio header menu icons --- static/icons/applications.svg | 14 +------------- static/icons/funding.svg | 14 +------------- styles/components/_portfolio_layout.scss | 19 ++++++++++++++----- templates/portfolios/header.html | 18 +++++++++--------- translations.yaml | 4 ++-- 5 files changed, 27 insertions(+), 42 deletions(-) diff --git a/static/icons/applications.svg b/static/icons/applications.svg index d0768feb..b747f80b 100644 --- a/static/icons/applications.svg +++ b/static/icons/applications.svg @@ -1,13 +1 @@ - - - - Combined Shape - Created with Sketch. - - - - - - - - \ No newline at end of file + \ No newline at end of file diff --git a/static/icons/funding.svg b/static/icons/funding.svg index a765aeb7..ae7cf81e 100644 --- a/static/icons/funding.svg +++ b/static/icons/funding.svg @@ -1,13 +1 @@ - - - - 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 292ab5be..fac56c0b 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -75,17 +75,26 @@ font-size: $small-font-size; .icon-link { - padding: 0.8rem 1.6rem; + padding: $gap; + border-radius: 0; + color: $color-blue-darkest; + + &:hover { + background-color: $color-aqua-lightest; + } - color: $color-gray; - opacity: 0.3; .icon { - @include icon-color($color-gray); + @include icon-color($color-blue-darkest); } &.active { - opacity: 1; color: $color-blue; + background-color: $color-gray-lightest; + + &:hover { + background-color: $color-aqua-lightest; + } + .icon { @include icon-color($color-blue); } diff --git a/templates/portfolios/header.html b/templates/portfolios/header.html index 45a82e98..63684d92 100644 --- a/templates/portfolios/header.html +++ b/templates/portfolios/header.html @@ -18,7 +18,14 @@
- {% if user_can(permissions.VIEW_PORTFOLIO_FUNDING) %} + {% if user_can(permissions.VIEW_PORTFOLIO_ADMIN) %} + {{ Link( + icon='cog', + text='navigation.portfolio_navigation.breadcrumbs.admin' | translate, + url=url_for("portfolios.admin", portfolio_id=portfolio.id), + active=request.url_rule.endpoint == "portfolios.admin", + ) }} + {% endif %}{% if user_can(permissions.VIEW_PORTFOLIO_FUNDING) %} {{ Link( icon='funding', text='navigation.portfolio_navigation.breadcrumbs.funding' | translate, @@ -40,13 +47,6 @@ active=request.url_rule.endpoint == "portfolios.reports", ) }} {% endif %} - {% if user_can(permissions.VIEW_PORTFOLIO_ADMIN) %} - {{ Link( - icon='cog', - text='navigation.portfolio_navigation.breadcrumbs.admin' | translate, - url=url_for("portfolios.admin", portfolio_id=portfolio.id), - active=request.url_rule.endpoint == "portfolios.admin", - ) }} - {% endif %} +
diff --git a/translations.yaml b/translations.yaml index f9f61da5..7c5e21f1 100644 --- a/translations.yaml +++ b/translations.yaml @@ -283,8 +283,8 @@ login: navigation: portfolio_navigation: breadcrumbs: - admin: Admin - funding: Funding + admin: Settings + funding: Task Orders reports: Reports applications: Applications topbar: