Sticky styling

styles/components/_portfolio_layout.scss

@@ -373,7 +373,8 @@
 }
 
 .portfolio-funding {
-  padding: (2 * $gap) 0;
+  padding: 2 * $gap;
+  padding-top: 0;
 
   .panel {
     @include shadow-panel;
@@ -385,10 +386,6 @@
     margin-bottom: 2 * $gap;
   }
 
-  .portfolio-funding__header {
-    flex-direction: row-reverse;
-  }
-
   .pending-task-order {
     background-color: $color-gold-lightest;
 

styles/components/_sticky_cta.scss

@@ -1,12 +1,9 @@
 .sticky-cta {
-  z-index: 100;
-
-  @include media($small-screen) {
   margin-left: -$gap * 4;
-  }
 
   @include media($medium-screen) {
     margin-left: -$gap * 5;
+    margin-right: -$gap * 3;
   }
 }
 
@@ -23,7 +20,6 @@
   border-bottom: 1px solid $color-gray-lighter;
   padding: 0 40px 0 40px;
   box-shadow: $box-shadow;
-  margin-bottom: 20px;
 }
 
 .sticky-cta-text {

styles/sections/_task_order.scss

@@ -80,7 +80,7 @@
 }
 
 .task-order-summary {
-  margin: $gap * 4;
+  margin-top: $gap * 4;
 
   hr {
     border: 0;

templates/portfolios/base.html

@@ -7,6 +7,7 @@
       {% block portfolio_header %}
         {% include "portfolios/header.html" %}
       {% endblock %}
+
       <div class='portfolio-content'>
         {% block portfolio_content %}{% endblock %}
       </div>

templates/portfolios/task_orders/index.html

@@ -63,13 +63,12 @@
   </div>
 {% endmacro %}
 
-<div class="portfolio-funding">
 
-  {% call StickyCTA(text="Funding") %}
-    <div class='portfolio-funding__header row'>
-      <a href="{{ url_for("task_orders.edit", portfolio_id=portfolio.id) }}" class="usa-button">Add a new task order</a>
-    </div>
-  {% endcall %}
+{% call StickyCTA(text="Funding") %}
+    <a href="{{ url_for("task_orders.edit", portfolio_id=portfolio.id) }}" class="usa-button usa-button-primary">Start a new task order</a>
+{% endcall %}
+
+<div class="portfolio-funding">
 
   {% if not active_task_orders and not pending_task_orders %}
     {{ EmptyState(

templates/portfolios/task_orders/review.html

@@ -1,12 +1,16 @@
-{% extends 'portfolios/base.html' %}
-
 {% from "components/icon.html" import Icon %}
 {% from "components/totals_box.html" import TotalsBox %}
+{% from "components/sticky_cta.html" import StickyCTA %}
 
-{% block content %}
+{% extends 'portfolios/base.html' %}
+
+{% block portfolio_content %}
+  {% call StickyCTA(text="Review Funding") %}
+      <a href="{{ url_for("task_orders.edit", portfolio_id=portfolio.id) }}" class="usa-button">Edit</a>
+      <a href="{{ url_for("task_orders.edit", portfolio_id=portfolio.id) }}" class="usa-button">Submit task order</a>
+  {% endcall %}
 
   <div class="task-order-summary">
-    <div class="h2">Portfolio Name</div>
 
     <semi-collapsible-text inline-template>
       <div>