Refactor New Portfolio page according to designs.

New designs call for a streamlined New Portfolio page, with far
fewer input options. This commit refactors that page according to those
designs.

Some of the route functions in this commit refer to a "step 1" of creating
a new Portfolio. Though there is no "step 2" right now, the designs call
for a multistep flow for Portfolio creation process, so this commit sets
the stage for that.

templates/home.html

@@ -14,7 +14,7 @@
   {% endif %}
 
   {% call StickyCTA(sticky_header) %}
-      <a href="{{ url_for("portfolios.new_portfolio") }}" class="usa-button-primary">
+      <a href="{{ url_for("portfolios.new_portfolio_step_1") }}" class="usa-button-primary">
         {{ "home.add_portfolio_button_text" | translate }}
       </a>
   {% endcall %}

templates/portfolios/new.html

@@ -1,54 +0,0 @@
-{% from "components/multi_checkbox_input.html" import MultiCheckboxInput %}
-{% from "components/options_input.html" import OptionsInput %}
-{% from "components/save_button.html" import SaveButton %}
-{% from "components/text_input.html" import TextInput %}
-
-{% extends "base.html" %}
-
-{% block content %}
-
-<main class="usa-section usa-content">
-  {% include "fragments/flash.html" %}
-  <h1>New Portfolio Form</h1>
-  <base-form inline-template>
-    <form class="panel__content" id="portfolio-create" action="{{ url_for('portfolios.create_portfolio') }}" method="POST">
-      {{ form.csrf_token }}
-
-      {{ TextInput(form.name, optional=False) }}
-      {{ OptionsInput(form.defense_component, optional=False) }}
-      {{ TextInput(form.description, paragraph=True) }}
-
-      <h3 id="reporting" class="subheading">{{ "task_orders.new.app_info.project_title" | translate }}</h3>
-
-      <hr>
-
-      {{ OptionsInput(form.app_migration) }}
-
-      {{ OptionsInput(form.native_apps) }}
-      <p>{{ "forms.task_order.native_apps.not_sure_help" | translate }}</p>
-      {{ MultiCheckboxInput(form.complexity, form.complexity_other) }}
-
-      <hr>
-
-      <h3 class="subheading">{{ "task_orders.new.app_info.team_title" | translate }}</h3>
-      <p>{{ "task_orders.new.app_info.subtitle" | translate }}</p>
-      {{ MultiCheckboxInput(form.dev_team, form.dev_team_other) }}
-      {{ OptionsInput(form.team_experience) }}
-
-      <hr>
-
-      <div class='action-group'>
-        {{
-          SaveButton(
-            text=('common.save' | translate),
-            form="portfolio-create",
-            element="input",
-          )
-        }}
-      </div>
-    </form>
-  </base-form>
-</main>
-
-{% endblock %}
-

templates/portfolios/new/step_1.html

@@ -0,0 +1,45 @@
+{% from "components/multi_checkbox_input.html" import MultiCheckboxInput %}
+{% from "components/options_input.html" import OptionsInput %}
+{% from "components/save_button.html" import SaveButton %}
+{% from "components/text_input.html" import TextInput %}
+{% from "components/sticky_cta.html" import StickyCTA %}
+
+{% extends "base.html" %}
+
+{% block content %}
+
+<main class="usa-section usa-content">
+  {% include "fragments/flash.html" %}
+  <div class='portfolio-header__name'>
+    <p>{{ "portfolios.header" | translate }}</p>
+    <h1>{{ "New Portfolio" }}</h1>
+  </div>
+  {{ StickyCTA(text="Name and Describe Portfolio", context="Step 1 of 2") }}
+  <base-form inline-template>
+    <form id="portfolio-create" action="{{ url_for('portfolios.create_portfolio') }}" method="POST">
+      {{ form.csrf_token }}
+      {{ TextInput(form.name, optional=False) }}
+      {{"forms.portfolio.name.help_text" | translate | safe }}
+        <div>
+          {{ TextInput(form.description, paragraph=True) }}
+          {{"forms.portfolio.description.help_text" | translate | safe }}
+        </div>
+        <div>
+          <strong class="h4">{{ "forms.portfolio.defense_component.label" | translate }}</strong>
+          {{ "forms.portfolio.defense_component.help_text" | translate | safe }}
+          {{ MultiCheckboxInput(form.defense_component, optional=False) }}
+        </div>
+      <div class='action-group'>
+        {{
+          SaveButton(
+            text=('common.save' | translate),
+            form="portfolio-create",
+            element="input",
+          )
+        }}
+      </div>
+    </form>
+  </base-form>
+</main>
+{% endblock %}
+