From 8dbb3b32a22759356d34572b1c8b57c1bdcf9812 Mon Sep 17 00:00:00 2001 From: hmbrink Date: Fri, 17 Jan 2020 17:02:15 -0500 Subject: [PATCH 01/12] Portfolio Spacing & Layout Portfolio adjustments: -Cleaned up container margins/padding -Added max-width to header and Settings section -Refined Portfolio header and nav links Other adjustments: -Reduced font size of side nav links --- styles/components/_global_layout.scss | 3 +- styles/components/_portfolio_layout.scss | 37 ++++++++++++++++++------ styles/components/_sticky_cta.scss | 3 +- styles/core/_variables.scss | 2 +- styles/elements/_sidenav.scss | 4 +-- 5 files changed, 34 insertions(+), 15 deletions(-) diff --git a/styles/components/_global_layout.scss b/styles/components/_global_layout.scss index 5ad748d1..22de84e8 100644 --- a/styles/components/_global_layout.scss +++ b/styles/components/_global_layout.scss @@ -22,14 +22,13 @@ body { padding-bottom: $footer-height * 2.5; .global-panel-container { - margin: $gap; flex-grow: 1; -ms-flex-negative: 1; top: $usa-banner-height + $topbar-height; position: relative; + padding: 0 $spacing-large; @include media($medium-screen) { - margin: $gap * 2; top: $usa-banner-height + $topbar-height; } } diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 81a15b69..9dc9ee6a 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -4,25 +4,29 @@ min-height: 500px; } - margin-left: 2 * $gap; + .col.col--grow { + padding: 0; + } } .portfolio-header { flex-direction: column; + align-items: center; + margin: $spacing-medium 0; + max-width: 90rem; @include media($small-screen) { flex-direction: row; } - margin-bottom: $gap * 1; - .col--grow { overflow: inherit; } &__name { @include h1; + padding-right: $spacing-medium; h1 { - margin: 0 $gap ($gap * 2) 0; + margin: 0; font-size: 3.5rem; } @@ -30,6 +34,7 @@ font-size: $small-font-size; margin: 0 0 (-$gap * 0.5); color: $color-gray-medium; + max-width: 100%; } } @@ -38,9 +43,15 @@ font-size: $small-font-size; .icon-link { - padding: $gap; + padding: 0; border-radius: 0; color: $color-blue-darkest; + min-width: 10rem; + min-height: 10rem; + + .col { + margin: 0 auto; + } &:hover { background-color: $color-aqua-lightest; @@ -82,11 +93,19 @@ margin-bottom: 3 * $gap; } -.portfolio-content { - margin: (4 * $gap) $gap 0 $gap; +.portfolio-admin { + margin: $spacing-large 0; + max-width: 90rem; +} +.portfolio-content { .panel { padding-bottom: 2rem; + max-width: 90rem; + } + + hr { + max-width: 90rem; } a.add-new-button { @@ -289,8 +308,8 @@ } .portfolio-funding { - padding: 2 * $gap; - padding-top: 0; + max-width: 90rem; + margin: $spacing-large 0; .panel { @include shadow-panel; diff --git a/styles/components/_sticky_cta.scss b/styles/components/_sticky_cta.scss index a62dc326..12d67d8e 100644 --- a/styles/components/_sticky_cta.scss +++ b/styles/components/_sticky_cta.scss @@ -20,9 +20,10 @@ .sticky-cta-container { display: flex; align-items: center; + max-width: 90rem; .usa-button { - margin: $gap $gap * 1.5 $gap 0; + margin: 0; width: 20rem; height: 3.2rem; font-size: $small-font-size; diff --git a/styles/core/_variables.scss b/styles/core/_variables.scss index 122739c4..70524e97 100644 --- a/styles/core/_variables.scss +++ b/styles/core/_variables.scss @@ -189,4 +189,4 @@ $spacing-x-small: 0.5rem; $spacing-small: 1rem; $spacing-md-small: 1.5rem; $spacing-medium: 2rem; -$spacing-large: 3rem; +$spacing-large: 4rem; diff --git a/styles/elements/_sidenav.scss b/styles/elements/_sidenav.scss index 23a4f05f..81a55b4e 100644 --- a/styles/elements/_sidenav.scss +++ b/styles/elements/_sidenav.scss @@ -113,8 +113,8 @@ text-overflow: ellipsis; &--active { - @include h4; - + font-size: $base-font-size; + font-weight: $font-bold; background-color: $color-aqua-lightest !important; color: $color-primary-darker !important; box-shadow: inset ($gap / 2) 0 0 0 $color-primary-darker; From 8c0e88c5c49a1fa4c852c48728f88f86b59ddea5 Mon Sep 17 00:00:00 2001 From: hmbrink Date: Mon, 20 Jan 2020 17:03:18 -0500 Subject: [PATCH 02/12] Topbar, Portfolio Header, & Content alignment --- styles/components/_empty_state.scss | 23 +++++++++++++++------- styles/components/_global_layout.scss | 1 + styles/components/_portfolio_layout.scss | 25 +++++++++++++++++------- styles/components/_sticky_cta.scss | 7 ++++--- styles/components/_topbar.scss | 3 ++- styles/core/_variables.scss | 2 +- styles/elements/_panels.scss | 10 ++++------ styles/sections/_home.scss | 8 ++++---- templates/portfolios/admin.html | 2 +- templates/user/edit.html | 2 +- 10 files changed, 52 insertions(+), 31 deletions(-) diff --git a/styles/components/_empty_state.scss b/styles/components/_empty_state.scss index b0b73b16..1259f438 100644 --- a/styles/components/_empty_state.scss +++ b/styles/components/_empty_state.scss @@ -1,8 +1,6 @@ .empty-state { - padding: $gap * 3; - max-width: 100%; - background-color: $color-gray-lightest; - margin-top: $gap * 5; + max-width: $max-panel-width; + background-color: #F6F6F7; &--white { background-color: $color-white; @@ -18,17 +16,28 @@ margin-top: 3rem; } + h3 { + margin: 0 0 1rem; + padding: 3.2rem 2.4rem 0; + } + + p { + margin: 0; + padding: 0 $gap * 3; + } + hr { - margin-left: -$gap * 3; - margin-right: -$gap * 3; + margin: $gap * 4 0 0; } &__footer { text-align: center; + background-color: $color-gray-lightest; + padding: $gap * 3; a.usa-button { width: 60%; - display: inline-block; + margin: 0 auto; } } } diff --git a/styles/components/_global_layout.scss b/styles/components/_global_layout.scss index 22de84e8..ff84b3a0 100644 --- a/styles/components/_global_layout.scss +++ b/styles/components/_global_layout.scss @@ -28,6 +28,7 @@ body { position: relative; padding: 0 $spacing-large; + @include media($medium-screen) { top: $usa-banner-height + $topbar-height; } diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 9dc9ee6a..00beae67 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -5,15 +5,16 @@ } .col.col--grow { + position: relative; padding: 0; } } .portfolio-header { flex-direction: column; - align-items: center; - margin: $spacing-medium 0; - max-width: 90rem; + margin: $gap * 2 0; + max-width: $max-panel-width; + @include media($small-screen) { flex-direction: row; } @@ -25,6 +26,12 @@ &__name { @include h1; padding-right: $spacing-medium; + position: absolute; + top: 50%; + left: 0; + -webkit-transform: translateX(0%) translateY(-50%); + transform: translateX(0%) translateY(-50%); + h1 { margin: 0; font-size: 3.5rem; @@ -64,6 +71,7 @@ &.active { color: $color-blue; background-color: $color-gray-lightest; + text-decoration: none; &:hover { background-color: $color-aqua-lightest; @@ -95,17 +103,17 @@ .portfolio-admin { margin: $spacing-large 0; - max-width: 90rem; + max-width: $max-panel-width; } .portfolio-content { .panel { padding-bottom: 2rem; - max-width: 90rem; + max-width: $max-panel-width; } hr { - max-width: 90rem; + max-width: $max-panel-width; } a.add-new-button { @@ -263,6 +271,7 @@ .portfolio-applications { margin-top: $gap * 5; + max-width: $max-panel-width; &__header { &--title { @@ -308,7 +317,7 @@ } .portfolio-funding { - max-width: 90rem; + max-width: $max-panel-width; margin: $spacing-large 0; .panel { @@ -378,6 +387,8 @@ } .portfolio-reports { + max-width: $max-panel-width; + &__header { margin-bottom: 4 * $gap; diff --git a/styles/components/_sticky_cta.scss b/styles/components/_sticky_cta.scss index 12d67d8e..c3a7b0ea 100644 --- a/styles/components/_sticky_cta.scss +++ b/styles/components/_sticky_cta.scss @@ -24,9 +24,6 @@ .usa-button { margin: 0; - width: 20rem; - height: 3.2rem; - font-size: $small-font-size; } } @@ -43,6 +40,10 @@ &-buttons { display: flex; + a { + font-size: 1.5rem; + } + .action-group { margin: 0; diff --git a/styles/components/_topbar.scss b/styles/components/_topbar.scss index a64a1344..7f7a3e6d 100644 --- a/styles/components/_topbar.scss +++ b/styles/components/_topbar.scss @@ -4,14 +4,15 @@ height: $topbar-height; position: fixed; top: $usa-banner-height; - width: 100%; z-index: 10; + width: 100%; &__navigation { display: flex; flex-direction: row; align-items: stretch; justify-content: space-between; + max-width: 1180px; a { color: $color-white; diff --git a/styles/core/_variables.scss b/styles/core/_variables.scss index 70524e97..feb245ad 100644 --- a/styles/core/_variables.scss +++ b/styles/core/_variables.scss @@ -16,7 +16,7 @@ $footer-height: 5rem; $usa-banner-height: 2.8rem; $sidenav-expanded-width: 25rem; $sidenav-collapsed-width: 10rem; -$max-panel-width: 80rem; +$max-panel-width: 90rem; $home-pg-icon-width: 6rem; /* diff --git a/styles/elements/_panels.scss b/styles/elements/_panels.scss index 8ecd36c6..df681767 100644 --- a/styles/elements/_panels.scss +++ b/styles/elements/_panels.scss @@ -19,10 +19,7 @@ } @mixin panel-margin { - margin-top: 0; - margin-left: 0; - margin-right: 0; - margin-bottom: $site-margins-mobile * 6; + margin: $spacing-large 0; @include media($medium-screen) { margin-bottom: $site-margins * 8; @@ -56,9 +53,10 @@ @include panel-theme-default; @include panel-margin; @include shadow-panel; + max-width: $max-panel-width; &__content { - padding: $gap * 2; + padding: 3.2rem 2.4rem; } &__body { @@ -66,7 +64,7 @@ } &__heading { - padding: $gap * 2; + padding: 3.2rem 2.4rem; @include media($medium-screen) { padding: $gap * 4; diff --git a/styles/sections/_home.scss b/styles/sections/_home.scss index b0d715d2..936f919c 100644 --- a/styles/sections/_home.scss +++ b/styles/sections/_home.scss @@ -1,12 +1,12 @@ .home { - margin: $gap * 3; + .sticky-cta { margin: -1.6rem -1.6rem 0 -1.6rem; } &__content { - margin: 4rem; - max-width: 900px; + margin: $spacing-large 0; + max-width: $max-panel-width; &--descriptions { .col { @@ -29,7 +29,7 @@ background-color: $color-white; .home-container { - max-width: 90rem; + max-width: $max-panel-width; margin-left: auto; margin-right: auto; margin-bottom: 8rem; diff --git a/templates/portfolios/admin.html b/templates/portfolios/admin.html index 3c2a9b9c..264e40f9 100644 --- a/templates/portfolios/admin.html +++ b/templates/portfolios/admin.html @@ -22,7 +22,7 @@ {{ TextInput(portfolio_form.name, validation="portfolioName", optional=False) }} {{ TextInput(portfolio_form.description, paragraph=True) }}
- {{ SaveButton(text='Save Changes', additional_classes='usa-button-big') }} + {{ SaveButton(text='Save Changes') }}
diff --git a/templates/user/edit.html b/templates/user/edit.html index fc4ac64f..226dc167 100644 --- a/templates/user/edit.html +++ b/templates/user/edit.html @@ -1,7 +1,7 @@ {% extends "base.html" %} {% block content %} -
+
{% include "fragments/flash.html" %} From 4dcd49269f2728e9b8d2e2cfcb649363fc8638ac Mon Sep 17 00:00:00 2001 From: hmbrink Date: Tue, 21 Jan 2020 10:45:40 -0500 Subject: [PATCH 03/12] Topbar testing --- styles/components/_portfolio_layout.scss | 11 ----------- styles/components/_topbar.scss | 8 ++++++++ styles/core/_util.scss | 4 ++++ templates/base_public.html | 2 +- templates/portfolios/new/step_1.html | 8 +++++--- 5 files changed, 18 insertions(+), 15 deletions(-) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 00beae67..ee7b1ed1 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -3,11 +3,6 @@ @include grid-row; min-height: 500px; } - - .col.col--grow { - position: relative; - padding: 0; - } } .portfolio-header { @@ -25,12 +20,6 @@ &__name { @include h1; - padding-right: $spacing-medium; - position: absolute; - top: 50%; - left: 0; - -webkit-transform: translateX(0%) translateY(-50%); - transform: translateX(0%) translateY(-50%); h1 { margin: 0; diff --git a/styles/components/_topbar.scss b/styles/components/_topbar.scss index 7f7a3e6d..03a74f55 100644 --- a/styles/components/_topbar.scss +++ b/styles/components/_topbar.scss @@ -65,3 +65,11 @@ justify-content: flex-end; } } + +.login-topbar .topbar__navigation { + max-width: 100%; +} + +.login-topbar .topbar__context .topbar__link-icon { + margin: 0 0 0 0.8rem; +} diff --git a/styles/core/_util.scss b/styles/core/_util.scss index 5203da45..0790a121 100644 --- a/styles/core/_util.scss +++ b/styles/core/_util.scss @@ -94,3 +94,7 @@ hr { margin: ($gap * 3) ($site-margins * -4); } } + +.usa-section { + padding: 0; +} diff --git a/templates/base_public.html b/templates/base_public.html index 7b872471..07447633 100644 --- a/templates/base_public.html +++ b/templates/base_public.html @@ -17,7 +17,7 @@
{% include 'components/usa_header.html' %} - {% include 'navigation/topbar.html' %} + {% block content %}{% endblock %} diff --git a/templates/portfolios/new/step_1.html b/templates/portfolios/new/step_1.html index 4a499821..abc6d25e 100644 --- a/templates/portfolios/new/step_1.html +++ b/templates/portfolios/new/step_1.html @@ -10,9 +10,11 @@
{% include "fragments/flash.html" %} -
-

{{ "portfolios.header" | translate }}

-

{{ "New Portfolio" }}

+
+
+

{{ "portfolios.header" | translate }}

+

{{ "New Portfolio" }}

+
{{ StickyCTA(text="Create New Portfolio") }} From 32451c69afdf0efdb6de5e20d5ad3c6c2cd2e266 Mon Sep 17 00:00:00 2001 From: hmbrink Date: Tue, 21 Jan 2020 15:27:30 -0500 Subject: [PATCH 04/12] Topbar max-width --- styles/components/_topbar.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/styles/components/_topbar.scss b/styles/components/_topbar.scss index 03a74f55..c536fb01 100644 --- a/styles/components/_topbar.scss +++ b/styles/components/_topbar.scss @@ -12,7 +12,6 @@ flex-direction: row; align-items: stretch; justify-content: space-between; - max-width: 1180px; a { color: $color-white; From 4fd83be37f69a228ac0f79d66c77dbf2994fbb7e Mon Sep 17 00:00:00 2001 From: hmbrink Date: Tue, 21 Jan 2020 15:31:48 -0500 Subject: [PATCH 05/12] Portfolio Header --- styles/components/_portfolio_layout.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index ee7b1ed1..58039596 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -16,10 +16,14 @@ .col--grow { overflow: inherit; + display: table; + min-height: 10rem; } &__name { @include h1; + display: table-cell; + vertical-align: middle; h1 { margin: 0; From ae3144c82ff432eea34d8252ca759f65206a9751 Mon Sep 17 00:00:00 2001 From: hmbrink Date: Tue, 21 Jan 2020 15:41:03 -0500 Subject: [PATCH 06/12] removed extra grid column padding --- styles/core/_grid.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/styles/core/_grid.scss b/styles/core/_grid.scss index d060198d..d22a866f 100644 --- a/styles/core/_grid.scss +++ b/styles/core/_grid.scss @@ -41,7 +41,6 @@ &.col--grow { flex: 1 auto; - padding-right: $spacing-small; } &.col--half { From 16db93c2daa38025c798a525d1d4bf3f27843c80 Mon Sep 17 00:00:00 2001 From: hmbrink Date: Wed, 22 Jan 2020 14:25:56 -0500 Subject: [PATCH 07/12] Topbar navigation --- styles/components/_empty_state.scss | 2 +- styles/components/_footer.scss | 7 ++++--- styles/components/_global_layout.scss | 1 - styles/components/_topbar.scss | 5 +++-- styles/sections/_home.scss | 1 - 5 files changed, 8 insertions(+), 8 deletions(-) diff --git a/styles/components/_empty_state.scss b/styles/components/_empty_state.scss index 1259f438..71c9e742 100644 --- a/styles/components/_empty_state.scss +++ b/styles/components/_empty_state.scss @@ -1,6 +1,6 @@ .empty-state { max-width: $max-panel-width; - background-color: #F6F6F7; + background-color: #f6f6f7; &--white { background-color: $color-white; diff --git a/styles/components/_footer.scss b/styles/components/_footer.scss index bb248e4d..bd2ede65 100644 --- a/styles/components/_footer.scss +++ b/styles/components/_footer.scss @@ -3,9 +3,7 @@ background-color: $color-white; border-top: 1px solid $color-gray-lightest; display: flex; - flex-direction: row-reverse; align-items: center; - padding: $gap * 1.5; position: fixed; left: 0; bottom: 0; @@ -13,8 +11,11 @@ height: $footer-height; color: $color-gray-dark; font-size: 1.5rem; + padding: 0 $gap * 1.5; &__login { - padding-left: 0.8rem; + width: 100%; + max-width: 1165px; + text-align: right; } } diff --git a/styles/components/_global_layout.scss b/styles/components/_global_layout.scss index ff84b3a0..22de84e8 100644 --- a/styles/components/_global_layout.scss +++ b/styles/components/_global_layout.scss @@ -28,7 +28,6 @@ body { position: relative; padding: 0 $spacing-large; - @include media($medium-screen) { top: $usa-banner-height + $topbar-height; } diff --git a/styles/components/_topbar.scss b/styles/components/_topbar.scss index c536fb01..c61872ae 100644 --- a/styles/components/_topbar.scss +++ b/styles/components/_topbar.scss @@ -12,6 +12,7 @@ flex-direction: row; align-items: stretch; justify-content: space-between; + max-width: 1180px; a { color: $color-white; @@ -66,9 +67,9 @@ } .login-topbar .topbar__navigation { - max-width: 100%; + max-width: 100%; } .login-topbar .topbar__context .topbar__link-icon { - margin: 0 0 0 0.8rem; + margin: 0 0 0 0.8rem; } diff --git a/styles/sections/_home.scss b/styles/sections/_home.scss index 936f919c..23d9d2e1 100644 --- a/styles/sections/_home.scss +++ b/styles/sections/_home.scss @@ -1,5 +1,4 @@ .home { - .sticky-cta { margin: -1.6rem -1.6rem 0 -1.6rem; } From 01341be95b6dc542b4570fe66f15b09618b0a2b7 Mon Sep 17 00:00:00 2001 From: hmbrink Date: Wed, 22 Jan 2020 14:34:23 -0500 Subject: [PATCH 08/12] Profile max-width --- styles/components/_global_layout.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/styles/components/_global_layout.scss b/styles/components/_global_layout.scss index 22de84e8..2f5e0c4a 100644 --- a/styles/components/_global_layout.scss +++ b/styles/components/_global_layout.scss @@ -31,5 +31,9 @@ body { @include media($medium-screen) { top: $usa-banner-height + $topbar-height; } + + .user-edit { + max-width: $max-panel-width; + } } } From 0f2ba887d9d60c24f1c09c3fcfffae0930cf2a4a Mon Sep 17 00:00:00 2001 From: hmbrink Date: Thu, 23 Jan 2020 13:13:04 -0500 Subject: [PATCH 09/12] Large spacing variable --- styles/components/_footer.scss | 2 +- styles/components/_global_layout.scss | 2 +- styles/components/_portfolio_layout.scss | 4 ++-- styles/components/_topbar.scss | 2 +- styles/core/_variables.scss | 1 + styles/sections/_home.scss | 2 +- 6 files changed, 7 insertions(+), 6 deletions(-) diff --git a/styles/components/_footer.scss b/styles/components/_footer.scss index bd2ede65..881ab9a7 100644 --- a/styles/components/_footer.scss +++ b/styles/components/_footer.scss @@ -15,7 +15,7 @@ &__login { width: 100%; - max-width: 1165px; + max-width: 1175px; text-align: right; } } diff --git a/styles/components/_global_layout.scss b/styles/components/_global_layout.scss index 2f5e0c4a..9b21b41f 100644 --- a/styles/components/_global_layout.scss +++ b/styles/components/_global_layout.scss @@ -26,7 +26,7 @@ body { -ms-flex-negative: 1; top: $usa-banner-height + $topbar-height; position: relative; - padding: 0 $spacing-large; + padding: 0 $large-spacing; @include media($medium-screen) { top: $usa-banner-height + $topbar-height; diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 58039596..af083468 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -95,7 +95,7 @@ } .portfolio-admin { - margin: $spacing-large 0; + margin: $large-spacing 0; max-width: $max-panel-width; } @@ -311,7 +311,7 @@ .portfolio-funding { max-width: $max-panel-width; - margin: $spacing-large 0; + margin: $large-spacing 0; .panel { @include shadow-panel; diff --git a/styles/components/_topbar.scss b/styles/components/_topbar.scss index c61872ae..6d84f426 100644 --- a/styles/components/_topbar.scss +++ b/styles/components/_topbar.scss @@ -12,7 +12,7 @@ flex-direction: row; align-items: stretch; justify-content: space-between; - max-width: 1180px; + max-width: 1190px; a { color: $color-white; diff --git a/styles/core/_variables.scss b/styles/core/_variables.scss index feb245ad..12657ca4 100644 --- a/styles/core/_variables.scss +++ b/styles/core/_variables.scss @@ -18,6 +18,7 @@ $sidenav-expanded-width: 25rem; $sidenav-collapsed-width: 10rem; $max-panel-width: 90rem; $home-pg-icon-width: 6rem; +$large-spacing: 4rem; /* * USWDS Variables diff --git a/styles/sections/_home.scss b/styles/sections/_home.scss index 23d9d2e1..52636a61 100644 --- a/styles/sections/_home.scss +++ b/styles/sections/_home.scss @@ -4,7 +4,7 @@ } &__content { - margin: $spacing-large 0; + margin: $large-spacing 0; max-width: $max-panel-width; &--descriptions { From 8093edbf0396c7a384ac91b16ecfce7654ac1810 Mon Sep 17 00:00:00 2001 From: hmbrink Date: Mon, 27 Jan 2020 13:02:06 -0500 Subject: [PATCH 10/12] User icon Added user icon from designs for top navigation --- static/icons/user.svg | 1 + templates/navigation/topbar.html | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) create mode 100644 static/icons/user.svg diff --git a/static/icons/user.svg b/static/icons/user.svg new file mode 100644 index 00000000..a0da4770 --- /dev/null +++ b/static/icons/user.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/templates/navigation/topbar.html b/templates/navigation/topbar.html index 2715c86f..f48f04ea 100644 --- a/templates/navigation/topbar.html +++ b/templates/navigation/topbar.html @@ -11,7 +11,7 @@
{% if g.current_user %} - {{ Icon('avatar', classes='topbar__link-icon') }} + {{ Icon('user', classes='topbar__link-icon') }} {{ g.current_user.first_name + " " + g.current_user.last_name }} From 15ac65752ff9f1246141693b0bad043a0744b0ed Mon Sep 17 00:00:00 2001 From: hmbrink Date: Mon, 27 Jan 2020 13:46:56 -0500 Subject: [PATCH 11/12] New portfolio header adjustments --- styles/components/_empty_state.scss | 2 +- styles/components/_portfolio_layout.scss | 4 ++++ templates/portfolios/new/step_1.html | 2 +- 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/styles/components/_empty_state.scss b/styles/components/_empty_state.scss index 71c9e742..e18a2faf 100644 --- a/styles/components/_empty_state.scss +++ b/styles/components/_empty_state.scss @@ -1,6 +1,6 @@ .empty-state { max-width: $max-panel-width; - background-color: #f6f6f7; + background-color: $color-gray-lightest; &--white { background-color: $color-white; diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index b5be6090..77b8b179 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -5,6 +5,10 @@ } } +.portfolio-header-new .portfolio-header__name { + padding: 1.6rem 0; +} + .portfolio-header { flex-direction: column; margin: $gap * 2 0; diff --git a/templates/portfolios/new/step_1.html b/templates/portfolios/new/step_1.html index dddc9047..3305d924 100644 --- a/templates/portfolios/new/step_1.html +++ b/templates/portfolios/new/step_1.html @@ -13,7 +13,7 @@

{{ "portfolios.header" | translate }}

-

{{ "New Portfolio" }}

+

{{ 'portfolios.new.title' | translate }}

{{ StickyCTA(text="portfolios.new.cta_step_1"|translate, context=("portfolios.new.sticky_header_context"|translate({"step": "1"}) )) }} From f0122c794d5b78578784e5765ad03940164858dc Mon Sep 17 00:00:00 2001 From: hmbrink Date: Mon, 27 Jan 2020 14:09:42 -0500 Subject: [PATCH 12/12] New portfolio header padding --- styles/components/_portfolio_layout.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styles/components/_portfolio_layout.scss b/styles/components/_portfolio_layout.scss index 77b8b179..4a45cc5f 100644 --- a/styles/components/_portfolio_layout.scss +++ b/styles/components/_portfolio_layout.scss @@ -6,7 +6,7 @@ } .portfolio-header-new .portfolio-header__name { - padding: 1.6rem 0; + padding: 1.6rem 0; } .portfolio-header {