Split app settings into two panels

templates/fragments/applications/environments.html

@@ -0,0 +1,19 @@
+<div class="application-list-item">
+  <header>
+    <h2 class="block-list__title">{{ 'portfolios.applications.environments_heading' | translate }}</h2>
+    <p>
+      {{ 'portfolios.applications.environments_description' | translate }}
+    </p>
+  </header>
+
+  <ul>
+    {% for environment in application.environments %}
+      <li class="application-edit__env-list-item">
+        <div class="usa-input input--disabled">
+          <label>Environment Name</label>
+          <input type="text" disabled value="{{ environment.name }}" readonly />
+        </div>
+      </li>
+    {% endfor %}
+  </ul>
+</div>

templates/portfolios/applications/edit.html

@@ -12,33 +12,22 @@
     <div class="panel">
       <div class="panel__content">
 
-        {% include "fragments/edit_application_form.html" %}
+        {% include "fragments/applications/edit_application_form.html" %}
 
-        <div class="application-list-item">
-          <header>
-            <h2 class="block-list__title">{{ 'portfolios.applications.environments_heading' | translate }}</h2>
-            <p>
-              {{ 'portfolios.applications.environments_description' | translate }}
-            </p>
-          </header>
-
-          <ul>
-            {% for environment in application.environments %}
-              <li class="application-edit__env-list-item">
-                <div class="usa-input input--disabled">
-                  <label>Environment Name</label>
-                  <input type="text" disabled value="{{ environment.name }}" readonly />
-                </div>
-              </li>
-            {% endfor %}
-          </ul>
-        </div>
-
-      </div>
       </div>
       <div class="action-group">
         <button class="usa-button usa-button-primary" tabindex="0" type="submit">{{ 'portfolios.applications.update_button_text' | translate }}</button>
       </div>
+    </div>
   </form>
 
+    <div class="panel">
+      <div class="panel__content">
+        {% include "fragments/applications/environments.html" %}
+      </div>
+      <div class="action-group">
+        <button class="usa-button usa-button-primary" tabindex="0" type="submit">{{ 'portfolios.applications.update_button_text' | translate }}</button>
+      </div>
+    </div>
+
 {% endblock %}

templates/portfolios/applications/new.html

@@ -37,7 +37,7 @@
             </div>
           {% endcall %}
 
-          {% include "fragments/edit_application_form.html" %}
+          {% include "fragments/applications/edit_application_form.html" %}
 
           <div> {# this extra div prevents this bug: https://www.pivotaltracker.com/story/show/160768940 #}
             <div v-cloak v-for="title in errors" :key="title">