From e6254e6f64cb9cf12995e15576c82f0116e208f3 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Wed, 9 Oct 2019 16:26:04 -0400 Subject: [PATCH 1/7] Update text in portfolio header and application sticky CTA --- styles/components/_portfolio_layout.scss | 8 +++++++- templates/applications/base.html | 2 +- templates/components/sticky_cta.html | 9 +-------- templates/portfolios/header.html | 1 + translations.yaml | 1 + 5 files changed, 11 insertions(+), 10 deletions(-) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index c1af4db4..292ab5be 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -29,9 +29,15 @@ &__name { @include h1; h1 { - margin: ($gap * 2) $gap ($gap * 2) $gap; + margin: 0 $gap ($gap * 2) 0; font-size: 3.5rem; } + + p { + font-size: $small-font-size; + margin: 0 0 (-$gap * 0.5); + color: $color-gray-medium; + } } &__budget { diff --git a/templates/applications/base.html b/templates/applications/base.html index a8ef0c7c..4f47e9ad 100644 --- a/templates/applications/base.html +++ b/templates/applications/base.html @@ -5,7 +5,7 @@ {% block portfolio_header %} {% include "portfolios/header.html" %} {% if application %} - {{ StickyCTA(text=application.name, return_link_url=url_for('applications.portfolio_applications', portfolio_id=application.portfolio_id), return_link_text="BACK TO APPLICATIONS") }} + {{ StickyCTA(text=application.name) }} {% endif %} {% endblock %} diff --git a/templates/components/sticky_cta.html b/templates/components/sticky_cta.html index 3d66dd6a..3def43ee 100644 --- a/templates/components/sticky_cta.html +++ b/templates/components/sticky_cta.html @@ -1,14 +1,7 @@ {% from 'components/icon.html' import Icon %} -{% macro StickyCTA(text, context=None, return_link_url=None, return_link_text=None) -%} +{% macro StickyCTA(text, context=None) -%}
- {% if return_link_url and return_link_text %} -
- - {{ Icon('caret_left', classes="icon--tiny icon--blue") }} {{ return_link_text}} - -
- {% endif %}

{{ text }}

diff --git a/templates/portfolios/header.html b/templates/portfolios/header.html index 8e4110b6..45a82e98 100644 --- a/templates/portfolios/header.html +++ b/templates/portfolios/header.html @@ -13,6 +13,7 @@
+

{{ "portfolios.header" | translate }}

{{ portfolio.name }}

diff --git a/translations.yaml b/translations.yaml index 268b7bd0..f9f61da5 100644 --- a/translations.yaml +++ b/translations.yaml @@ -424,6 +424,7 @@ portfolios: empty: start_button: Start a new JEDI portfolio title: You have no apps yet + header: PORTFOLIO members: archive_button: Delete member permissions: From c3db3322df4650f0073103c6d78fd132bccb6736 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Wed, 9 Oct 2019 16:47:20 -0400 Subject: [PATCH 2/7] 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: From 5a98e6966ee8bb1ef9ff858917b5ed7208a00018 Mon Sep 17 00:00:00 2001 From: leigh-mil Date: Thu, 10 Oct 2019 11:11:53 -0400 Subject: [PATCH 3/7] Styling for name and description section: As part of this, the empty placeholder span was removed from the text input macro and the span will now be conditionall rendered if there is an error message --- styles/components/_portfolio_layout.scss | 7 +------ styles/core/_grid.scss | 4 ++++ templates/applications/settings.html | 25 ++++++++---------------- templates/components/text_input.html | 10 +++------- translations.yaml | 6 +++--- 5 files changed, 19 insertions(+), 33 deletions(-) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index fac56c0b..d2a1998b 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -136,7 +136,7 @@ } .portfolio-content { - margin: 1 * $gap $gap 0 $gap; + margin: (4 * $gap) $gap 0 $gap; .panel { @include shadow-panel; @@ -148,11 +148,6 @@ padding-bottom: 0; } - .subheading { - font-size: 1.4rem; - color: $color-gray; - } - .responsive-table-wrapper { padding-bottom: $gap * 3; margin-bottom: 0; diff --git a/styles/core/_grid.scss b/styles/core/_grid.scss index f7037d42..ef264cd8 100644 --- a/styles/core/_grid.scss +++ b/styles/core/_grid.scss @@ -44,4 +44,8 @@ flex-grow: 1; padding-right: $spacing-small; } + + &.col--half { + width: 50%; + } } diff --git a/templates/applications/settings.html b/templates/applications/settings.html index 362d4e7b..06c47b8e 100644 --- a/templates/applications/settings.html +++ b/templates/applications/settings.html @@ -19,26 +19,16 @@ {% block application_content %} -
{{ 'portfolios.applications.settings.name_description' | translate }}
+

{{ 'portfolios.applications.settings.name_description' | translate }}

{% if user_can(permissions.EDIT_APPLICATION) %} -
-
-
- {{ application_form.csrf_token }} -
-
- {{ TextInput(application_form.name, optional=False) }} - {{ TextInput(application_form.description, paragraph=True, optional=True) }} -
-
-
-
-
- {{ SaveButton('common.save_changes'|translate) }} -
-
+ + {{ application_form.csrf_token }} + {{ TextInput(application_form.name, optional=False) }} + {{ TextInput(application_form.description, paragraph=True, optional=True, showOptional=False) }} +
+ {{ SaveButton('common.save_changes'|translate) }}
@@ -71,6 +61,7 @@
{% endif %} +
{{ MemberManagementTemplate( application, diff --git a/templates/components/text_input.html b/templates/components/text_input.html index 9b9cb279..69ebd727 100644 --- a/templates/components/text_input.html +++ b/templates/components/text_input.html @@ -15,6 +15,7 @@ classes='', noMaxWidth=False, optional=True, + showOptional=True, showLabel=True, watch=False, show_validation=True) -%} @@ -40,7 +41,7 @@