Skip to content
Jump to bottom

Add titles to Petition steps and buttons to the steps index (CFM-31) #173

Merged
merged 1 commit into from Mar 13, 2024
Merged

Add titles to Petition steps and buttons to the steps index (CFM-31) #173

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
89 changes: 61 additions & 28 deletions app/templates/Petitions/resume.php
View file
Open in desktop
Expand Up @@ -30,33 +30,66 @@
// Track when we've rendered the current/next step so we know when to stop rendering links
$seenNextStep = false;
?>
<table>
<tr>
<th><?= __d('field', 'ordr') ?></th>
<th><?= __d('controller', 'EnrollmentFlowSteps', [1]) ?></th>
<th><?= __d('result', 'result') ?></th>
<th><?= __d('field', 'EnrollmentFlows.authz_type') ?></th>
<th><?= __d('field', 'action') ?></th>
</tr>
<?php foreach($vv_steps as $step): ?>
<tr>
<td><?= $step->ordr ?? "" ?></td>
<td><?= $step->description ?></td>
<!-- this could be a link to the detailed step result -->
<td><?= $step->petition_step_results[0]->comment ?? "" ?></td>
<td><?= __d('enumeration', 'EnrollmentActorEnum.'.$step->actor_type) ?></td>
<td><?php
if(!$seenNextStep && !empty($vv_dispatch_urls[ $step->id ])) {
print $this->Html->link(
($step->id == $vv_next_step_id) ? __d('operation', 'continue') : __d('operation', 'Petitions.rerun'),
$vv_dispatch_urls[ $step->id ]
);

if($step->id == $vv_next_step_id) {
$seenNextStep = true;
<div class="page-title-container">
<div class="page-title">
<h1><?= $vv_primary_link_obj->name; // this is the Enrollment Flow name ?></h1>
</div>
</div>

<!-- Flash Messages and defined Info Banners -->
<div class="alert-container" id="flash-messages">
<?= $this->Flash->render() ?>

<?php if(!empty($indexBanners)): ?>
<?php foreach($indexBanners as $b): ?>
<?= $this->Alert->alert($b, 'warning') ?>
<?php endforeach; // $indexBanners ?>
<?php endif; // $indexBanners ?>

<?php if(!empty($banners)): ?>
<?php foreach($banners as $b): ?>
<?= $this->Alert->alert($b, 'warning') ?>
<?php endforeach; // $banners ?>
<?php endif; // $banners ?>
</div>

<!-- Our view is similar to index.php -->
<div class="table-container">
<table id="petition-resume" class="index-table list-mode with-actions">
<tr>
<th><?= __d('field', 'ordr') ?></th>
<th><?= __d('controller', 'EnrollmentFlowSteps', [1]) ?></th>
<th><?= __d('result', 'result') ?></th>
<th><?= __d('field', 'EnrollmentFlows.authz_type') ?></th>
<th><?= __d('field', 'action') ?></th>
</tr>
<?php foreach($vv_steps as $step): ?>
<tr>
<td><?= $step->ordr ?? "" ?></td>
<td><?= $step->description ?></td>
<!-- this could be a link to the detailed step result -->
<td><?= $step->petition_step_results[0]->comment ?? "" ?></td>
<td><?= __d('enumeration', 'EnrollmentActorEnum.'.$step->actor_type) ?></td>
<td><?php
if(!$seenNextStep && !empty($vv_dispatch_urls[ $step->id ])) {
print $this->Html->link(
($step->id == $vv_next_step_id) ?
__d('operation', 'continue') . ' <span class="material-icons-outlined">arrow_forward</span>' :
__d('operation', 'Petitions.rerun') . ' <span class="material-icons-outlined">restart_alt</span>',
$vv_dispatch_urls[ $step->id ],
[
'class' => 'btn btn-sm ' . (($step->id == $vv_next_step_id) ? 'btn-tertiary ef-continue-step' : 'btn-default ef-rerun-step'),
'escape' => false
]
);

if($step->id == $vv_next_step_id) {
$seenNextStep = true;
}
}
}
?></td>
</tr>
<?php endforeach; // $vv_steps ?>
</table>
?></td>
</tr>
<?php endforeach; // $vv_steps ?>
</table>
</div>
27 changes: 27 additions & 0 deletions app/templates/Standard/dispatch.php
View file
Open in desktop
Expand Up @@ -35,6 +35,33 @@
// $vv_template_path will be set for plugins
$templatePath = $vv_template_path ?? ROOT . DS . "templates" . DS . $modelsName;

?>

<div class="page-title-container">
<div class="page-title">
<h1><?= $vv_title; ?></h1>
</div>
</div>

<!-- Flash Messages and defined Info Banners -->
<div class="alert-container" id="flash-messages">
<?= $this->Flash->render() ?>

<?php if(!empty($indexBanners)): ?>
<?php foreach($indexBanners as $b): ?>
<?= $this->Alert->alert($b, 'warning') ?>
<?php endforeach; // $indexBanners ?>
<?php endif; // $indexBanners ?>

<?php if(!empty($banners)): ?>
<?php foreach($banners as $b): ?>
<?= $this->Alert->alert($b, 'warning') ?>
<?php endforeach; // $banners ?>
<?php endif; // $banners ?>
</div>

<?php

// 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();
Expand Down
53 changes: 37 additions & 16 deletions app/webroot/css/co-base.css
View file
Open in desktop
Expand Up @@ -1609,6 +1609,15 @@ ul.form-list .cm-time-picker-vals li {
.eis-meta.eis-item {
width: 50%;
}
/* PETITIONS */
#petition-resume td {
vertical-align: middle;
}
.btn.ef-continue-step,
.btn.ef-rerun-step {
padding-right: 1em;
white-space: nowrap;
}
/* GENERAL */
.hidden,
.invisible,
Expand Down Expand Up @@ -1883,11 +1892,37 @@ button, .btn, .btn:hover {
color: var(--cmg-color-txt-inverse);
border-color: var(--cmg-color-btn-bg-001);
}
.btn-secondary,
.btn-secondary:focus,
.btn-secondary:active {
background-color: var(--cmg-color-btn-bg-004);
color: var(--cmg-color-txt-inverse);
}
.btn-tertiary,
.btn-tertiary:focus,
.btn-tertiary:active {
background-color: var(--cmg-color-btn-bg-005);
color: var(--cmg-color-txt-inverse);
}
.btn-default,
.btn-default:focus,
.btn-default:active {
background-color: var(--cmg-color-bg-005);
}
.btn-primary,
.btn-primary:active {
.btn-secondary,
.btn-tertiary,
.btn-default,
.btn-primary:active,
.btn-secondary:active,
.btn-tertiary:active,
.btn-default:active {
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
}
.btn-primary:hover {
.btn-primary:hover,
.btn-secondary:hover,
.btn-tertiary:hover,
.btn-default:hover {
background-color: var(--cmg-color-btn-bg-002);
color: var(--cmg-color-txt-inverse) !important;
border-color: var(--cmg-color-btn-bg-002);
Expand All @@ -1900,24 +1935,10 @@ button, .btn, .btn:hover {
border-color: var(--cmg-color-btn-bg-001);
opacity: 0.4;
}
.btn-default,
.btn-default:active {
background-color: var(--cmg-color-bg-005);
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
}
html.dark-mode .btn-default,
html.dark-mode .btn-default:active {
background-color: var(--cmg-color-bg-005);
}
.btn-default:hover {
background-color: var(--cmg-color-btn-bg-001);
color: var(--cmg-color-txt-inverse) !important;
text-decoration: none !important;
}
.btn-secondary {
background-color: var(--cmg-color-btn-004);
color: var(--cmg-color-txt-inverse);
}
.btn-link {
font-size: 1em;
text-decoration: underline;
Expand Down
6 changes: 4 additions & 2 deletions app/webroot/css/co-color.css
View file
Open in desktop
Expand Up @@ -51,7 +51,8 @@
--cmg-color-btn-bg-001: #115791; /* primary button background color (blue), submit buttons, .btn-primary, pagination */
--cmg-color-btn-bg-002: #000; /* primary button hover color (black) */
--cmg-color-btn-bg-003: #444; /* common background color (gray) */
--cmg-color-btn-004: #c33; /* button (red) */
--cmg-color-btn-bg-004: #c33; /* button (red) */
--cmg-color-btn-bg-005: #17730d; /* button (green) */

/* General Background and Border Colors (Grayscale) */
--cmg-color-bg-001: #fafafa; /* background color */
Expand Down Expand Up @@ -127,7 +128,8 @@ html.dark-mode {
--cmg-color-btn-bg-001: #0d4573; /* primary button background color (blue), submit buttons, .btn-primary, pagination */
--cmg-color-btn-bg-002: #333; /* primary button hover color (black) */
--cmg-color-btn-bg-003: #eee; /* common background color (gray) */
--cmg-color-btn-004: #c33; /* button (red) */
--cmg-color-btn-bg-004: #c33; /* button (red) */
--cmg-color-btn-bg-005: #17730d; /* button (green) */

/* General Background and Border Colors (Grayscale) */
--cmg-color-bg-001: #121212; /* background color */
Expand Down