diff --git a/app/plugins/CoreEnroller/templates/BasicAttributeCollectors/dispatch.inc b/app/plugins/CoreEnroller/templates/BasicAttributeCollectors/dispatch.inc
index a89f5620..564c21b3 100644
--- a/app/plugins/CoreEnroller/templates/BasicAttributeCollectors/dispatch.inc
+++ b/app/plugins/CoreEnroller/templates/BasicAttributeCollectors/dispatch.inc
@@ -31,15 +31,36 @@ declare(strict_types = 1);
if($vv_action == 'dispatch') {
// Make the Form fields editable
$this->Field->enableFormEditMode();
-
- foreach(['honorific', 'given', 'middle', 'family', 'suffix'] as $n) {
- print $this->element('form/listItem', [
- 'arguments' => [
- 'fieldName' => $n,
- 'fieldLabel' => __d('field', $n)
- ]]);
- }
-
+?>
+
+
+
+ = __d('field','name') ?>
+
+
+
+
+
+ = __d('field', $n) ?>
+ = in_array($n, $vv_required_name_fields) ? $this->element('form/requiredSpan') : ''?>
+ = $this->element('form/infoDiv/default', [
+ 'vv_field_arguments' => [
+ 'fieldName' => $n,
+ 'fieldLabel' => __d('field', $n),
+ 'fieldOptions' => [
+ 'required' => in_array($n, $vv_required_name_fields)
+ ]
+ ]]);
+ ?>
+
+
+
+
+
+
+
+
+element('form/listItem', [
'arguments' => [
'fieldName' => 'mail',
diff --git a/app/templates/Standard/dispatch.php b/app/templates/Standard/dispatch.php
index 4fa9d546..be78db43 100644
--- a/app/templates/Standard/dispatch.php
+++ b/app/templates/Standard/dispatch.php
@@ -81,8 +81,11 @@
// By default, the form will POST to the current controller
// Note we need to open the form for view so Cake will autopopulate values
print $this->Form->create();
+
// Form body
+print '';
print $this->element('form/unorderedList');
+print '
';
// Inject the Petition ID into the form, though it will most likely
// still be available in the URL.
diff --git a/app/webroot/css/co-base.css b/app/webroot/css/co-base.css
index 850fbea1..38865977 100644
--- a/app/webroot/css/co-base.css
+++ b/app/webroot/css/co-base.css
@@ -1782,49 +1782,58 @@ li[data-pc-section="emptymessage"] {
background-color: unset;
}
/* ENROLLMENT FLOWS: ATTRIBUTE COLLECTOR */
-body.attributecollectors main {
+body.attributecollectors main,
+body.basicattributecollectors main {
max-width: 800px;
margin: 0 auto;
}
-body.attributecollectors form {
+body.attributecollectors form,
+body.basicattributecollectors form {
margin-top: 1em;
}
-body.attributecollectors .submit {
+body.attributecollectors .submit,
+body.basicattributecollectors .submit {
width: 100%;
text-align: right;
}
-#dispatch_AttributeCollectors li {
+#dispatch-list-container > ul {
+ border-top: none;
+}
+#dispatch-list-container li {
border: none;
}
-#dispatch_AttributeCollectors .field,
-#dispatch_AttributeCollectors fieldset {
+#dispatch-list-container .field,
+#dispatch-list-container fieldset {
display: block;
padding: 0.75em 1em 1.5em;
}
-#dispatch_AttributeCollectors .fieldset-info {
+#dispatch-list-container .fieldset-info {
display: flex;
flex-direction: column;
gap: 0.5em;
padding: 1em;
border: 1px solid var(--cmg-color-bg-006);
}
-#dispatch_AttributeCollectors li.fields-submit .field {
+#dispatch-list-container .fieldset-info > div {
+ flex-grow: 1;
+}
+#dispatch-list-container li.fields-submit .field {
display: grid;
}
-#dispatch_AttributeCollectors .field-name,
-#dispatch_AttributeCollectors .field-desc {
+#dispatch-list-container .field-name,
+#dispatch-list-container .field-desc {
padding: 0;
}
-#dispatch_AttributeCollectors .field-title,
-#dispatch_AttributeCollectors legend {
+#dispatch-list-container .field-title,
+#dispatch-list-container legend {
font-size: 1.05rem;
margin-bottom: 0;
}
-#dispatch_AttributeCollectors .field-info {
+#dispatch-list-container .field-info {
padding-top: 0.5em;
}
-#dispatch_AttributeCollectors input[type='text'],
-#dispatch_AttributeCollectors textarea {
+#dispatch-list-container input[type='text'],
+#dispatch-list-container textarea {
padding: 0.5rem;
}
/* DIALOG BOX */
diff --git a/app/webroot/css/co-responsive.css b/app/webroot/css/co-responsive.css
index a3c284f2..ac115089 100644
--- a/app/webroot/css/co-responsive.css
+++ b/app/webroot/css/co-responsive.css
@@ -472,41 +472,55 @@
white-space: nowrap;
}
/* ENROLLMENT FLOWS: ATTRIBUTE COLLECTOR */
- #dispatch_AttributeCollectors .fieldset-info {
+ #dispatch-list-container .fieldset-info {
flex-direction: row;
padding: 0;
border: none;
}
- #dispatch_AttributeCollectors .fieldset-subgroup {
+ #dispatch-list-container .fieldset-subgroup {
display: flex;
width: 100%;
gap: 1em;
}
- #dispatch_AttributeCollectors .fieldset-subgroup .fieldset-field {
+ #dispatch-list-container .fieldset-subgroup .fieldset-field {
flex-grow: 1;
}
/* Attribute Specific Styles */
/* addresses */
- #dispatch_AttributeCollectors .fields-address .fieldset-info {
+ #dispatch-list-container .fields-address .fieldset-info {
/* Retain the mobile style for addresses */
flex-direction: column;
padding: 1em;
border: 1px solid var(--cmg-color-bg-006);
}
- #dispatch_AttributeCollectors .fields-address .fieldset-info .fieldset-subgroup:first-child .fieldset-field.fields-room {
+ #dispatch-list-container .fields-address .fieldset-info .fieldset-subgroup:first-child .fieldset-field.fields-room {
flex-grow: 0;
}
- #dispatch_AttributeCollectors .fields-address .fieldset-info .fieldset-subgroup:first-child .fieldset-field.fields-room input {
+ #dispatch-list-container .fields-address .fieldset-info .fieldset-subgroup:first-child .fieldset-field.fields-room input {
width: 12.4rem;
}
/* names */
- #dispatch_AttributeCollectors .fields-name .fieldset-info .fieldset-field.fields-honorific input,
- #dispatch_AttributeCollectors .fields-name .fieldset-info .fieldset-field.fields-suffix input {
+ #dispatch-list-container .fields-name .fieldset-info .fieldset-field.fields-honorific,
+ #dispatch-list-container .fields-name .fieldset-info .fieldset-field.fields-suffix {
+ flex-shrink: 1;
+ flex-grow: 0;
+ }
+ #dispatch-list-container .fields-name .fieldset-info .fieldset-field.fields-honorific input,
+ #dispatch-list-container .fields-name .fieldset-info .fieldset-field.fields-suffix input {
width: 5em;
}
/* telephone numbers */
- #dispatch_AttributeCollectors .fields-telephoneNumber .fieldset-info .fieldset-field.fields-number input {
- width: 24em;
+ #dispatch-list-container .fields-telephoneNumber .fieldset-info .fieldset-field {
+ flex-shrink: 1;
+ flex-grow: 0;
+ }
+ #dispatch-list-container .fields-telephoneNumber .fieldset-info .fieldset-field.fields-number {
+ flex-grow: 1;
+ }
+ #dispatch-list-container .fields-telephoneNumber .fieldset-info .fieldset-field.fields-country_code input,
+ #dispatch-list-container .fields-telephoneNumber .fieldset-info .fieldset-field.fields-area_code input,
+ #dispatch-list-container .fields-telephoneNumber .fieldset-info .fieldset-field.fields-extension input {
+ width: 7em;
}
/* PETITIONS */
ul.form-list li.petition-enrollee-items .field-info {
@@ -576,10 +590,12 @@
font-size: 1.7em;
margin: 0.5em 0 0.25em;
}
- body.attributecollectors #main-wrapper {
+ body.attributecollectors #main-wrapper,
+ body.basicattributecollectors #main-wrapper {
background-color: var(--cmg-color-bg-003);
}
- body.attributecollectors #main {
+ body.attributecollectors #main,
+ body.basicattributecollectors #main {
background-color: var(--cmg-color-body-bg);
margin: 4em auto;
padding: 0 2em;