Alignment in a d-flex list-group-item (account_history_info.php)

[ArtcoInc]

When a customer displays their order history (account_history.php), the orders are displayed in a table.

Screen Capture - 2025-12-29-A.jpg

However, when the customer selects to display the info for a single order (account_history_info.php), the order history is displayed as a "list-group-item d-flex".

Screen Capture - 2025-12-29-B.jpg

(here's the code)

Code: Select all

  <ul class="list-group">
    <?php
    $statuses_query = tep_db_query("select os.orders_status_name, osh.date_added, osh.comments from orders_status os, orders_status_history osh where osh.orders_id = '" . (int)$_GET['order_id'] . "' and osh.orders_status_id = os.orders_status_id and os.language_id = '" . (int)$languages_id . "' and os.public_flag = '1' order by osh.date_added");
    while ($statuses = tep_db_fetch_array($statuses_query)) {


        echo '<li class="list-group-item d-flex justify-content-between align-items-center">';
        echo '<h6>' . $statuses['orders_status_name'] . '</h6>';
        echo (empty($statuses['comments']) ? '' : '<p>' . nl2br(tep_output_string_protected($statuses['comments'])) . '</p>');
        echo '<span class="badge badge-primary badge-pill"><i class="far fa-clock"></i> ' . $statuses['date_added'] . '</span>';
        echo '</li>';


    }
    ?>
  </ul>

I would like the comments to be left justified, not centered.

I know I could change the code to display this in a table, but is there another way to do this?

TIA

Malcolm
(Phoenix 1.0.4.0)

[BrockleyJohn]

Try giving the comment paragraph classes
bs5
flex-grow-1 text-start ms-2
bs4
flex-grow-1 text-left ml-2

The rows won't align perfectly unless you replace with a table because they are flexing line by line and the status texts are different lengths

[burt]

I believe this behaviour was changed in more recent Phoenix, see https://github.com/CE-PhoenixCart/Phoen ... #L107-L131

[ArtcoInc]

I decided to change the code to use a table. The rest of the page uses tables (I'm not sure why this part of the page was this way) ... and it's something I can understand <g>

Again, thank you both.

Malcolm