diff --git a/styles/elements/_sidenav.scss b/styles/elements/_sidenav.scss index 224895fb..d4a538f0 100644 --- a/styles/elements/_sidenav.scss +++ b/styles/elements/_sidenav.scss @@ -72,7 +72,7 @@ &.sidenav__list--padded { margin-top: 3 * $gap; margin-bottom: $footer-height; - padding: 0 $gap ($gap * 2); + padding-bottom: ($gap * 2); position: fixed; overflow-y: scroll; top: $topbar-height + $usa-banner-height + 4rem; @@ -109,100 +109,19 @@ &__link { display: block; padding: $gap ($gap * 2); - color: $color-black; - text-decoration: none; white-space: nowrap; overflow: hidden; + color: $color-black-light; + text-decoration: none; text-overflow: ellipsis; - &-icon { - margin-left: -($gap * 0.5); - } - - &--disabled { - color: $color-shadow; - pointer-events: none; - } - - &--add { - color: $color-blue; - font-size: $small-font-size; - - .icon { - @include icon-color($color-blue); - @include icon-size(14); - } - } - &--active { @include h4; - color: $color-primary; background-color: $color-aqua-lightest; - box-shadow: inset ($gap / 2) 0 0 0 $color-primary; - - .sidenav__link-icon { - @include icon-style-active; - } - + box-shadow: inset ($gap / 2) 0 0 0 $color-primary-darker; position: relative; - - &_indicator .icon { - @include icon-color($color-primary); - - position: absolute; - right: 0; - } - - + ul { - background-color: $color-primary; - - .sidenav__link { - color: $color-white; - background-color: $color-primary; - - &:hover { - background-color: $color-blue-darker; - } - - &--active { - @include h5; - - color: $color-white; - background-color: $color-primary; - box-shadow: none; - } - - .icon { - @include icon-color($color-white); - } - } - } - } - - + ul { - li { - .sidenav__link { - @include h5; - - padding: $gap * 0.75; - padding-left: 4.5rem; - border: 0; - font-weight: normal; - - .sidenav__link-icon { - @include icon-size(12); - - flex-shrink: 0; - margin-right: 1.5rem; - margin-left: -3rem; - } - - .sidenav__link-label { - padding-left: 0; - } - } - } + color: $color-primary-darker; } &:hover { diff --git a/templates/applications/new/step_2.html b/templates/applications/new/step_2.html index 9adfddca..462c0f46 100644 --- a/templates/applications/new/step_2.html +++ b/templates/applications/new/step_2.html @@ -58,9 +58,9 @@ {{ Icon("plus") }} - + - + {% block next_button %} {{ SaveButton(text=('portfolios.applications.new.step_2_button_text' | translate)) }} diff --git a/templates/components/sidenav_item.html b/templates/components/sidenav_item.html index 8e3c5135..ec6be364 100644 --- a/templates/components/sidenav_item.html +++ b/templates/components/sidenav_item.html @@ -1,35 +1,11 @@ {% from "components/icon.html" import Icon %} -{% macro SidenavItem(label, href, active=False, icon=None, subnav=None) -%} +{% macro SidenavItem(label, href, active=False) -%}
  • - - {% if icon %} - {{ Icon(icon, classes="sidenav__link-icon") }} - {% endif %} - - - {{label}} - - {% if active %} - - {{ Icon("caret_right") }} + + + {{label}} - {% endif %} - - - {% if subnav and active %} - - {% endif %} +
  • {%- endmacro %}