Styling for environment edit form

styles/components/_accordion_table.scss

@@ -106,7 +106,7 @@
       &__expanded {
         font-size: $small-font-size;
         font-weight: $font-normal;
-        background-color: $color-gray-lightest;
+        background-color: $color-offwhite;
         padding: $gap;
 
         &:last-child {

styles/components/_portfolio_layout.scss

@@ -222,14 +222,21 @@
 
     span.accordion-table__item__toggler {
       font-weight: $font-normal;
+      text-decoration: underline;
+      font-size: $small-font-size;
 
       &.environment-list__item__members {
         float: unset;
-        font-size: $small-font-size;
+        margin-left: -$gap;
       }
     }
   }
 
+  li.environment-list__edit {
+    border: 1px solid $color-gray-lighter;
+    padding: 0 $gap * 3 $gap * 2;
+  }
+
   .activity-log {
     border-top: 3px solid $color-blue;
 

templates/applications/fragments/environments.html

@@ -31,8 +31,23 @@
                   <div class="accordion-table__item-content">
                     <div class="environment-list__item">
                       <span>
-                        {{ env['name'] }}
+                        <a
+                          href='{{ url_for("applications.access_environment", environment_id=env.id)}}'
+                          target='_blank'
+                          rel='noopener noreferrer'>
+                          {{ env['name'] }} {{ Icon('link', classes='icon--medium icon--primary') }}
+                        </a>
                       </span>
+                      {% if user_can(permissions.EDIT_ENVIRONMENT) -%}
+                        {{
+                        ToggleButton(
+                          open_html="common.edit"|translate,
+                          close_html="common.close"|translate,
+                          section_name="edit"
+                          )
+                        }}
+                      {%- endif %}
+                      <br>
                       {% set members_button = "portfolios.applications.member_count" | translate({'count': env['member_count']}) %}
                       {{
                         ToggleButton(
@@ -42,30 +57,9 @@
                           classes="environment-list__item__members"
                         )
                       }}
-                      {% if user_can(permissions.EDIT_ENVIRONMENT) -%}
-                        {% set edit_environment_button = "common.edit"|translate %}
-                        {{
-                        ToggleButton(
-                          open_html=edit_environment_button,
-                          close_html=edit_environment_button,
-                          section_name="edit"
-                          )
-                        }}
-                      {%- endif %}
                       <br>
                       {% if env['pending'] -%}
                         {{ Label(type="changes_pending", classes='label--below')}}
-                      {% else %}
-                        <a
-                          href='{{ url_for("applications.access_environment", environment_id=env.id)}}'
-                          target='_blank'
-                          rel='noopener noreferrer'
-                          class='application-list-item__environment__csp_link'>
-                          <span>
-                            {{ "portfolios.applications.csp_link" | translate }}
-                            {{ Icon('link', classes="icon--tiny") }}
-                          </span>
-                        </a>
                       {%- endif %}
                     </div>
                   </div>
@@ -84,7 +78,7 @@
                   {% if user_can(permissions.EDIT_ENVIRONMENT) -%}
                     {% call ToggleSection(section_name="edit") %}
                       <ul>
-                        <li class="accordion-table__item-toggle-content__expanded">
+                        <li class="accordion-table__item-toggle-content__expanded environment-list__edit">
                           <base-form inline-template>
                             <form
                               action="{{ url_for('applications.update_environment', environment_id=env['id']) }}"