Set max width on ccpo admin pages

styles/atat.scss

@@ -47,3 +47,4 @@
 @import "sections/application_edit";
 @import "sections/reports";
 @import "sections/task_order";
+@import "sections/ccpo";

styles/sections/_ccpo.scss

@@ -0,0 +1,3 @@
+.ccpo-panel-container {
+  max-width: $max-panel-width;
+}

templates/ccpo/add_user.html

@@ -4,6 +4,7 @@
 {% from "components/text_input.html" import TextInput %}
 
 {% block content %}
+  <div class="ccpo-panel-container">
     <base-form inline-template>
       <form id="add-ccpo-user-form" action="{{ url_for('ccpo.submit_new_user') }}" method="POST">
         {{ form.csrf_token }}
@@ -21,4 +22,5 @@
         </div>
       </form>
     </base-form>
+  </div>
 {% endblock %}

templates/ccpo/confirm_user.html

@@ -3,6 +3,7 @@
 {% from "components/text_input.html" import TextInput %}
 
 {% block content %}
+  <div class="ccpo-panel-container">
     {% if new_user %}
       <h3>{{ 'ccpo.form.confirm_user_title' | translate }}</h3>
       <form id="add-ccpo-user-form" action="{{ url_for('ccpo.confirm_new_user') }}" method="POST">
@@ -30,4 +31,5 @@
         </div>
       </form>
     {% endif %}
+  </div>
 {% endblock %}

templates/ccpo/users.html

@@ -6,6 +6,7 @@
 {% from "components/modal.html" import Modal %}
 
 {% block content %}
+  <div class="ccpo-panel-container">
     <div class='col'>
       <div class="h2">
         {{ "ccpo.users_title" | translate }}
@@ -80,4 +81,5 @@
         {% endcall %}
       {% endfor %}
     {% endif %}
+  </div>
 {% endblock %}