diff --git a/app/pages/conferences.php b/app/pages/conferences.php
index 60fa75d..9108bc0 100644
--- a/app/pages/conferences.php
+++ b/app/pages/conferences.php
@@ -8,12 +8,6 @@
  * Supports pagination.
  */
 
-// Get any new messages
-include '../app/includes/messages.php';
-include '../app/includes/messages-show.php';
-
-require '../app/classes/conference.php';
-
 // connect to database
 $response = connectDB($config, 'jilo', $platformDetails[0]['jilo_database'], $platform_id);
 
@@ -52,13 +46,31 @@ if ($response['db'] === null) {
     // Conference listings
     //
 
+    require '../app/classes/conference.php';
     $conferenceObject = new Conference($db);
 
+    // get current page for pagination
+    $currentPage = $_REQUEST['page_num'] ?? 1;
+    $currentPage = (int)$currentPage;
+
     // pagination variables
-    $items_per_page = 15;
-    $browse_page = $_REQUEST['p'] ?? 1;
-    $browse_page = (int)$browse_page;
-    $offset = ($browse_page -1) * $items_per_page;
+    $items_per_page = 20;
+    $offset = ($currentPage -1) * $items_per_page;
+
+    // Build params for pagination
+    $params = '';
+    if (!empty($_REQUEST['from_time'])) {
+        $params .= '&from_time=' . urlencode($_REQUEST['from_time']);
+    }
+    if (!empty($_REQUEST['until_time'])) {
+        $params .= '&until_time=' . urlencode($_REQUEST['until_time']);
+    }
+    if (!empty($_REQUEST['name'])) {
+        $params .= '&name=' . urlencode($_REQUEST['name']);
+    }
+    if (!empty($_REQUEST['id'])) {
+        $params .= '&id=' . urlencode($_REQUEST['id']);
+    }
 
     // search and list specific conference ID
     if (isset($conferenceId)) {
@@ -77,7 +89,7 @@ if ($response['db'] === null) {
     if (!empty($search)) {
         // we get total items and number of pages
         $item_count = count($search_all);
-        $page_count = ceil($item_count / $items_per_page);
+        $totalPages = ceil($item_count / $items_per_page);
 
         $conferences = array();
         $conferences['records'] = array();
@@ -139,31 +151,20 @@ if ($response['db'] === null) {
         }
     }
 
-    // prepare the widget
-    $widget['full'] = false;
-    $widget['name'] = 'Conferences';
-    $widget['collapsible'] = false;
-    $widget['collapsed'] = false;
-    $widget['filter'] = true;
-    $widget['pagination'] = true;
-
-    // widget title
+    // filter message
+    $filterMessage = array();
     if (isset($_REQUEST['name']) && $_REQUEST['name'] != '') {
-        $widget['title'] = 'Conferences with name matching "<strong>' . $_REQUEST['name'] . '"</strong>';
+        array_push($filterMessage, 'Conferences with name matching "<strong>' . $_REQUEST['name'] . '</strong>"');
     } elseif (isset($_REQUEST['id']) && $_REQUEST['id'] != '') {
-        $widget['title'] = 'Conference with ID "<strong>' . $_REQUEST['id'] . '"</strong>';
-    } else {
-        $widget['title'] = 'All conferences';
-    }
-    // widget records
-    if (!empty($conferences['records'])) {
-        $widget['full'] = true;
-        $widget['table_headers'] = array_keys($conferences['records'][0]);
-        $widget['table_records'] = $conferences['records'];
+        array_push($filterMessage, 'Conferences with ID "<strong>' . $_REQUEST['id'] . '</strong>"');
     }
 
+    // Get any new messages
+    include '../app/includes/messages.php';
+    include '../app/includes/messages-show.php';
+
     // display the widget
-    include '../app/templates/event-list-conferences.php';
+    include '../app/templates/conferences.php';
 
 }
 
diff --git a/app/pages/participants.php b/app/pages/participants.php
index f505e2c..fa89401 100644
--- a/app/pages/participants.php
+++ b/app/pages/participants.php
@@ -19,31 +19,9 @@ if ($response['db'] === null) {
 } else {
     $db = $response['db'];
 
-    // Get current page for pagination
-    $currentPage = $_REQUEST['page_num'] ?? 1;
-    $currentPage = (int)$currentPage;
-
     // specify time range
     include '../app/helpers/time_range.php';
 
-    // Build params for pagination
-    $params = '';
-    if (!empty($_REQUEST['from_time'])) {
-        $params .= '&from_time=' . urlencode($_REQUEST['from_time']);
-    }
-    if (!empty($_REQUEST['until_time'])) {
-        $params .= '&until_time=' . urlencode($_REQUEST['until_time']);
-    }
-    if (!empty($_REQUEST['name'])) {
-        $params .= '&name=' . urlencode($_REQUEST['name']);
-    }
-    if (!empty($_REQUEST['id'])) {
-        $params .= '&id=' . urlencode($_REQUEST['id']);
-    }
-    if (isset($_REQUEST['event'])) {
-        $params .= '&ip=' . urlencode($_REQUEST['ip']);
-    }
-
     // participant id/name/IP are specified when searching specific participant(s)
     // participant name - this is 'stats_id' in the db
     // either id, name, OR IP - in that order
@@ -71,10 +49,32 @@ if ($response['db'] === null) {
     require '../app/classes/participant.php';
     $participantObject = new Participant($db);
 
+    // get current page for pagination
+    $currentPage = $_REQUEST['page_num'] ?? 1;
+    $currentPage = (int)$currentPage;
+
     // pagination variables
     $items_per_page = 20;
     $offset = ($currentPage -1) * $items_per_page;
 
+    // Build params for pagination
+    $params = '';
+    if (!empty($_REQUEST['from_time'])) {
+        $params .= '&from_time=' . urlencode($_REQUEST['from_time']);
+    }
+    if (!empty($_REQUEST['until_time'])) {
+        $params .= '&until_time=' . urlencode($_REQUEST['until_time']);
+    }
+    if (!empty($_REQUEST['name'])) {
+        $params .= '&name=' . urlencode($_REQUEST['name']);
+    }
+    if (!empty($_REQUEST['id'])) {
+        $params .= '&id=' . urlencode($_REQUEST['id']);
+    }
+    if (isset($_REQUEST['event'])) {
+        $params .= '&ip=' . urlencode($_REQUEST['ip']);
+    }
+
     // search and list specific participant ID
     if (isset($participantId)) {
         $search = $participantObject->conferenceByParticipantId($participantId, $from_time, $until_time, $offset, $items_per_page);
diff --git a/app/templates/conferences.php b/app/templates/conferences.php
new file mode 100644
index 0000000..1f2c954
--- /dev/null
+++ b/app/templates/conferences.php
@@ -0,0 +1,131 @@
+
+                <!-- jitsi conferences events -->
+                <div class="container-fluid mt-2">
+                    <div class="row mb-4">
+                        <div class="col-md-6 mb-5">
+                            <h2 class="mb-0">Jitsi conferences events</h2>
+                            <small>log events related to conferences in Jitsi Meet</small>
+                        </div>
+                        <div class="row mb-4">
+
+                            <!-- conference events filter -->
+                            <div class="card mb-3">
+                                <div class="card-body">
+                                    <form method="get" action="" class="row g-3 align-items-end">
+                                        <input type="hidden" name="page" value="conferences">
+                                        <div class="col-md-auto">
+                                            <label for="from_time" class="form-label">From date</label>
+                                            <input type="date" class="form-control" id="from_time" name="from_time" value="<?= htmlspecialchars($_REQUEST['from_time'] ?? '') ?>">
+                                        </div>
+                                        <div class="col-md-auto">
+                                            <label for="until_time" class="form-label">Until date</label>
+                                            <input type="date" class="form-control" id="until_time" name="until_time" value="<?= htmlspecialchars($_REQUEST['until_time'] ?? '') ?>">
+                                        </div>
+                                        <div class="col-md-2">
+                                            <label for="name" class="form-label">Conference ID</label>
+                                            <input type="text" class="form-control" id="id" name="name" value="<?= htmlspecialchars($_REQUEST['id'] ?? '') ?>" placeholder="Conference ID">
+                                        </div>
+                                        <div class="col-md-4">
+                                            <label for="name" class="form-label">Conference name</label>
+                                            <input type="text" class="form-control" id="name" name="name" value="<?= htmlspecialchars($_REQUEST['name'] ?? '') ?>" placeholder="Search in conference names">
+                                        </div>
+                                        <div class="col-md-auto align-middle">
+                                            <button type="submit" class="btn btn-primary me-2">
+                                                <i class="fas fa-search me-2"></i>Search
+                                            </button>
+                                            <a href="?page=conferences" class="btn btn-outline-secondary">
+                                                <i class="fas fa-times me-2"></i>Clear
+                                            </a>
+                                        </div>
+                                    </form>
+                                </div>
+                            </div>
+                            <!-- /conference events filter -->
+
+                            <!-- conference events -->
+<?php if ($time_range_specified || count($filterMessage)) { ?>
+                            <div class="alert alert-info m-0 mb-3 small">
+<?php   if ($time_range_specified) { ?>
+                                <p class="mb-0"><i class="fas fa-calendar-alt me-2"></i>Time period: <strong><?= htmlspecialchars($from_time) ?> - <?= htmlspecialchars($until_time) ?></strong></p>
+<?php   } ?>
+<?php   if (count($filterMessage)) {
+          foreach ($filterMessage as $message) { ?>
+                                <p class="mb-0"><i class="fas fa-users me-2"></i><?= $message ?></strong></p>
+<?php     } ?>
+<?php   } ?>
+                            </div>
+<?php } ?>
+
+                            <div class="mb-5">
+<?php if (!empty($conferences['records'])) { ?>
+                                <div class="table-responsive border">
+                                    <table class="table table-results table-hover">
+                                        <thead class="table-light">
+                                            <tr>
+<?php     foreach (array_keys($conferences['records'][0]) as $header) { ?>
+                                                <th scope="col" class="text-nowrap"><?= htmlspecialchars($header) ?></th>
+<?php     } ?>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+<?php     foreach ($conferences['records'] as $row) { ?>
+                                            <tr>
+<?php       foreach ($row as $key => $column) {
+                    if ($key === 'conference ID' && isset($conferenceId) && $conferenceId === $column) { ?>
+<td class="text-nowrap">
+    <strong 
+        <?= (strlen($column ?? '') > 20) ? 'data-toggle="tooltip" title="' . htmlspecialchars($column) . '"' : '' ?>>
+        <?= htmlspecialchars(strlen($column ?? '') > 20 ? substr($column, 0, 20) . '...' : $column ?? '') ?>
+    </strong>
+</td>
+<?php               } elseif ($key === 'conference ID') { ?>
+<td class="text-nowrap">
+    <a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&id=<?= htmlspecialchars($column ?? '') ?>"
+       <?= (strlen($column ?? '') > 16) ? 'data-toggle="tooltip" title="' . htmlspecialchars($column) . '"' : '' ?>>
+        <?= htmlspecialchars(strlen($column ?? '') > 16 ? substr($column, 0, 16) . '...' : $column ?? '') ?>
+    </a>
+</td>
+<?php               } elseif ($key === 'conference name' && isset($conferenceName) && $conferenceName === $column) { ?>
+<td class="text-nowrap">
+    <strong 
+        <?= (strlen($column ?? '') > 20) ? 'data-toggle="tooltip" title="' . htmlspecialchars($column) . '"' : '' ?>>
+        <?= htmlspecialchars(strlen($column ?? '') > 20 ? substr($column, 0, 20) . '...' : $column ?? '') ?>
+    </strong>
+</td>
+<?php               } elseif ($key === 'conference name') { ?>
+<td class="text-nowrap">
+    <a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&name=<?= htmlspecialchars($column ?? '') ?>"
+       <?= (strlen($column ?? '') > 16) ? 'data-toggle="tooltip" title="' . htmlspecialchars($column) . '"' : '' ?>>
+        <?= htmlspecialchars(strlen($column ?? '') > 16 ? substr($column, 0, 16) . '...' : $column ?? '') ?>
+    </a>
+</td>
+<?php               } elseif ($key === 'conference host') { ?>
+<td class="text-nowrap">
+    <strong 
+        <?= (strlen($column ?? '') > 30) ? 'data-toggle="tooltip" title="' . htmlspecialchars($column) . '"' : '' ?>>
+        <?= htmlspecialchars(strlen($column ?? '') > 30 ? substr($column, 0, 30) . '...' : $column ?? '') ?>
+    </strong>
+</td>
+<?php
+                    } elseif ($key === 'time' || $key === 'start' || $key === 'end') { ?>
+                                                <td class="text-nowrap"><?= !empty($column) ? date('d M Y H:i:s',strtotime($column)) : 'n/a' ?></td>
+<?php               } else { ?>
+                                                <td><?= htmlspecialchars($column ?? '') ?></td>
+<?php               }
+            } ?>
+                                            </tr>
+<?php     } ?>
+                                        </tbody>
+                                    </table>
+                                </div>
+<?php include '../app/templates/pagination.php'; ?>
+<?php } else { ?>
+                                <div class="alert alert-danger m-0">
+                                    <i class="fas fa-info-circle me-2"></i>No conference events found for the specified criteria.
+                                </div>
+<?php } ?>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <!-- /jitsi conferences events -->
diff --git a/app/templates/event-list-conferences.php b/app/templates/event-list-conferences.php
deleted file mode 100644
index 13368ef..0000000
--- a/app/templates/event-list-conferences.php
+++ /dev/null
@@ -1,94 +0,0 @@
-
-                <div class="row">
-                    <div class="card w-auto bg-light border-light card-body"  style="flex-direction: row;"><?= $widget['title'] ?></div>
-
-                    <!-- Results filter -->
-                    <div class="card w-auto bg-light border-light card-body text-right" style="text-align: right;">
-                        <form method="POST" id="filter_form" class="filter-results" action="?platform=<?= htmlspecialchars($platform_id) ?>&page=<?= htmlspecialchars($page) ?>">
-                            <label for="from_time">from</label>
-                            <input type="date" id="from_time" name="from_time"<?php if (isset($_REQUEST['from_time'])) echo " value=\"" . htmlspecialchars($from_time) . "\"" ?> />
-                            <label for="until_time">until</label>
-                            <input type="date" id="until_time" name="until_time"<?php if (isset($_REQUEST['until_time'])) echo " value=\"" . htmlspecialchars($until_time) . "\"" ?> />
-                            <input type="text" name="id" placeholder="conference ID"<?php if (isset($_REQUEST['id'])) echo " value=\"" . htmlspecialchars($_REQUEST['id']) . "\"" ?> />
-                            <input type="text" name="name" placeholder="conference name"<?php if (isset($_REQUEST['name'])) echo " value=\"" . htmlspecialchars($_REQUEST['name']) . "\"" ?> />
-                            <input type="button" onclick="clearFilter()" value="clear" />
-                            <input type="submit" value="search" />
-                        </form>
-                        <script>
-                            function clearFilter() {
-                                document.getElementById("filter_form").reset();
-                                const filterFields = document.querySelectorAll("#filter_form input");
-                                filterFields.forEach(input => {
-                                    if (input.type === 'text' ||input.type === 'date') {
-                                        input.value = '';
-                                    }
-                                });
-                            }
-                        </script>
-                    </div>
-                    <!-- /Results filter -->
-
-                </div>
-
-                <!-- widget "<?= htmlspecialchars($widget['name']) ?>" -->
-                <div class="collapse show" id="collapse<?= htmlspecialchars($widget['name']) ?>">
-<?php if ($time_range_specified) { ?>
-                    <p class="m-3">time period: <strong><?= htmlspecialchars($from_time) ?> - <?= htmlspecialchars($until_time) ?></strong></p>
-<?php } ?>
-                    <div class="mb-5">
-<?php if ($widget['full'] === true) { ?>
-                        <table class="table table-results table-striped table-hover table-bordered">
-                            <thead class="thead-dark">
-                                <tr>
-<?php     foreach ($widget['table_headers'] as $header) { ?>
-                                    <th scope="col"><?= htmlspecialchars($header) ?></th>
-<?php     } ?>
-                                </tr>
-                            </thead>
-                            <tbody>
-<?php     foreach ($widget['table_records'] as $row) { ?>
-                                <tr>
-<?php       $stats_id = false;
-            $participant_ip = false;
-            if (isset($row['event']) && $row['event'] === 'stats_id') $stats_id = true;
-            if (isset($row['event']) && $row['event'] === 'pair selected') $participant_ip = true;
-
-            foreach ($row as $key => $column) {
-                    if ($key === 'conference ID' && isset($conferenceId) && $conferenceId === $column) { ?>
-                                    <td><strong><?= htmlspecialchars($column ?? '') ?></strong></td>
-<?php               } elseif ($key === 'conference ID') { ?>
-                                    <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&id=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
-<?php               } elseif ($key === 'conference name' && isset($conferenceName) && $conferenceName === $column) { ?>
-                                    <td><strong><?= htmlspecialchars($column ?? '') ?></strong></td>
-<?php               } elseif ($key === 'conference name') { ?>
-                                    <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&name=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
-<?php               } elseif ($key === 'participant ID') { ?>
-                                    <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=participants&id=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
-<?php               } elseif ($stats_id && $key === 'parameter') { ?>
-                                    <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=participants&name=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
-<?php               } elseif ($participant_ip && $key === 'parameter') { ?>
-                                    <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=participants&ip=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
-<?php
-                    // in general listings we don't show seconds and miliseconds
-                    } elseif ($key === 'start' || $key === 'end') { ?>
-                                    <td><?= htmlspecialchars(substr($column ?? '', 0, -7)) ?></td>
-<?php               } else { ?>
-                                    <td><?= htmlspecialchars($column ?? '') ?></td>
-<?php               }
-            } ?>
-                                </tr>
-<?php     } ?>
-                            </tbody>
-                        </table>
-<?php
-if ($widget['pagination'] && $item_count > $items_per_page) {
-    $url = "$app_root?platform=$platform_id&page=$page";
-    include '../app/helpers/pagination.php';
-}
-?>
-<?php } else { ?>
-                    <p class="m-3">No matching records found.</p>
-<?php } ?>
-                    </div>
-                </div>
-                <!-- /widget "<?= htmlspecialchars($widget['name']) ?>" -->
diff --git a/app/templates/participants.php b/app/templates/participants.php
index 24bee31..c5c55e2 100644
--- a/app/templates/participants.php
+++ b/app/templates/participants.php
@@ -40,7 +40,7 @@
                                     </form>
                                 </div>
                             </div>
-                            <!-- /paerticipant events filter -->
+                            <!-- /participant events filter -->
 
                             <!-- participant events -->
 <?php if ($time_range_specified || count($filterMessage)) { ?>
@@ -63,7 +63,7 @@
                                         <thead class="table-light">
                                             <tr>
 <?php     foreach (array_keys($participants['records'][0]) as $header) { ?>
-                                                <th scope="col"><?= htmlspecialchars($header) ?></th>
+                                                <th scope="col" class="text-nowrap"><?= htmlspecialchars($header) ?></th>
 <?php     } ?>
                                             </tr>
                                         </thead>
@@ -75,14 +75,20 @@
             if (isset($row['event']) && $row['event'] === 'stats_id') $stats_id = true;
             if (isset($row['event']) && $row['event'] === 'pair selected') $participant_ip = true;
             foreach ($row as $key => $column) {
-                    if ($key === 'conference ID' && isset($conferenceId) && $conferenceId === $column) { ?>
-                                                <td><strong><?= htmlspecialchars($column ?? '') ?></strong></td>
-<?php               } elseif ($key === 'conference ID') { ?>
-                                                <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&id=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
-<?php               } elseif ($key === 'conference name' && isset($conferenceName) && $conferenceName === $column) { ?>
-                                                <td><strong><?= htmlspecialchars($column ?? '') ?></strong></td>
+                    if ($key === 'conference ID') { ?>
+<td class="text-nowrap">
+    <a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&id=<?= htmlspecialchars($column ?? '') ?>"
+       <?= (strlen($column ?? '') > 16) ? 'data-toggle="tooltip" title="' . htmlspecialchars($column) . '"' : '' ?>>
+        <?= htmlspecialchars(strlen($column ?? '') > 16 ? substr($column, 0, 16) . '...' : $column ?? '') ?>
+    </a>
+</td>
 <?php               } elseif ($key === 'conference name') { ?>
-                                                <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&name=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
+<td class="text-nowrap">
+    <a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=conferences&name=<?= htmlspecialchars($column ?? '') ?>"
+       <?= (strlen($column ?? '') > 16) ? 'data-toggle="tooltip" title="' . htmlspecialchars($column) . '"' : '' ?>>
+        <?= htmlspecialchars(strlen($column ?? '') > 16 ? substr($column, 0, 16) . '...' : $column ?? '') ?>
+    </a>
+</td>
 <?php               } elseif ($key === 'participant ID' && isset($participantId) && $participantId === $column) { ?>
                                                 <td><strong><?= htmlspecialchars($column ?? '') ?></strong></td>
 <?php               } elseif ($key === 'participant ID') { ?>
@@ -100,8 +106,8 @@
 <?php               } elseif ($key === 'component') { ?>
                                                 <td><a href="<?= htmlspecialchars($app_root) ?>?platform=<?= htmlspecialchars($platform_id) ?>&page=components&name=<?= htmlspecialchars($column ?? '') ?>"><?= htmlspecialchars($column ?? '') ?></a></td>
 <?php
-                    } elseif ($key === 'time' || $key === 'start' || $key === 'end') { ?>
-                                                <td><?= date('d M Y H:i:s',strtotime($column)) ?></td>
+                    } elseif ($key === 'time') { ?>
+                                                <td class="text-nowrap"><?= !empty($column) ? date('d M Y H:i:s',strtotime($column)) : 'n/a' ?></td>
 <?php               } else { ?>
                                                 <td><?= htmlspecialchars($column ?? '') ?></td>
 <?php               }