From 17ea360eb05bd5b527f46ad1e92e3513740d4098 Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Wed, 15 Nov 2023 14:36:14 +0200
Subject: [PATCH 01/13] Move to Bootstrap 5

---
 composer.json                      |    4 +-
 modules/calendar/hm-calendar.php   |   22 +-
 modules/calendar/modules.php       |   81 +-
 modules/calendar/site.css          |   26 +-
 modules/contacts/modules.php       |    8 +-
 modules/contacts/site.css          |   16 +-
 modules/core/output_modules.php    |   56 +-
 modules/core/site.css              |   26 +-
 modules/core/site.js               |    4 +-
 modules/feeds/modules.php          |    6 +-
 modules/feeds/site.css             |    6 +-
 modules/imap/output_modules.php    |   16 +-
 modules/imap/site.css              |    2 +-
 modules/local_contacts/modules.php |   26 +-
 modules/nux/modules.php            |   28 +-
 modules/nux/site.css               |   22 +-
 modules/pop3/modules.php           | 1129 ++++++++++++++++++++++++++++
 modules/smtp/modules.php           |    8 +-
 18 files changed, 1338 insertions(+), 148 deletions(-)
 create mode 100644 modules/pop3/modules.php

diff --git a/composer.json b/composer.json
index ca5443371e..296e7e0646 100644
--- a/composer.json
+++ b/composer.json
@@ -39,7 +39,9 @@
         "composer" : "^2.0.0",
         "zbateson/mail-mime-parser": "^2.4",
         "league/commonmark": "^2.4",
-        "symfony/dotenv": "^4.3 || 5.4"
+        "symfony/dotenv": "^4.3 || 5.4",
+        "twbs/bootstrap": "5.0.2",
+        "twbs/bootstrap-icons": "^1.11"
     },
     "require-dev": {
         "phpunit/phpunit": "^9.3.0"
diff --git a/modules/calendar/hm-calendar.php b/modules/calendar/hm-calendar.php
index 22e9288062..ec273263fc 100644
--- a/modules/calendar/hm-calendar.php
+++ b/modules/calendar/hm-calendar.php
@@ -45,7 +45,7 @@ public function output($data, $date, $format) {
     private function output_day($day) {
         $res = '<td class="';
         if ($day == $this->today) {
-            $res .= 'today ';
+            $res .= 'today bg-light';
         }
         if ($this->month != (int) date('n', strtotime($day))) {
             $res .= 'offmonth ';
@@ -66,7 +66,7 @@ private function output_event($day) {
             });
             $res = '';
             foreach ($this->events[$day] as $event) {
-                $res .= '<div class="cal_event">'.
+                $res .= '<div class="cal_event text-secondary">'.
                     $this->output_event_details($event).
                     $this->output_mod->html_safe(date('H:i', $event['ts'])).
                     ' <a class="cal_title">'.$this->output_mod->html_safe($event['title']).
@@ -79,18 +79,18 @@ private function output_event($day) {
 
     private function output_event_details($event) {
         $res = '<div class="event_details">'.
-            '<div class="event_title">'.$this->output_mod->html_safe($event['title']).
-            '<div class="event_date">'.$this->output_mod->html_safe(date('H:i A', $event['ts'])).'</div></div>';
+            '<div class="event_title d-flex flex-column border-bottom mb-2"><span class="fs-5">'.$this->output_mod->html_safe($event['title']).'</span>'.
+            '<small class="event_date fw-lighter">'.$this->output_mod->html_safe(date('H:i A', $event['ts'])).'</small></div>';
         if (strlen(trim($event['description']))) {
-            $res .= '<div class="event_detail">'.$this->output_mod->html_safe($event['description']).'</div>';
+            $res .= '<div class="event_detail mb-2">'.$this->output_mod->html_safe($event['description']).'</div>';
         }
         if (strlen(trim($event['repeat_interval']))) {
-            $res .= '<div class="event_repeat">'.$this->output_mod->trans(sprintf('Repeats every %s', $event['repeat_interval'])).'</div>';
+            $res .= '<div class="event_repeat"><small class="fw-lighter fst-italic">'.$this->output_mod->trans(sprintf('Repeats every %s', $event['repeat_interval'])).'</small></div>';
         }
             $res .= '<form method="post"><input type="hidden" name="delete_ts" value="'.$this->output_mod->html_safe($event['ts']).'" />'.
                 '<input type="hidden" name="delete_id" value="'.$this->output_mod->html_safe($event['id']).'" />'.
                 '<input type="hidden" name="hm_page_key" value="'.$this->output_mod->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<div class="event_delete"><a>Delete</a></div></form>';
+                '<div class="event_delete"><a class="btn btn-danger btn-sm">Delete</a></div></form>';
         $res .= '</div>';
         return $res;
     }
@@ -115,12 +115,12 @@ private function output_week($week) {
 
     private function output_month($month) {
         $res = $this->title();
-        $res .= '<table class="calendar_month">';
+        $res .= '<div class="m-4 border"><table class="calendar_month">';
         $res .= $this->output_heading();
         foreach ($month as $week) {
             $res .= $this->output_week($week);
         }
-        $res .= '</table>';
+        $res .= '</table></div>';
         return $res;
     }
 
@@ -162,13 +162,13 @@ private function title() {
         $month = date('F', strtotime($this->year.'-'.$this->month));
         $title = sprintf('%s, %%s', $month);
         $title = sprintf($this->output_mod->trans($title), $this->output_mod->translate_number($year));
-        return '<div class="month_label">'.$prev.' '.$title.' '.$next.'</div>';
+        return '<div class="month_label p-4 h5">'.$prev.' '.$title.' '.$next.'</div>';
     }
 
     private function output_heading() {
         $days = array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday');
         return '<tr>'.implode('', array_map(function($v) {
-            return sprintf('<th>%s</th>', $this->output_mod->trans($v)); }, $days)).'</tr>';
+            return sprintf('<th class="p-2 fw-bold border-bottom border-end">%s</th>', $this->output_mod->trans($v)); }, $days)).'</tr>';
     }
 }
 
diff --git a/modules/calendar/modules.php b/modules/calendar/modules.php
index 4ef108c300..66b69899ec 100644
--- a/modules/calendar/modules.php
+++ b/modules/calendar/modules.php
@@ -155,28 +155,63 @@ protected function output() {
             'year' => $this->trans('Yearly')
         );
         if ($this->get('cal_action') == 'add') {
-            $res = '<div class="calendar"><div class="content_title">'.$this->trans('Add an Event').'</div>'.
-                '<form method="post">'.
-                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<table class="event_form">'.
-                '<tr><td class="cal_label">'.$this->trans('Title').'</td>'.
-                '<td><input required type="text" name="event_title" /></td></tr>'.
-                '<tr><td class="cal_label">'.$this->trans('Detail').'</td>'.
-                '<td><textarea name="event_detail"></textarea></td></tr>'.
-                '<tr><td class="cal_label">'.$this->trans('Date').'</td>'.
-                '<td><input required type="date" name="event_date" placeholder="MM/DD/YYYY" /></td></tr>'.
-                '<tr><td class="cal_label">'.$this->trans('Time').'</td>'.
-                '<td><input required type="time" name="event_time" placeholder="HH:MM" /></td></tr>'.
-                '<tr><td class="cal_label">'.$this->trans('Repeat').'</td>'.
-                '<td><select name="event_repeat">';
-            foreach ($repeat_opts as $val => $name) {
-                $res .= '<option value="'.$val.'">'.$name.'</option>';
-            }
-            $res .= '</select></td></tr>'.
-                '<tr><td></td><td class="event_submit"><input type="submit" value="'.$this->trans('Create').
-                '" /></td></tr></tbody></table></form></div>';
+            $res = '<div class="calendar p-0">
+                        <div class="content_title">'.$this->trans('Add an Event').'</div>
+                        <div class="px-4 mt-5">
+                            <form method="post">
+                                <input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />
+                                
+                                <div class="mb-3 row">
+                                    <label for="event_title" class="col-md-2 col-form-label">'.$this->trans('Title').'</label>
+                                    <div class="col-md-10">
+                                        <input required type="text" class="form-control" id="event_title" name="event_title">
+                                    </div>
+                                </div>
+                                
+                                <div class="mb-3 row">
+                                    <label for="event_detail" class="col-md-2 col-form-label">'.$this->trans('Detail').'</label>
+                                    <div class="col-md-10">
+                                        <textarea class="form-control" id="event_detail" name="event_detail"></textarea>
+                                    </div>
+                                </div>
+                                
+                                <div class="mb-3 row">
+                                    <label for="event_date" class="col-md-2 col-form-label">'.$this->trans('Date').'</label>
+                                    <div class="col-md-5">
+                                        <input required type="date" class="form-control" id="event_date" name="event_date" placeholder="MM/DD/YYYY">
+                                    </div>
+                                </div>
+                                
+                                <div class="mb-3 row">
+                                    <label for="event_time" class="col-md-2 col-form-label">'.$this->trans('Time').'</label>
+                                    <div class="col-md-5">
+                                        <input required type="time" class="form-control" id="event_time" name="event_time" placeholder="HH:MM">
+                                    </div>
+                                </div>
+                                
+                                <div class="mb-3 row">
+                                    <label for="event_repeat" class="col-md-2 col-form-label">'.$this->trans('Repeat').'</label>
+                                    <div class="col-md-5">
+                                        <select class="form-select" id="event_repeat" name="event_repeat">';
+                                        foreach ($repeat_opts as $val => $name) {
+                                            $res .= '<option value="'.$val.'">'.$name.'</option>';
+                                        }
+                                        $res .= '</select>
+                                    </div>
+                                </div>
+                                
+                                <div class="mb-3 row">
+                                    <div class="col-md-2"></div>
+                                    <div class="col-md-10">
+                                        <button type="submit" class="btn btn-primary">'.$this->trans('Create').'</button>
+                                    </div>
+                                </div>
+                            </form>
+                        </div>
+                    </div>';
 
             return $res;
+
         }
     }
 }
@@ -196,9 +231,9 @@ protected function output() {
             $events = $cal_events->in_date_range($bounds[0], $bounds[1]);
             $out = new Hm_Cal_Output($this, $events);
             $out = $out->output($data, $date, $view);
-            return '<div class="calendar"><div class="content_title">'.$this->trans('Calendar').'</div>'.
-                '<div class="list_controls"><a href="?page=calendar&amp;action=add" title="'.$this->trans('Add Event').'" class="refresh_list">'.
-                '<img src="'.Hm_Image_Sources::$plus.'" /></a></div>'.
+            return '<div class="calendar p-0"><div class="content_title d-flex justify-content-between">'.$this->trans('Calendar').
+                '<a href="?page=calendar&amp;action=add" title="'.$this->trans('Add Event').'" class="btn btn-light btn-sm me-4">'.
+                '<i class="bi bi-plus-circle me-2"></i> '.$this->trans('Add Event').'</a></div>'.
                 $out.'</div>';
         }
     }
diff --git a/modules/calendar/site.css b/modules/calendar/site.css
index 70a3524def..d9d595c176 100644
--- a/modules/calendar/site.css
+++ b/modules/calendar/site.css
@@ -1,24 +1,22 @@
-.calendar { width: 100%; }
-.event_form { margin-left: 40px; }
-.calendar_week th, .calendar_month th { font-weight: normal; padding-top: 10px; border-bottom: solid 1px #eee; padding-bottom: 10px; border-right: solid 1px #eee; }
+/* .calendar { width: 100%; } */
+/* .event_form { margin-left: 40px; } */
+/* .calendar_week th, .calendar_month th { font-weight: normal; padding-top: 10px; border-bottom: solid 1px #eee; padding-bottom: 10px; border-right: solid 1px #eee; } */
 .mobile .calendar_month th { max-width: 30px; overflow: hidden; }
 .calendar_month td { width: 14%; height: 120px; text-align: left; padding: 10px; border-bottom: solid 1px #eee; vertical-align: top; border-right: solid 1px #eee; }
-.calendar_week, .calendar_month { padding-bottom: 50px; width: 100%; }
-.calendar_week .today, .calendar_month .today { background-color: #f5f5f5; }
+/* .calendar_week, .calendar_month { padding-bottom: 50px; width: 100%; } */
+/* .calendar_week .today, .calendar_month .today { background-color: #f5f5f5; } */
 .calendar_week .offmonth, .calendar_month .offmonth { color: #ccc; }
-.month_label { font-size: 120%; padding: 20px; margin-left: 10px; color: #999; }
+/* .month_label { font-size: 120%; padding: 20px; margin-left: 10px; color: #999; } */
 .calendar_week td { width: 14%; height: 600px; text-align: left; padding: 10px; border-bottom: solid 1px #eee; vertical-align: top; border-right: solid 1px #eee; }
 .calendar .event_form { margin-top: 20px; width: 20%; }
 .calendar .event_form td { padding-top: 5px; }
-.cal_label { text-align: left; padding-right: 20px; }
-.event_submit { padding-top: 15px !important; }
-.cal_event { position: relative; margin-top: 5px; color: #666; }
+/* .cal_label { text-align: left; padding-right: 20px; } */
+/* .event_submit { padding-top: 15px !important; } */
+/* .cal_event { position: relative; margin-top: 5px; color: #666; } */
 .event_details { cursor: pointer; z-index: 100; display: none; position: absolute; width: 300px; border: solid 1px #ddd; background-color: #fff; padding: 10px; }
 .event_details td { padding: 5px; border: none;  height: auto; }
 .cal_title { cursor: pointer; }
-.event_title { border-bottom: solid 1px #eee; font-size: 120%; margin-bottom: 10px; }
-.event_detail { padding: 10px; padding-bottom: 15px; }
-.event_repeat { font-size: 90%; font-style: italic; text-align: right; }
-.event_date { float: right; }
-.event_delete { float: left; font-size: 90%; }
+/* .event_title { border-bottom: solid 1px #eee; font-size: 120%; margin-bottom: 10px; } */
+/* .event_detail { padding: 10px; padding-bottom: 15px; } */
+/* .event_repeat { font-size: 90%; font-style: italic; text-align: right; } */
 .add_vcal { padding-right: 35px; float: right; margin-top: 10px; }
diff --git a/modules/contacts/modules.php b/modules/contacts/modules.php
index d85fefadc7..ab0d6db1ae 100644
--- a/modules/contacts/modules.php
+++ b/modules/contacts/modules.php
@@ -158,7 +158,7 @@ protected function output() {
         }
         $per_page = 25;
         $current_page = $this->get('contact_page', 1);
-        $res = '<table class="contact_list">';
+        $res = '<div class="px-4"><table class="contact_list table">';
         $res .= '<tr><td colspan="7" class="contact_list_title"><div class="server_title">'.$this->trans('Contacts').'</div></td></tr>';
         $contacts = $this->get('contact_store');
         $editable = $this->get('contact_edit', array());
@@ -180,7 +180,7 @@ protected function output() {
                     '<td><div class="contact_fld">'.$this->html_safe($contact->value('email_address')).'</div></td>'.
                     '<td class="contact_fld"><a href="tel:'.$this->html_safe($contact->value('phone_number')).'">'.
                     $this->html_safe($contact->value('phone_number')).'</a></td>'.
-                    '<td class="contact_controls">';
+                    '<td class="text-end">';
                 if (in_array($contact->value('type').':'.$contact->value('source'), $editable, true)) {
                     $res .= '<a data-id="'.$this->html_safe($id).'" data-type="'.$this->html_safe($contact->value('type')).'" data-source="'.$this->html_safe($contact->value('source')).
                         '" class="delete_contact" title="'.$this->trans('Delete').'"><img alt="'.$this->trans('Delete').
@@ -197,7 +197,7 @@ protected function output() {
                     Hm_Image_Sources::$doc.'" /></a>';
 
                 $res .= '</td></tr>';
-                $res .= '<tr><th></th><td id="contact_'.$this->html_safe($id).'_detail" class="contact_detail_row" colspan="6">';
+                $res .= '<tr><td id="contact_'.$this->html_safe($id).'_detail" class="contact_detail_row" colspan="6">';
                 $res .= build_contact_detail($this, $contact, $id).'</td>';
                 $res .= '</td></tr>';
             }
@@ -210,7 +210,7 @@ protected function output() {
             }
             $res .= '</td></tr>';
         }
-        $res .= '</table>';
+        $res .= '</table></div>';
         return $res;
     }
 }
diff --git a/modules/contacts/site.css b/modules/contacts/site.css
index 40165adbc4..a8aedbea25 100644
--- a/modules/contacts/site.css
+++ b/modules/contacts/site.css
@@ -1,11 +1,11 @@
-.add_contact_form input { margin: 5px; margin-left: 0px; }
-.add_contact_form { padding-top: 10px; display: block; }
-.contact_list { margin-left: 35px; margin-right: 10px; margin-top: 20px; width: 50%; }
-.contact_list td { white-space: nowrap; padding-right: 20px; padding-bottom: 5px; vertical-align: -5px; padding-top: 5px; border-bottom: solid 1px #ddd; }
+/* .add_contact_form input { margin: 5px; margin-left: 0px; background-color: aqua; } */
+/* .add_contact_form { padding-top: 10px; display: block; } */
+/* .contact_list { margin-left: 35px; margin-right: 10px; margin-top: 20px; width: 50%; } */
+/* .contact_list td { white-space: nowrap; padding-right: 20px; padding-bottom: 5px; vertical-align: -5px; padding-top: 5px; border-bottom: solid 1px #ddd; } */
 .gmail_contacts { margin-top: 50px; }
-.contact_list_title { padding-top: 0px !important; padding-bottom: 10px; }
+/* .contact_list_title { padding-top: 0px !important; padding-bottom: 10px; } */
 .show_contact img, .edit_contact img, .send_to_contact img, .delete_contact img { opacity: .5; margin-left: 10px; cursor: pointer; }
-.contact_controls { text-align: right; }
+/* .contact_controls { text-align: right; } */
 .add_contact_row { position: absolute; top: 22px; right: 10px; font-size: 90%; z-index: 100}
 .add_contact_row img { opacity: .4; margin-right: 10px; }
 .add_contact_controls { display: none; }
@@ -15,8 +15,8 @@
 .contact_pages { text-align: center; border-bottom: none !important; }
 .no_contact_sources { text-align: center; color: #999; font-size: 110%; margin-top: 60px; }
 .add_contact { margin-bottom: 30px; margin-top: 10px; color: #666; margin-right: 25px; float: left; clear: left; margin-left: 25px; width: 300px; }
-.add_contact input, .add_contact select { margin-bottom: 10px; padding: 5px; margin-right: 5px; }
-.add_contact .server_title { cursor: pointer; }
+/* .add_contact input, .add_contact select { margin-bottom: 10px; padding: 5px; margin-right: 5px; } */
+/* .add_contact .server_title { cursor: pointer; } */
 .contact_form { margin-top: 10px; display: none; }
 .add_contact .menu_caret { opacity: .7; }
 .contact_update_form { margin-top: 10px; }
diff --git a/modules/core/output_modules.php b/modules/core/output_modules.php
index 5a7612e2f2..9c79ba9cd4 100644
--- a/modules/core/output_modules.php
+++ b/modules/core/output_modules.php
@@ -249,8 +249,10 @@ class Hm_Output_login extends Hm_Output_Module {
     protected function output() {
         $stay_logged_in = '';
         if ($this->get('allow_long_session')) {
-            $stay_logged_in = '<div class="long_session"><input type="checkbox" id="stay_logged_in" value="1" name="stay_logged_in" />'.
-            ' <label for="stay_logged_in">'.$this->trans('Stay logged in').'</label></div>';
+            $stay_logged_in = '<div class="form-check form-switch long-session">
+                <input type="checkbox" id="stay_logged_in" value="1" name="stay_logged_in" class="form-check-input">
+                <label class="form-check-label" for="stay_logged_in">'.$this->trans('Stay logged in').'</label>
+            </div>';
         }
         if (!$this->get('router_login_state')) {
             $fancy_login =  $this->get('fancy_login_allowed');
@@ -281,18 +283,30 @@ protected function output() {
             if (!$single && count($settings) > 0) {
                 $changed = 1;
             }
-            return '<input type="hidden" id="unsaved_changes" value="'.$changed.'" />'.
-                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<div class="confirm_logout"><div class="confirm_text">'.
-                $this->trans('Unsaved changes will be lost! Re-enter your password to save and exit.').' &nbsp;'.
-                '<a href="?page=save">'.$this->trans('More info').'</a></div>'.
-                '<input type="text" value="'.$this->html_safe($this->get('username', 'cypht_user')).'" autocomplete="username" style="display: none;"/>'.
-                '<label class="screen_reader" for="logout_password">'.$this->trans('Password').'</label>'.
-                '<input id="logout_password" autocomplete="current-password" name="password" class="save_settings_password" type="password" placeholder="'.$this->trans('Password').'" />'.
-                '<input class="save_settings" type="submit" name="save_and_logout" value="'.$this->trans('Save and Logout').'" />'.
-                '<input class="save_settings" id="logout_without_saving" type="submit" name="logout" value="'.$this->trans('Just Logout').'" />'.
-                '<input class="cancel_logout save_settings" type="button" value="'.$this->trans('Cancel').'" />'.
-                '</div>';
+           
+        return '<div class="modal fade" id="confirmLogoutModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="confirmLogoutModalLabel" aria-hidden="true">
+                <div class="modal-dialog">
+                <div class="modal-content">
+                    <div class="modal-header">
+                    <h5 class="modal-title" id="confirmLogoutModalLabel">'.$this->trans('Do you want to log out?').'</h5>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                    </div>
+                    <div class="modal-body">
+                        <p class="text-wrap">'.$this->trans('Unsaved changes will be lost! Re-enter your password to save and exit.').' <a href="?page=save">'.$this->trans('More info').'</a></p>
+                        <input type="text" value="'.$this->html_safe($this->get('username', 'cypht_user')).'" autocomplete="username" style="display: none;"/>
+                        <div class="my-3 form-floating">
+                            <input id="logout_password" autocomplete="current-password" name="password" class="form-control" type="password" placeholder="'.$this->trans('Password').'">
+                            <label for="logout_password" class="form-label screen-reader">'.$this->trans('Password').'</label>
+                        </div>
+                    </div>
+                    <div class="modal-footer">
+                        <input class="cancel_logout save_settings btn btn-secondary" data-bs-dismiss="modal" type="button" value="'.$this->trans('Cancel').'" />
+                        <input class="save_settings btn btn-primary" id="logout_without_saving" type="submit" name="logout" value="'.$this->trans('Just Logout').'" />
+                        <input class="save_settings btn btn-success" type="submit" name="save_and_logout" value="'.$this->trans('Save and Logout').'" />
+                    </div>
+                </div>
+                </div>
+            </div>';
         }
     }
 }
@@ -392,7 +406,10 @@ protected function output() {
             '<meta name="apple-mobile-web-app-capable" content="yes" />'.
             '<meta name="mobile-web-app-capable" content="yes" />'.
             '<meta name="apple-mobile-web-app-status-bar-style" content="black" />'.
-            '<meta name="theme-color" content="#888888" /><meta charset="utf-8" />';
+            '<meta name="theme-color" content="#888888" /><meta charset="utf-8" />'.
+            '<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />';
+            '<link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />';
+            '<script src="vendor/twbs/bootstrap/dist/js/bootstrap.bundle.min.js"></script>';
 
         if ($this->get('router_login_state')) {
             $res .= '<meta name="referrer" content="no-referrer" />';
@@ -494,6 +511,8 @@ class Hm_Output_header_css extends Hm_Output_Module {
      */
     protected function output() {
         $res = '';
+        $res .= '<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />';
+        $res .= '<link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />';
         $mods = $this->get('router_module_list');
         if (DEBUG_MODE) {
             foreach (glob(APP_PATH.'modules/**', GLOB_ONLYDIR | GLOB_MARK) as $name) {
@@ -530,7 +549,8 @@ class Hm_Output_page_js extends Hm_Output_Module {
     protected function output() {
         if (DEBUG_MODE) {
             $res = '';
-            $js_lib = '<script type="text/javascript" src="third_party/cash.min.js"></script>';
+            $js_lib = '<script type="text/javascript" src="vendor/twbs/bootstrap/dist/js/bootstrap.min.js"></script>';
+            $js_lib .= '<script type="text/javascript" src="third_party/cash.min.js"></script>';
             $js_lib .= '<script type="text/javascript" src="third_party/resumable.min.js"></script>';
             $js_lib .= '<script type="text/javascript" src="third_party/tingle.min.js"></script>';
             $js_lib .= '<script type="text/javascript" src="third_party/ays-beforeunload-shim.js"></script>';
@@ -1588,7 +1608,7 @@ class Hm_Output_content_section_start extends Hm_Output_Module {
      * Opens a main tag for the primary content section
      */
     protected function output() {
-        return '<main class="content_cell"><div class="offline">'.$this->trans('Offline').'</div>';
+        return '<main class="container-fluid content_cell"><div class="offline">'.$this->trans('Offline').'</div><div class="row m-0">';
     }
 }
 
@@ -1601,7 +1621,7 @@ class Hm_Output_content_section_end extends Hm_Output_Module {
      * Closes the main tag opened in Hm_Output_content_section_start
      */
     protected function output() {
-        return '</main>';
+        return '</div></main>';
     }
 }
 
diff --git a/modules/core/site.css b/modules/core/site.css
index 7796aafbfe..f5b6940b8e 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -1,3 +1,8 @@
+.folder_cell { vertical-align: top; height: 100%; max-width: 15%; display: table-cell; padding: 0px; margin: 0px; }
+.content_cell { vertical-align: top; height: 100%;  width: 100%; padding: 0px; margin: 0px; display: table-cell; background-color: #fff; padding-top: 0px; }
+
+
+
 a { text-decoration: none; color: teal; }
 form { display: inline; padding: 0px; margin: 0px; }
 a:hover { color: #000 !important; }
@@ -31,7 +36,7 @@ td { vertical-align: top; }
 .title { font-weight: normal; padding: 0px; margin: 0px; margin-left: 20px; margin-bottom: 20px; letter-spacing: -1px; color: #999; }
 .date { display: none; position: absolute; top: 15px; right: 20px; color: #888; padding-right: 0px; padding-top: 6px;}
 .mailbox_list_title { display: inline; }
-.sys_messages { position: fixed; right: 20px; top: 15px; min-height: 30px; cursor: pointer; display: none; background-color: #fff; color: teal; margin-top: 0px; padding: 15px; padding-bottom: 5px; white-space: nowrap; border: solid 1px #999; border-radius: 5px; filter: drop-shadow(4px 4px 4px #ccc); z-index: 101; }
+.sys_messages { position: fixed; right: 20px; top: 15px; min-height: 30px; min-width: 300px; cursor: pointer; display: none; margin-top: 0px; padding: 15px; padding-bottom: 5px; white-space: nowrap; border: solid 1px #999; border-radius: 5px; filter: drop-shadow(4px 4px 4px #ccc); z-index: 101; }
 .logged_out { display: block !important; }
 #theme_setting, #timezone_setting { max-width: 200px; }
 .s_pre { color: #666}
@@ -50,10 +55,10 @@ td { vertical-align: top; }
 .server_content, .profile_content, .user_settings { display: table; table-layout: fixed; width: 100%; min-height: 500px; background: #fff; height: 100%; margin-right: 20px; padding-bottom: 40px; }
 .user_settings table { table-layout: fixed; width: 100%; }
 .user_settings table td { height: 34px; vertical-align: middle; padding: 5px; padding-left: 37px; padding-top: 10px; color: #666; }
-.settings_table .save_settings { cursor: pointer; color: #666; font-size: 125%; padding: 10px !important; float: left !important; }
+/* .settings_table .save_settings { cursor: pointer; color: #666; font-size: 125%; padding: 10px !important; float: left !important; } */
 .reset_factory_button { cursor: pointer; color: #666; font-size: 100%; padding: 10px !important; float: right !important; margin-right: 20px;}
 .disabled_link { color: #bbb; }
-.save_settings_password { float: left; margin-left: 0px; padding: 4px; }
+/* .save_settings_password { float: left; margin-left: 0px; padding: 4px; } */
 .disabled_input, input:disabled { color: #aaa !important; background-color: #ddd; }
 input, option, select, button { font-size: 100%; padding: 3px; }
 textarea, select, input, button { border: solid 1px #ddd; background-color: #fff; color: #333; border-radius: 3px; }
@@ -68,8 +73,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .inner_list { margin-bottom: 10px; } 
 .folders a, .unread_link { color: #555; text-decoration: none; line-height: 1.25em; }
 .folder_list { background-color: #fff; margin-right: 20px; padding-right: 15px; padding-bottom: 40px; min-width: 200px; padding-top: 0px; }
-.folder_cell { vertical-align: top; height: 100%; max-width: 15%; display: table-cell; padding: 0px; margin: 0px; }
-.content_cell { vertical-align: top; height: 100%;  width: 100%; padding: 0px; margin: 0px; display: table-cell; background-color: #fff; padding-top: 0px; }
+
 .folders, .inner_list { list-style-type: none; padding: 0px; margin-left: 10px; padding-right: 0px; }
 .folders li, .inner_list li { padding: 4px; padding-left: 10px; color: #555; padding-bottom: 0px; margin: 2px; white-space: nowrap; }
 .loading_folders { text-align: center; margin: 10px; margin-top: 20px; color: #666; }
@@ -81,9 +85,9 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .no_servers { text-align: center; padding: 50px; margin: auto; padding-bottom: 100px; }
 .selected_menu, .selected_menu a { color: teal !important; line-height: 1.25em;}
 .folder_list .update_message_list{ font-size: 80%; padding-top: 10px; float: right; }
-.src_name { white-space: nowrap; overflow: hidden; max-height: 25px; cursor: pointer; border-left: solid 1px #eee; padding-left: 25px; margin-top: 0px; margin-right: -15px; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; color: #777; padding-top: 10px; font-size: 125%; letter-spacing: -1px; padding-bottom: 10px; }
+.src_name { white-space: nowrap; overflow: hidden; cursor: pointer; border-left: solid 1px #eee; padding-left: 25px; margin-top: 0px; margin-right: -15px; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; color: #777; padding-top: 10px; font-size: 125%; letter-spacing: -1px; padding-bottom: 10px; }
 .main_menu { padding-top: 20px; }
-.content_title { max-height: 25px; margin-top: 0px; color: #777; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; padding-bottom: 10px; padding-top: 20px; letter-spacing: -1px; font-size: 125%; padding-left: 27px;}
+.content_title { margin-top: 0px; color: #777; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; padding-bottom: 10px; padding-top: 20px; letter-spacing: -1px; font-size: 125%; padding-left: 27px;}
 .header_subject .content_title { color: #555; }
 .header_subject th { white-space: normal !important; }
 .end_float { clear: both; }
@@ -94,7 +98,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .checkbox_cell input[type="checkbox"] { display: none; }
 .checkbox_cell input[type="checkbox"]:checked + label { background-color: #aaa; }
 .confirm_logout { display: none; background-color: #eee; padding: 20px; position: absolute; left: 0px; top: 0px; border: solid 1px #ede8e6; z-index: 100; }
-.confirm_text {  padding-left: 10px; padding-bottom: 10px; }
+/* .confirm_text {  padding-left: 10px; padding-bottom: 10px; } */
 .folder_list .update_unread { float: right; margin-top: 20px; }
 .page_links a { text-decoration: none; color: #111; }
 .page_links a img { opacity: .6; width: 16px; height: 16px; vertical-align: -2px; }
@@ -133,7 +137,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .limit { width: 50px; margin-left: 20px; }
 .settings_subtitle { font-size: 115%; color: #777 !important; letter-spacing: -1px; padding-bottom: 6px !important; padding-left: 30px !important; height: 25px !important; padding-top: 15px !important; }
 .server_section img, .settings_subtitle img { opacity: .4; padding-right: 10px; vertical-align: -1px; }
-.settings_subtitle, .server_section { cursor: pointer; max-height: 25px; margin-top: 0px; color: #777; padding-bottom: 10px; padding-top: 15px; letter-spacing: -1px; font-size: 115%; padding-left: 30px; border-bottom: solid 1px #ede8e6; }
+.settings_subtitle, .server_section { cursor: pointer; max-height: 50px; margin-top: 0px; color: #777; padding-bottom: 10px; padding-top: 15px; letter-spacing: -1px; font-size: 115%; padding-left: 30px; border-bottom: solid 1px #ede8e6; }
 .list_meta { float: right; margin-right: 20px; letter-spacing: 0px; display: inline; color: #666 !important; font-size: 70% !important; margin-top: 2px; font-style: normal; margin-left: 20px; }
 .list_meta b { color: #333 !important; font-weight: normal; padding-left: 5px; padding-right: 5px; vertical-align: 1px; }
 .noscript { position: absolute; z-index: 100; right: 0px; left: 0px; top: 0px; bottom: 0px; background-color: #ede8e6; opacity: 1; padding-top: 100px; text-align: center; }
@@ -209,8 +213,8 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .mobile { font-size: 90%; min-width: 100%; background: none; }
 .mobile .sys_messages { z-index: 1002; }
 .mobile .account_icon { width: 24px; height: 24px; padding-bottom: 4px; }
-.mobile .save_settings { margin-left: 0px !important; }
-.mobile .save_settings_password { margin-right: 10px; }
+/* .mobile .save_settings { margin-left: 0px !important; } */
+/* .mobile .save_settings_password { margin-right: 10px; } */
 .mobile .list_meta { display: block; }
 .mobile .checkbox_cell { padding-right: 0px !important; padding-left: 3px !important; }
 .mobile .mailbox_list_title { font-size: 95%; }
diff --git a/modules/core/site.js b/modules/core/site.js
index 49a667a459..7734ee0b4d 100644
--- a/modules/core/site.js
+++ b/modules/core/site.js
@@ -1265,7 +1265,7 @@ var Hm_Folders = {
             return false;
         });
         $('.hide_folders').on("click", function() { return Hm_Folders.hide_folder_list(); });
-        $('.logout_link').on("click", function() { return Hm_Utils.confirm_logout(); });
+        $('.logout_link').on("click", function(e) { return Hm_Utils.confirm_logout(); });
         if (hm_search_terms()) {
             $('.search_terms').val(hm_search_terms());
         }
@@ -1387,6 +1387,8 @@ var Hm_Utils = {
             document.getElementById('logout_without_saving').click();
         }
         else {
+            var confirmLogoutModal = new bootstrap.Modal(document.getElementById('confirmLogoutModal'), {keyboard: true})
+            confirmLogoutModal.show();
             $('.confirm_logout').show();
         }
         return false;
diff --git a/modules/feeds/modules.php b/modules/feeds/modules.php
index 7b8cc675b9..4d9aafe0a5 100644
--- a/modules/feeds/modules.php
+++ b/modules/feeds/modules.php
@@ -539,10 +539,10 @@ protected function output() {
                 '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
                 '<div class="subtitle">'.$this->trans('Add an RSS/ATOM Feed').'</div><table>'.
                 '<tr><td><label class="screen_reader" for="new_feed_name">'.$this->trans('Feed name').'</label>'.
-                '<input required type="text" id="new_feed_name" name="new_feed_name" class="txt_fld" value="" placeholder="'.$this->trans('Feed name').'" /></td></tr>'.
+                '<input required type="text" id="new_feed_name" name="new_feed_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Feed name').'" /></td></tr>'.
                 '<tr><td><label for="new_feed_address" class="screen_reader">'.$this->trans('Site address or feed URL').'</label>'.
-                '<input required type="url" id="new_feed_address" name="new_feed_address" class="txt_fld" placeholder="'.$this->trans('Site address or feed URL').'" value="" /></td></tr>'.
-                '<tr><td><input type="submit" value="'.$this->trans('Add').'" name="submit_feed" /></td></tr>'.
+                '<input required type="url" id="new_feed_address" name="new_feed_address" class="txt_fld form-control" placeholder="'.$this->trans('Site address or feed URL').'" value="" /></td></tr>'.
+                '<tr><td><input type="submit" class="btn btn-primary" value="'.$this->trans('Add').'" name="submit_feed" /></td></tr>'.
                 '</table></form>';
         }
     }
diff --git a/modules/feeds/site.css b/modules/feeds/site.css
index f245229b33..7f62a02333 100644
--- a/modules/feeds/site.css
+++ b/modules/feeds/site.css
@@ -1,6 +1,6 @@
-.feeds_section { display: none; }
-.feed_server_setup .content_title { cursor: pointer; }
-.feeds_setting { display: none; }
+/* .feeds_section { display: none; } */
+/* .feed_server_setup .content_title { cursor: pointer; } */
+/* .feeds_setting { display: none; } */
 .feeds_section .configured_server, .feeds_section .add_server { height: 140px; }
 .feeds_section .add_server { margin-right: 0px; }
 .feeds .source a { color: #666; }
diff --git a/modules/imap/output_modules.php b/modules/imap/output_modules.php
index 476bb83e8b..5d69d1453a 100644
--- a/modules/imap/output_modules.php
+++ b/modules/imap/output_modules.php
@@ -543,18 +543,18 @@ protected function output() {
             '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
             '<div class="subtitle">'.$this->trans('Add an IMAP Server').'</div><table>'.
             '<tr><td colspan="2"><label class="screen_reader" for="new_imap_name">'.$this->trans('Account name').'</label>'.
-            '<input id="new_imap_name" required type="text" name="new_imap_name" class="txt_fld" value="" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
+            '<input id="new_imap_name" required type="text" name="new_imap_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
             '<tr><td colspan="2"><label class="screen_reader" for="new_imap_address">'.$this->trans('Server address').'</label>'.
-            '<input required type="text" id="new_imap_address" name="new_imap_address" class="txt_fld" placeholder="'.$this->trans('IMAP server address').'" value=""/></td></tr>'.
+            '<input required type="text" id="new_imap_address" name="new_imap_address" class="txt_fld form-control" placeholder="'.$this->trans('IMAP server address').'" value=""/></td></tr>'.
             '<tr><td colspan="2"><label class="screen_reader" for="new_imap_port">'.$this->trans('IMAP port').'</label>'.
-            '<input required type="number" id="new_imap_port" name="new_imap_port" class="txt_fld" value="993" placeholder="'.$this->trans('Port').'"></td></tr>'.
+            '<input required type="number" id="new_imap_port" name="new_imap_port" class="txt_fld form-control" value="993" placeholder="'.$this->trans('Port').'"></td></tr>'.
              $sieve_extra.
-            '<tr><td colspan="2"><input type="checkbox" id="new_imap_hidden" name="new_imap_hidden" class="" value="1">'.
-            '<label for="new_imap_hidden">'.$this->trans('Hide From Combined Pages').'</label></td></tr>'.
+            '<tr><td colspan="2"><input type="checkbox" id="new_imap_hidden" name="new_imap_hidden" class="form-check-input" value="1">'.
+            '<label for="new_imap_hidden" class="form-check-label">'.$this->trans('Hide From Combined Pages').'</label></td></tr>'.
              $sieve_extra2.
-            '<tr><td><input type="radio" name="tls" value="1" id="imap_tls" checked="checked" /> <label for="imap_tls">'.$this->trans('Use TLS').'</label>'.
-            '<br /><input type="radio" name="tls" value="0" id="imap_notls" /><label for="imap_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
-            '</tr><tr><td><input type="submit" value="'.$this->trans('Add').'" name="submit_imap_server" /></td></tr>'.
+            '<tr><td><input type="radio" class="form-check-input" name="tls" value="1" id="imap_tls" checked="checked" /> <label class="form-check-label" for="imap_tls">'.$this->trans('Use TLS').'</label>'.
+            '<br /><input type="radio" class="form-check-input" name="tls" value="0" id="imap_notls" /><label class="form-check-label" for="imap_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
+            '</tr><tr><td><input class="btn btn-primary btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_imap_server" /></td></tr>'.
             '</table></form>';
     }
 }
diff --git a/modules/imap/site.css b/modules/imap/site.css
index 3d7b8dedcf..f06ff509f0 100644
--- a/modules/imap/site.css
+++ b/modules/imap/site.css
@@ -2,7 +2,7 @@
 .imap_connect { display: inline; }
 .allow_image_link { margin-right: 20px; float: right; margin-top: -10px; margin-bottom: 10px; }
 .imap_debug { border: solid 1px #aaa; float: left; padding: 10px; height: 300px; width: 300px; overflow: scroll; white-space: pre; margin-top: 50px; font-size: 75%; }
-.save_settings, .server_link { line-height: 10pt; margin: 2px; margin-left: 5px; display: block; padding: 5px; border: solid 1px #ddd; background-color: #fff; float: right; clear: none; color: #333; text-decoration: none; border-radius: 3px; }
+.server_link { line-height: 10pt; margin: 2px; margin-left: 5px; display: block; padding: 5px; border: solid 1px #ddd; background-color: #fff; float: right; clear: none; color: #333; text-decoration: none; border-radius: 3px; }
 .hl { padding-right: 5px; color: #666; }
 .dl { color: #888; }
 .empty_list { text-align: center; color: #ccc; font-size: 2em; font-style: italic; padding: 30px; padding-bottom: 100px; }
diff --git a/modules/local_contacts/modules.php b/modules/local_contacts/modules.php
index 807d22f9c7..00c0b1e3c0 100644
--- a/modules/local_contacts/modules.php
+++ b/modules/local_contacts/modules.php
@@ -137,7 +137,7 @@ protected function output() {
         $name = '';
         $phone = '';
         $form_class = 'contact_form';
-        $button = '<input class="add_contact_submit" type="submit" name="add_contact" value="'.$this->trans('Add').'" />';
+        $button = '<input class="btn btn-success add_contact_submit" type="submit" name="add_contact" value="'.$this->trans('Add').'" />';
         $title = $this->trans('Add Local');
         $current = $this->get('current_contact', array());
         if (!empty($current)) {
@@ -153,23 +153,23 @@ protected function output() {
             $form_class = 'contact_update_form';
             $title = $this->trans('Update Local');
             $button = '<input type="hidden" name="contact_id" value="'.$this->html_safe($current['id']).'" />'.
-                '<input class="edit_contact_submit" type="submit" name="edit_contact" value="'.$this->trans('Update').'" />';
+                '<input class="btn btn-success edit_contact_submit" type="submit" name="edit_contact" value="'.$this->trans('Update').'" />';
         }
-        return '<div class="add_contact"><form class="add_contact_form" method="POST">'.
-            '<div class="server_title">'.$title.
+        return '<div class="add_contact"><form class="" method="POST">'.
+            '<div class="server_title mt-2 btn btn-light"><i class="bi bi-person-add me-2"></i>'.$title.
             '<img alt="" class="menu_caret" src="'.Hm_Image_Sources::$chevron.'" width="8" height="8" /></div>'.
             '<div class="'.$form_class.'">'.
             '<input type="hidden" name="contact_source" value="local" />'.
             '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<label class="screen_reader" for="contact_email">'.$this->trans('E-mail Address').'</label>'.
-            '<input required placeholder="'.$this->trans('E-mail Address').'" id="contact_email" type="email" name="contact_email" '.
-            'value="'.$this->html_safe($email).'" /> *<br />'.
-            '<label class="screen_reader" for="contact_name">'.$this->trans('Full Name').'</label>'.
-            '<input required placeholder="'.$this->trans('Full Name').'" id="contact_name" type="text" name="contact_name" '.
-            'value="'.$this->html_safe($name).'" /> *<br />'.
-            '<label class="screen_reader" for="contact_phone">'.$this->trans('Telephone Number').'</label>'.
-            '<input placeholder="'.$this->trans('Telephone Number').'" id="contact_phone" type="text" name="contact_phone" '.
-            'value="'.$this->html_safe($phone).'" /><br />'.$button.' <input type="button" class="reset_contact" value="'.
+            '<label class="form-label" for="contact_email">'.$this->trans('E-mail Address').' *</label>'.
+            '<input class="form-control" required placeholder="'.$this->trans('E-mail Address').'" id="contact_email" type="email" name="contact_email" '.
+            'value="'.$this->html_safe($email).'" /><br />'.
+            '<label class="form-label" for="contact_name">'.$this->trans('Full Name').' *</label>'.
+            '<input class="form-control" required placeholder="'.$this->trans('Full Name').'" id="contact_name" type="text" name="contact_name" '.
+            'value="'.$this->html_safe($name).'" /><br />'.
+            '<label class="form-label" for="contact_phone">'.$this->trans('Telephone Number').'</label>'.
+            '<input class="form-control" placeholder="'.$this->trans('Telephone Number').'" id="contact_phone" type="text" name="contact_phone" '.
+            'value="'.$this->html_safe($phone).'" /><br />'.$button.' <input type="button" class="btn btn-secondary reset_contact" value="'.
             $this->trans('Cancel').'" /></div></form></div>';
     }
 }
diff --git a/modules/nux/modules.php b/modules/nux/modules.php
index 5a0cd81325..8d720d3f7d 100644
--- a/modules/nux/modules.php
+++ b/modules/nux/modules.php
@@ -280,11 +280,11 @@ protected function output() {
             '<br /><br /><label class="screen_reader" for="service_select">'.$this->trans('Select an E-mail provider').'</label>'.
             ' <select id="service_select" name="service_select"><option value="">'.$this->trans('Select an E-mail provider').'</option>'.Nux_Quick_Services::option_list(false, $this).'</select>'.
             '<label class="screen_reader" for="nux_username">'.$this->trans('Username').'</label>'.
-            '<br /><input type="email" id="nux_username" class="nux_username" placeholder="'.$this->trans('Your E-mail address').'" />'.
+            '<input type="email" id="nux_username" class="nux_username form-control mb-3" placeholder="'.$this->trans('Your E-mail address').'" />'.
             '<label class="screen_reader" for="nux_account_name">'.$this->trans('Account name').'</label>'.
-            '<br /><input type="text" id="nux_account_name" class="nux_account_name" placeholder="'.$this->trans('Account Name [optional]').'" />'.
-            '<br /><input type="button" class="nux_next_button" value="'.$this->trans('Next').'" />'.
-            '</div><div class="nux_step_two"></div></div></div>';
+            '<input type="text" id="nux_account_name mb-3" class="nux_account_name form-control mb-3" placeholder="'.$this->trans('Account Name [optional]').'" />'.
+            '<input type="button" class="nux_next_button btn btn-primary btn-sm" value="'.$this->trans('Next').'" />'.
+            '</div><div class="nux_step_two px-4 pt-3"></div></div></div>';
     }
 }
 
@@ -310,7 +310,7 @@ protected function output() {
  */
 class Hm_Output_nux_dev_news extends Hm_Output_Module {
     protected function output() {
-        $res = '<div class="nux_dev_news"><div class="nux_title">'.$this->trans('Development Updates').'</div><table>';
+        $res = '<div class="nux_dev_news col-lg-2 mt-3 col-md-2 col-sm-12"><div class="card"><div class="card-body"><div class="nux_title">'.$this->trans('Development Updates').'</div><table>';
         foreach ($this->get('nux_dev_news', array()) as $vals) {
             $res .= sprintf('<tr><td><a href="https://github.com/cypht-org/cypht/commit/%s" target="_blank" rel="noopener">%s</a>'.
                 '</td><td class="msg_date">%s</td><td>%s</td><td>%s</td></tr>',
@@ -321,7 +321,7 @@ protected function output() {
                 $this->html_safe($vals['note'])
             );
         }
-        $res .= '</table></div>';
+        $res .= '</table></div></div></div>';
         return $res;
     }
 }
@@ -331,9 +331,9 @@ protected function output() {
  */
 class Hm_Output_nux_help extends Hm_Output_Module {
     protected function output() {
-        return '<div class="nux_help"><div class="nux_title">'.$this->trans('Help').'</div>'.
+        return '<div class="nux_help mt-3 col-lg-5 col-md-5 col-sm-12"><div class="card"><div class="card-body"><div class="nux_title">'.$this->trans('Help').'</div>'.
             $this->trans('Cypht is a webmail program. You can use it to access your E-mail accounts from any service that offers IMAP, or SMTP access - which most do.').' '.
-        '</div>';
+        '</div></div></div>';
     }
 }
 
@@ -349,17 +349,17 @@ protected function output() {
         $tz = $this->get('tzone');
         $protos = array('imap', 'smtp', 'feeds', 'profiles');
 
-        $res = '<div class="nux_welcome"><div class="nux_title">'.$this->trans('Welcome to Cypht').'</div>';
-        $res .= '<div class="nux_qa">'.$this->trans('Add a popular E-mail source quickly and easily');
-        $res .= ' <a class="nux_try_out" href="?page=servers#quick_add_section">'.$this->trans('Add an E-mail Account').'</a>';
-        $res .= '</div><ul>';
+        $res = '<div class="nux_welcome mt-3 col-lg-5 col-md-5 col-sm-12"><div class="card"><div class="card-body"><div class="card-title"><h4>'.$this->trans('Welcome to Cypht').'</h4></div>';
+        $res .= '<div class="mb-3"><p>'.$this->trans('Add a popular E-mail source quickly and easily').'</p>';
+        $res .= '<a class="mt-3 btn btn-light" href="?page=servers#quick_add_section">'.$this->trans('Add an E-mail Account').'</a>';
+        $res .= '</div><ul class="mt-4">';
         
         foreach ($protos as $proto) {
             $proto_dsp = $proto;
             if ($proto == 'feeds') {
                 $proto_dsp = 'RSS/ATOM';
             }
-            $res .= '<li class="nux_'.$proto.'">';
+            $res .= '<li class="nux_'.$proto.' mt-3">';
 
             // Check if user have profiles configured
             if ($proto == 'profiles') {
@@ -401,7 +401,7 @@ protected function output() {
         else {
             $res .= sprintf($this->trans('Your timezone is set to %s'), $this->html_safe($tz));
         }
-        $res .= ' <a href="?page=settings#general_setting">'.$this->trans('Update').'</a></div></div>';
+        $res .= ' <a href="?page=settings#general_setting">'.$this->trans('Update').'</a></div></div></div></div>';
         return $res;
     }
 }
diff --git a/modules/nux/site.css b/modules/nux/site.css
index 728ee9fde6..b2e3384d33 100644
--- a/modules/nux/site.css
+++ b/modules/nux/site.css
@@ -1,23 +1,23 @@
-.nux_add_account { table-layout: fixed; width: 100%; display: table; background-color: #fff; }
-.nux_subtitle { font-size: 80%; margin-left: 40px; display: inline; }
-.quick_add_section { padding: 20px; padding-bottom: 40px; display: none; padding-left: 40px; }
-.nux_step_two_title { padding-top: 20px; font-size: 110%; padding-bottom: 10px; }
-.nux_step_one, .nux_step_two { padding-left: 40px; max-width: 600px; }
-.enable_auth2 { float: left; padding: 20px; padding-left: 0px; padding-bottom: 40px; font-size: 110%; }
+/* .nux_add_account { table-layout: fixed; width: 100%; display: table; background-color: #fff; } */
+/* .nux_subtitle { font-size: 80%; margin-left: 40px; display: inline; } */
+/* .quick_add_section { padding: 20px; padding-bottom: 40px; display: none; padding-left: 40px; } */
+/* .nux_step_two_title { padding-top: 20px; font-size: 110%; padding-bottom: 10px; } */
+/* .nux_step_one, .nux_step_two { padding-left: 40px; max-width: 600px; } */
+/* .enable_auth2 { float: left; padding: 20px; padding-left: 0px; padding-bottom: 40px; font-size: 110%; } */
 .nux_password, .app_password { margin: 10px; margin-left: 0px; margin-top: 0px; width: 280px; }
 .reset_nux_form { float: right; padding: 20px; padding-bottom: 40px; font-size: 110%; }
 .nux_submit { margin-bottom: 20px; }
-.nux_account_name, .nux_username, #service_select, .nux_extra_fields { margin-bottom: 10px; width: 280px; padding: 3px; }
+/* .nux_account_name, .nux_username, #service_select, .nux_extra_fields { margin-bottom: 10px; width: 280px; padding: 3px; } */
 #nux_email { margin-bottom: 10px; }
 .nux_help, .nux_dev_news, .nux_welcome { padding: 20px; margin: 20px; margin-right: 0px; float: left; border: solid 1px #eee; }
 .nux_welcome, .nux_help { min-width: 320px; max-width: 480px; min-height: 400px; }
 .nux_qa, .nux_imap, .nux_smtp, .nux_profiles, .nux_feeds { margin-bottom: 10px; }
 .nux_dev_news table td { padding-right: 10px; white-space: nowrap; }
 .nux_welcome ul li a { float: right; padding-left: 10px; padding-right: 10px; }
-.nux_help ul li { margin-bottom: 30px; }
-.nux_help ul { margin-top: 30px; }
-.nux_welcome ul { margin-top: 30px; }
-.nux_try_out { display: block; text-align: center; margin: auto; margin-top: 10px; }
+/* .nux_help ul li { margin-bottom: 30px; } */
+/* .nux_help ul { margin-top: 30px; } */
+/* .nux_welcome ul { margin-top: 30px; } */
+/* .nux_try_out { display: block; text-align: center; margin: auto; margin-top: 10px; } */
 .nux_tz {  margin-top: 30px; }
 .nux_empty_combined_view { display: none; text-align: center; padding-top: 100px; color: #666; }
 
diff --git a/modules/pop3/modules.php b/modules/pop3/modules.php
new file mode 100644
index 0000000000..0969605f84
--- /dev/null
+++ b/modules/pop3/modules.php
@@ -0,0 +1,1129 @@
+<?php
+
+/**
+ * POP3 modules
+ * @package modules
+ * @subpackage pop3
+ */
+
+if (!defined('DEBUG_MODE')) { die(); }
+
+require_once APP_PATH.'modules/pop3/hm-pop3.php';
+
+/**
+ * Setup the list type
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_message_list_type extends Hm_Handler_Module {
+    /**
+     * Build meta information about the message list type
+     */
+    public function process() {
+        if (array_key_exists('list_path', $this->request->get)) {
+            $path = $this->request->get['list_path'];
+            if (preg_match("/^pop3_(\d+)$/", $path, $matches)) {
+                $this->out('list_path', $path, false);
+                $details = Hm_POP3_List::dump($matches[1]);
+                $title = array('POP3', $details['name'], 'INBOX');
+                if ($this->get('list_page', 0)) {
+                    $title[] = sprintf('Page %d', $this->get('list_page', 0));
+                }
+                if (!empty($details)) {
+                    $this->out('list_meta', false);
+                    $this->out('mailbox_list_title', $title);
+					$this->out('custom_list_controls', ' ');
+                }
+            }
+        }
+        if (array_key_exists('page', $this->request->get) && $this->request->get['page'] == 'search') {
+            $this->out('list_path', 'search', false);
+        }
+    }
+}
+
+/**
+ * Check the status of a POP3 connection
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_status extends Hm_Handler_Module {
+    /**
+     * Used in an ajax request on the home page to determine a POP3 server status
+     */
+    public function process() {
+        list($success, $form) = $this->process_form(array('pop3_server_ids'));
+        if ($success) {
+            $ids = explode(',', $form['pop3_server_ids']);
+            foreach ($ids as $id) {
+                $start_time = microtime(true);
+                $pop3 = Hm_POP3_List::connect($id, false);
+                if (pop3_authed($pop3)) {
+                    $this->out('pop3_connect_time', microtime(true) - $start_time);
+                    $this->out('pop3_connect_status', 'Authenticated');
+                    $this->out('pop3_status_server_id', $id);
+                }
+            }
+        }
+    }
+}
+
+/**
+ * Perform a message action on a POP3 message
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_message_action extends Hm_Handler_Module {
+    /**
+     * read or unread a POP3 message
+     * @todo add support for more message actions
+     */
+    public function process() {
+        list($success, $form) = $this->process_form(array('action_type', 'message_ids'));
+        if ($success) {
+            $id_list = explode(',', $form['message_ids']);
+            $server_ids = array();
+            foreach ($id_list as $msg_id) {
+                if (preg_match("/^pop3_(\d)+_(\d)+$/", $msg_id)) {
+                    $parts = explode('_', $msg_id);
+                    $server_ids[] = $parts[1];
+                    switch($form['action_type']) {
+                        case 'unread':
+                            Hm_POP3_Uid_Cache::unread($msg_id);
+                            break;
+                        case 'read':
+                            Hm_POP3_Uid_Cache::read($msg_id);
+                            break;
+                    }
+                }
+            }
+            if (count($server_ids) > 0) {
+                foreach ($server_ids as $id) {
+                    bust_pop3_cache($this->cache, $id);
+                }
+            }
+        }
+    }
+}
+
+/**
+ * Build the data for a POP3 folder page
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_folder_page extends Hm_Handler_Module {
+    /**
+     * Connect to a POP3 server and fetch message headers
+     * @todo see if this can be broken up into smaller functions
+     */
+    public function process() {
+
+        $msgs = array();
+        list($success, $form) = $this->process_form(array('pop3_server_id'));
+        if ($success) {
+            $unread_only = false;
+            $login_time = $this->session->get('login_time', false);
+            if ($login_time) {
+                $this->out('login_time', $login_time);
+            }
+            $page = 1;
+            $terms = false;
+            if (array_key_exists('list_page', $this->request->get)) {
+                $page = $this->request->get['list_page'];
+            }
+            if (array_key_exists('pop3_search', $this->request->post)) {
+                $limit = DEFAULT_PER_SOURCE;
+                $terms = $this->session->get('search_terms', false);
+                if (!$terms) {
+                    return;
+                }
+                $since = $this->session->get('search_since', DEFAULT_SINCE);
+                $fld = $this->session->get('search_fld', 'TEXT');
+                $date = process_since_argument($since);
+                $cutoff_timestamp = strtotime($date);
+            }
+            elseif ($this->get('list_path') == 'unread' || (array_key_exists('pop3_unread_only', $this->request->post) && $this->request->post['pop3_unread_only'])) {
+                $limit = $this->user_config->get('unread_per_source_setting', DEFAULT_PER_SOURCE);
+                $date = process_since_argument($this->user_config->get('unread_since_setting', DEFAULT_SINCE));
+                $unread_only = true;
+                $cutoff_timestamp = strtotime($date);
+                if ($login_time && $login_time > $cutoff_timestamp) {
+                    $cutoff_timestamp = $login_time;
+                }
+            }
+            elseif ($this->get('list_path') == 'email') {
+                $limit = $this->user_config->get('all_email_per_source_setting', DEFAULT_PER_SOURCE);
+                $date = process_since_argument($this->user_config->get('all_email_since_setting', DEFAULT_SINCE));
+                $cutoff_timestamp = strtotime($date);
+            }
+            elseif ($this->get('list_path') == 'combined_inbox') {
+                $limit = $this->user_config->get('all_per_source_setting', DEFAULT_PER_SOURCE);
+                $date = process_since_argument($this->user_config->get('all_since_setting', DEFAULT_SINCE));
+                $cutoff_timestamp = strtotime($date);
+            }
+            else {
+                $limit = DEFAULT_PER_SOURCE;
+                $date = false;
+                $cutoff_timestamp = strtotime($date);
+            }
+            $cache = false;
+            if (!$unread_only) {
+                $cache = Hm_POP3_List::get_cache($this->cache, $form['pop3_server_id']);
+            }
+            if ($cache) {
+                $this->out('pop3_cache_used', true);
+            }
+            $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], $cache);
+            $details = Hm_POP3_List::dump($form['pop3_server_id']);
+            $path = sprintf("pop3_%d", $form['pop3_server_id']);
+            if (pop3_authed($pop3)) {
+                $this->out('pop3_mailbox_page_path', $path);
+                $list = array_reverse(array_unique(array_keys($pop3->mlist())));
+                $total = count($list);
+                $list = array_slice($list, (($page - 1) * $limit), $limit);
+                foreach ($list as $id) {
+                    $msg_headers = $pop3->msg_headers($id);
+                    if (!empty($msg_headers)) {
+                        if ($date && isset($msg_headers['date'])) {
+                            if (!Hm_POP3_Uid_Cache::is_unread(sprintf('pop3_%d_%d', $form['pop3_server_id'], $id)) && strtotime($msg_headers['date']) < $cutoff_timestamp) {
+                                continue;
+                            }
+                        }
+                        if ($unread_only && Hm_POP3_Uid_Cache::is_read(sprintf('pop3_%d_%d', $form['pop3_server_id'], $id))) {
+                            continue;
+                        }
+                        if ($terms) {
+                            $body = implode('', $pop3->retr_full($id));
+                            if (!search_pop3_msg($body, $msg_headers, $terms, $fld)) {
+                                continue;
+                            }
+                        }
+                        $msg_headers['server_name'] = $details['name'];
+                        $msg_headers['server_id'] = $form['pop3_server_id'];
+                        $msgs[$id] = $msg_headers;
+                    }
+                }
+                $this->out('pop3_mailbox_page', $msgs);
+                $this->out('pop3_server_id', $form['pop3_server_id']);
+                $this->out('list_page', $page);
+                if (!$date) {
+                    $this->out('page_links', build_page_links($limit, $page, $total, $path));
+                }
+            }
+        }
+    }
+}
+
+/**
+ * Fetch a message from a POP3 server
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_message_content extends Hm_Handler_Module {
+    /**
+     * Connect to a POP3 server and download a message
+     */
+    public function process() {
+
+        list($success, $form) = $this->process_form(array('pop3_uid', 'pop3_list_path'));
+        if ($success) {
+            $id = (int) substr($form['pop3_list_path'], 5);
+            $cache = Hm_POP3_List::get_cache($this->cache, $id);
+            $pop3 = Hm_POP3_List::connect($id, $cache);
+            $details = Hm_POP3_List::dump($id);
+            if (pop3_authed($pop3)) {
+                $msg_lines = $pop3->retr_full($form['pop3_uid']);
+                $header_list = array();
+                $body = array();
+                $headers = true;
+                $last_header = false;
+
+                $bodies = array();
+                $has_multipart = false;
+                $boundary = '';
+                $boundaries = array();
+                $multipart_headers = false;
+                $multipart_header_list = array();
+
+                foreach ($msg_lines as $line) {
+                    if ($headers) {
+                        if (substr($line, 0, 1) == "\t"
+                            || substr($line, 0, 1) == " ") {
+                            $header_list[$last_header] .= decode_fld($line);
+                        }
+                        elseif (strstr($line, ':')) {
+                            $parts = explode(':', $line, 2);
+                            if (count($parts) == 2) {
+                                $header_list[$parts[0]] = decode_fld($parts[1]);
+                                $last_header = $parts[0];
+                            }
+                        }
+                        if (array_key_exists('Content-Type', $header_list)
+                            && strstr($header_list['Content-Type'], 'multipart')
+                            && $boundary = strstr($header_list['Content-Type'], 'boundary=')) {
+                            $has_multipart = true;
+                            $boundary = str_replace('boundary=', '', $boundary);
+                            $boundary = str_replace('"', '', $boundary);
+                            if (array_search($boundary, $boundaries) === false) {
+                                $boundaries[] = $boundary;
+                            }
+                        }
+                    }
+                    elseif ($multipart_headers) {
+                        if (substr($line, 0, 1) == "\t"
+                            || substr($line, 0, 1) == " ") {
+                            $multipart_header_list[$last_header] .= decode_fld($line);
+                        }
+                        elseif (strstr($line, ':')) {
+                            $parts = explode(':', $line, 2);
+                            if (count($parts) == 2) {
+                                $multipart_header_list[$parts[0]] = decode_fld($parts[1]);
+                                $last_header = $parts[0];
+                            }
+                        }
+                        if (array_key_exists('Content-Type', $multipart_header_list)
+                            && strstr($multipart_header_list['Content-Type'], 'multipart')
+                            && $boundary = strstr($multipart_header_list['Content-Type'], 'boundary=')) {
+                            $has_multipart = true;
+                            $boundary = str_replace('boundary=', '', $boundary);
+                            $boundary = str_replace('"', '', $boundary);
+                            if (array_search($boundary, $boundaries) === false) {
+                                $boundaries[] = $boundary;
+                            }
+                        }
+                    }
+                    else {
+                        $boundary = '####unmatch-boundary';
+                        foreach ($boundaries as $_boundary) {
+                            if (strstr($line, $_boundary)) {
+                                $boundary = $_boundary;
+                                break;
+                            }
+                        }
+                        if ($has_multipart === true && strstr($line, $boundary)) {
+                            if (array_key_exists('Content-Type', $multipart_header_list)
+                                && strstr($multipart_header_list['Content-Type'], 'html')) {
+                                $body['content-type'] = 'html';
+                            }
+                            else {
+                                $body['content-type'] = 'text';
+                            }
+                            if (array_key_exists('Content-Transfer-Encoding', $multipart_header_list)
+                                && strstr($multipart_header_list['Content-Transfer-Encoding'], 'base64')) {
+                                $body['text'] = base64_decode(str_replace(array("\r", "\n"), '', $body['text']));
+                            }
+                            if (array_key_exists('Content-Type', $multipart_header_list)
+                                && $charset = strstr($multipart_header_list['Content-Type'], 'charset=')) {
+                                $charset = str_replace('charset=', '', $charset);
+                                $body['text'] = mb_convert_encoding($body['text'], 'UTF-8', $charset);
+                            }
+                            if (array_key_exists('text', $body)) {
+                                $bodies[] = $body;
+                            }
+                            $body = array('text' => '');
+                            
+                            $multipart_headers = true;
+                            $multipart_header_list = array();
+                        }
+                        else {
+                            if (array_key_exists('text', $body)) {
+                                $body['text'] .= $line;
+                            }
+                            else {
+                                $body['text'] = $line;
+                            }
+                        }
+                    }
+
+                    if (!trim($line)) {
+                        $headers = false;
+                        if ($multipart_headers === true) {
+                            $multipart_headers = false;
+                        }
+                    }
+                }
+                $this->out('pop3_message_headers', $header_list);
+
+                if ($has_multipart === false) {
+                    if (array_key_exists('Content-Type', $header_list)
+                        && strstr($header_list['Content-Type'], 'html')) {
+                        $body['content-type'] = 'html';
+                    }
+                    if (array_key_exists('Content-Transfer-Encoding', $header_list)
+                        && strstr($header_list['Content-Transfer-Encoding'], 'base64')) {
+                        $body['text'] = base64_decode(str_replace(array("\r", "\n"), '', $body['text']));
+                    }
+                    if (array_key_exists('Content-Type', $header_list)
+                        && $charset = strstr($header_list['Content-Type'], 'charset=')) {
+                        $charset = trim(str_replace('charset=', '', $charset));
+                        if (strtolower($charset) != 'utf-8') {
+                            $body['text'] = mb_convert_encoding($body['text'], 'UTF-8', $charset);
+                        }
+                    }
+                    $bodies[] = $body;
+                }
+
+                $this->out('pop3_message_body', $bodies);
+                $this->out('pop3_mailbox_page_path', $form['pop3_list_path']);
+                $this->out('pop3_server_id', $id);
+                bust_pop3_cache($this->cache, $id);
+                Hm_POP3_Uid_Cache::read(sprintf("pop3_%s_%s", $id, $form['pop3_uid']));
+            }
+        }
+    }
+}
+
+/**
+ * Save a POP3 server on the servers page
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_save extends Hm_Handler_Module {
+    /**
+     * Authenticate and save a POP3 server on the settings page
+     */
+    public function process() {
+        $just_saved_credentials = false;
+        if (isset($this->request->post['pop3_save'])) {
+            list($success, $form) = $this->process_form(array('pop3_user', 'pop3_pass', 'pop3_server_id'));
+            if (!$success) {
+                Hm_Msgs::add('ERRUsername and Password are required to save a connection');
+                return;
+            }
+            if (in_server_list('Hm_POP3_List', $form['pop3_server_id'], $form['pop3_user'])) {
+                Hm_Msgs::add('ERRThis server and username are already configured');
+                return;
+            }
+            $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], false, $form['pop3_user'], $form['pop3_pass'], true);
+            if (pop3_authed($pop3)) {
+                $just_saved_credentials = true;
+                Hm_Msgs::add("Server saved");
+                $this->session->record_unsaved('POP3 server saved');
+            }
+            else {
+                Hm_POP3_List::forget_credentials($form['pop3_server_id']);
+                Hm_Msgs::add("ERRUnable to save this server, are the username and password correct?");
+            }
+        }
+        $this->out('just_saved_credentials', $just_saved_credentials);
+    }
+}
+
+/**
+ * Forget the username and password for a POP3 server
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_forget extends Hm_Handler_Module {
+    /**
+     * Used on the settings page to forget the username/password of a POP3 server
+     */
+    public function process() {
+        $just_forgot_credentials = false;
+        if (isset($this->request->post['pop3_forget'])) {
+            list($success, $form) = $this->process_form(array('pop3_server_id'));
+            if ($success) {
+                Hm_POP3_List::forget_credentials($form['pop3_server_id']);
+                $just_forgot_credentials = true;
+                Hm_Msgs::add('Server credentials forgotten');
+                $this->session->record_unsaved('POP3 server credentials forgotten');
+            }
+            else {
+                $this->out('old_form', $form);
+            }
+        }
+        $this->out('just_forgot_credentials', $just_forgot_credentials);
+    }
+}
+
+/**
+ * Delete a POP3 server from the settings page
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_delete extends Hm_Handler_Module {
+    /**
+     * Delete a POP3 server
+     */
+    public function process() {
+        if (isset($this->request->post['pop3_delete'])) {
+            list($success, $form) = $this->process_form(array('pop3_server_id'));
+            if ($success) {
+                $res = Hm_POP3_List::del($form['pop3_server_id']);
+                if ($res) {
+                    $this->out('deleted_server_id', $form['pop3_server_id']);
+                    Hm_Msgs::add('Server deleted');
+                    $this->session->record_unsaved('POP3 server deleted');
+                }
+            }
+            else {
+                $this->out('old_form', $form);
+            }
+        }
+    }
+}
+
+/**
+ * Test a connection to a POP3 server
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_pop3_connect extends Hm_Handler_Module {
+    /**
+     * Used on the servers page to test a POP3 connection
+     */
+    public function process() {
+        $pop3 = false;
+        if (isset($this->request->post['pop3_connect'])) {
+            list($success, $form) = $this->process_form(array('pop3_user', 'pop3_pass', 'pop3_server_id'));
+            if ($success) {
+                $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], false, $form['pop3_user'], $form['pop3_pass']);
+            }
+            elseif (isset($form['pop3_server_id'])) {
+                $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], false);
+            }
+            if ($pop3 && $pop3->state == 'authed') {
+                Hm_Msgs::add("Successfully authenticated to the POP3 server : " . $form['pop3_user']);
+            }
+            else {
+                Hm_Msgs::add("ERRFailed to authenticate to the POP3 server : " . $form['pop3_user']);
+            }
+        }
+    }
+}
+
+/**
+ * Save a POP3 server cache
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_save_pop3_cache extends Hm_Handler_Module {
+    /**
+     * Save a POP3 server cache in the session
+     *
+     */
+    public function process() {
+        $cache = array();
+        if ($this->get('pop3_cache_used')) {
+            return;
+        }
+        $servers = Hm_POP3_List::dump(false, true);
+        foreach ($servers as $id => $server) {
+            if (isset($server['object']) && is_object($server['object'])) {
+                $cache[$id] = $server['object']->dump_cache();
+            }
+        }
+        if (count($cache) > 0) {
+            foreach ($cache as $id => $data) {
+                $this->cache->set('pop3'.$id, $cache[$id]);
+            }
+        }
+    }
+}
+
+/**
+ * Load POP3 servers up for the search page
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_load_pop3_servers_for_search extends Hm_Handler_Module {
+    /**
+     * Add POP3 servers to the data sources list for the search page
+     */
+    public function process() {
+        foreach (Hm_POP3_List::dump() as $index => $vals) {
+            $this->append('data_sources', array('callback' => 'pop3_search_page_content', 'type' => 'pop3', 'name' => $vals['name'], 'id' => $index));
+        }
+    }
+}
+
+/**
+ * Load POP3 server for combined message views
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_load_pop3_servers_for_message_list extends Hm_Handler_Module {
+    /**
+     * Load POP3 servers for a combined message list
+     */
+    public function process() {
+        $server_id = false;
+        $callback = false;
+        if (array_key_exists('list_path', $this->request->get)) {
+            $path = $this->request->get['list_path'];
+        }
+        else {
+            $path = '';
+        }
+        switch ($path) {
+            case 'unread':
+                $callback = 'pop3_combined_unread_content';
+                break;
+            case 'combined_inbox':
+                $callback = 'pop3_combined_inbox_content';
+                break;
+            case 'email':
+                $callback = 'pop3_all_mail_content';
+                break;
+            default:
+                if (preg_match("/^pop3_(\d+)$/", $path, $matches)) {
+                    $server_id = $matches[1];
+                    $callback = 'load_pop3_list';
+                }
+                else {
+                    $callback = 'pop3_unread_background';
+                }
+                break;
+        }
+        if ($callback) {
+            foreach (Hm_POP3_List::dump() as $index => $vals) {
+                if ($server_id !== false && $server_id != $index) {
+                    continue;
+                }
+                if ($callback == 'pop3_unread_background') {
+                    $this->append('data_sources', array('callback' => $callback, 'group' => 'background', 'type' => 'pop3', 'name' => $vals['name'], 'id' => $index));
+                }
+                else {
+                    $this->append('data_sources', array('callback' => $callback, 'type' => 'pop3', 'name' => $vals['name'], 'id' => $index));
+                }
+            }
+        }
+    }
+}
+
+/**
+ * Load POP3 servers from the user config
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_load_pop3_servers_from_config extends Hm_Handler_Module {
+    /**
+     * Setup the POP3 server list
+     */
+    public function process() {
+        $servers = $this->user_config->get('pop3_servers', array());
+        $added = false;
+        $max = 0;
+        $index = 0;
+        foreach ($servers as $server) {
+            Hm_POP3_List::add( $server, $index );
+            if (array_key_exists('default', $server) && $server['default']) {
+                $added = true;
+            }
+            $max = $index;
+            $index++;
+        }
+        $max++;
+        if (!$added) {
+            $auth_server = $this->session->get('pop3_auth_server_settings', array());
+            if (array_key_exists('name', $auth_server)) {
+                $name = $auth_server['name'];
+            }
+            else {
+                $name = $this->config->get('pop3_auth_name', 'Default');
+            }
+            if (!empty($auth_server)) {
+                Hm_POP3_List::add(array( 
+                    'name' => $name,
+                    'default' => true,
+                    'server' => $auth_server['server'],
+                    'port' => $auth_server['port'],
+                    'tls' => $auth_server['tls'],
+                    'user' => $auth_server['username'],
+                    'pass' => $auth_server['password']),
+                $max);
+            }
+        }
+        Hm_POP3_Uid_Cache::load($this->session->get('pop3_read_uids', array()));
+    }
+}
+
+/**
+ * Add a new POP3 server
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_process_add_pop3_server extends Hm_Handler_Module {
+    /**
+     * Used on the servers page to process adding a new POP3 server
+     */
+    public function process() {
+        if (isset($this->request->post['submit_pop3_server'])) {
+            list($success, $form) = $this->process_form(array('new_pop3_name', 'new_pop3_address', 'new_pop3_port'));
+            if (!$success) {
+                $this->out('old_form', $form);
+                Hm_Msgs::add('ERRYou must supply a name, a server and a port ' . $form['pop3_user']);
+            }
+            else {
+                $tls = false;
+                if (array_key_exists('tls', $this->request->post) && $this->request->post['tls']) {
+                    $tls = true;
+                }
+                if ($con = fsockopen($form['new_pop3_address'], $form['new_pop3_port'], $errno, $errstr, 2)) {
+                    Hm_POP3_List::add( array(
+                        'name' => $form['new_pop3_name'],
+                        'server' => $form['new_pop3_address'],
+                        'port' => $form['new_pop3_port'],
+                        'tls' => $tls));
+                    Hm_Msgs::add('Added server!');
+                    $this->session->record_unsaved('POP3 server added');
+                }
+                else {
+                    Hm_Msgs::add(sprintf('ERRCound not add server: %s, %s', $errstr, $form['pop3_user']));
+                }
+            }
+        }
+    }
+}
+
+/**
+ * Add a list of POP3 servers for the output modules
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_add_pop3_servers_to_page_data extends Hm_Handler_Module {
+    /**
+     * Used to add POP3 server ids to an output page
+     */
+    public function process() {
+        $servers = Hm_POP3_List::dump();
+        $this->out('pop3_servers', $servers);
+    }
+}
+
+/**
+ * Load POP3 folder data used by the folder list
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_load_pop3_folders extends Hm_Handler_Module {
+    /**
+     * Add POP3 folders to the folder list E-mail section
+     */
+    public function process() {
+        $servers = Hm_POP3_List::dump();
+        $folders = array();
+        if (!empty($servers)) {
+            foreach ($servers as $id => $server) {
+                if ($server['name'] == 'Default-Auth-Server') {
+                    $server['name'] = 'Default';
+                }
+                $folders[$id] = $server['name'];
+            }
+        }
+        $this->out('pop3_folders', $folders);
+    }
+}
+
+/**
+ * Save POP3 server list
+ * @subpackage pop3/handler
+ */
+class Hm_Handler_save_pop3_servers extends Hm_Handler_Module {
+    /**
+     * Save POP3 servers in the session
+     */
+    public function process() {
+        $servers = Hm_POP3_List::dump(false, true);
+        foreach ($servers as $index => $vals) {
+            if (array_key_exists('object', $vals) && $vals['object']) {
+                unset($servers[$index]['object']);
+            }
+        }
+        $this->user_config->set('pop3_servers', $servers);
+        $this->session->set('pop3_read_uids', Hm_POP3_Uid_Cache::dump());
+        Hm_POP3_List::clean_up();
+    }
+}
+
+/**
+ * Format the add POP3 server dialog
+ * @subpackage pop3/output
+ */
+class Hm_Output_add_pop3_server_dialog extends Hm_Output_Module {
+    /**
+     * Build the HTML for the add server dialog
+     */
+    protected function output() {
+        if ($this->get('single_server_mode')) {
+            return '';
+        }
+        $count = count($this->get('pop3_servers', array()));
+        $count = sprintf($this->trans('%d configured'), $count);
+        return '<div class="pop3_server_setup"><div data-target=".pop3_section" class="server_section">'.
+            '<img alt="" src="'.Hm_Image_Sources::$env_closed.'" width="16" height="16" />'.
+            ' '.$this->trans('POP3 Servers').' <div class="server_count">'.$count.'</div></div><div class="pop3_section"><form class="add_server" method="POST">'.
+            '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
+            '<div class="subtitle">'.$this->trans('Add a POP3 Server').'</div>'.
+            '<table><tr><td colspan="2"><label class="screen_reader" for="new_pop3_name">'.$this->trans('POP3 account name').'</label>'.
+            '<input required type="text" id="new_pop3_name" name="new_pop3_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
+            '<tr><td colspan="2"><label class="screen_reader" for="new_pop3_address">'.$this->trans('POP3 server address').'</label>'.
+            '<input required type="text" id="new_pop3_address" name="new_pop3_address" class="txt_fld form-control" placeholder="'.$this->trans('POP3 server address').'" value=""/></td></tr>'.
+            '<tr><td colspan="2"><label for="new_pop3_port" class="screen_reader">'.$this->trans('POP3 port').'</label>'.
+            '<input required type="number" id="new_pop3_port" name="new_pop3_port" class="port_fld form-control" value="995" placeholder="'.$this->trans('Port').'"></td></tr>'.
+            '<tr><td><input type="radio" name="tls" value="1" id="pop3_tls" checked="checked" class="form-check-input" /> <label for="pop3_tls">'.$this->trans('Use TLS').'</label>'.
+            '<br /><input type="radio" name="tls" value="0" id="pop3_notls" class="form-check-input"><abel for="pop3_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
+            '</tr><tr><td><input class="btn btn-primary  btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_pop3_server" /></td></tr>'.
+            '</table></form>';
+    }
+}
+
+/**
+ * Format a list of configured POP3 servers
+ * @subpackage pop3/output
+ */
+class Hm_Output_display_configured_pop3_servers extends Hm_Output_Module {
+    /**
+     * Build HTML for configured POP3 servers on the servers page
+     */
+    protected function output() {
+        if ($this->get('single_server_mode')) {
+            return '';
+        }
+        $res = '';
+        foreach ($this->get('pop3_servers', array()) as $index => $vals) {
+
+            $no_edit = false;
+
+            if (array_key_exists('user', $vals) && !array_key_exists('nopass', $vals)) {
+                $disabled = 'disabled="disabled"';
+                $user_pc = $vals['user'];
+                $pass_pc = $this->trans('[saved]');
+            }
+            elseif (array_key_exists('user', $vals) && array_key_exists('nopass', $vals)) {
+                $user_pc = $vals['user'];
+                $pass_pc = $this->trans('Password');
+                $disabled = '';
+            }
+            else {
+                $user_pc = '';
+                $pass_pc = $this->trans('Password');
+                $disabled = '';
+            }
+            if ($vals['name'] == 'Default-Auth-Server') {
+                $vals['name'] = $this->trans('Default');
+                $no_edit = true;
+            }
+            $res .= '<div class="configured_server">';
+            $res .= sprintf('<div class="server_title">%s</div><div class="server_subtitle">%s/%d %s</div>',
+                $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['port']), $vals['tls'] ? 'TLS' : '' );
+            $res .= 
+                '<form class="pop3_connect" method="POST">'.
+                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
+                '<input type="hidden" name="pop3_server_id" value="'.$this->html_safe($index).'" /><span> '.
+                '<label class="screen_reader" for="pop3_user_'.$index.'">'.$this->trans('POP3 username').'</label>'.
+                '<input '.$disabled.' id="pop3_user_'.$index.'" class="credentials" placeholder="'.$this->trans('Username').'" type="text" name="pop3_user" value="'.$this->html_safe($user_pc).'"></span>'.
+                '<span> <label class="screen_reader" for="pop3_password_'.$index.'">'.$this->trans('POP3 password').'</label>'.
+                '<input '.$disabled.' id="pop3_password_'.$index.'" class="credentials pop3_password" placeholder="'.$pass_pc.'" type="password" name="pop3_pass"></span>';
+            if (!$no_edit) {
+                if (!isset($vals['user']) || !$vals['user']) {
+                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_pop3_connection" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_pop3_connection" />';
+                }
+                else {
+                    $res .= '<input type="submit" value="Test" class="test_pop3_connect" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_pop3_connection" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_pop3_connection" />';
+                }
+                $res .= '<input type="hidden" value="ajax_pop3_debug" name="hm_ajax_hook" />';
+            }
+            $res .= '</form></div>';
+        }
+        $res .= '<br class="clear_float" /></div></div>';
+        return $res;
+    }
+}
+
+/**
+ * Format POP3 folders for the folder list
+ * @subpackage pop3/output
+ */
+class Hm_Output_filter_pop3_folders extends Hm_Output_Module {
+    /**
+     * Build the HTML for POP3 accounts in the folder list
+     */
+    protected function output() {
+        $res = '';
+        foreach ($this->get('pop3_folders', array()) as $id => $folder) {
+            $res .= '<li class="pop3_'.$this->html_safe($id).'">'.
+                '<a data-id="pop3_'.$this->html_safe($id).'" href="?page=message_list&list_path=pop3_'.$this->html_safe($id).'">';
+            if (!$this->get('hide_folder_icons')) {
+                $res .= '<img class="account_icon" alt="Toggle folder" src="'.Hm_Image_Sources::$folder.'" width="16" height="16" /> ';
+            }
+            $res .= $this->html_safe($folder).'</a></li>';
+        }
+        if ($res) {
+            $this->append('folder_sources', array('email_folders', $res));
+        }
+        return '';
+    }
+}
+
+/**
+ * Format a POP3 message for display
+ * @subpackage pop3/output
+ */
+class Hm_Output_filter_pop3_message_content extends Hm_Output_Module {
+    /**
+     * Build the HTML for a POP3 message view
+     */
+    protected function output() {
+        if ($this->get('pop3_message_headers')) {
+            $txt = '';
+            $from = '';
+            $small_headers = array('subject', 'date', 'from');
+            $headers = $this->get('pop3_message_headers');
+            $txt .= '<table class="msg_headers">'.
+                '<col class="header_name_col"><col class="header_val_col"></colgroup>';
+            foreach ($small_headers as $fld) {
+                foreach ($headers as $name => $value) {
+                    if ($fld == strtolower($name)) {
+                        if ($fld == 'from') {
+                            $from = $value;
+                        }
+                        if ($fld == 'subject') {
+                            $txt .= '<tr class="header_'.$fld.'"><th colspan="2">';
+                            if (isset($headers['Flags']) && stristr($headers['Flags'], 'flagged')) {
+                                $txt .= ' <img alt="" class="account_icon" src="'.Hm_Image_Sources::$folder.'" width="16" height="16" /> ';
+                            }
+                            $txt .= $this->html_safe($value).'</th></tr>';
+                        }
+                        else {
+                            $txt .= '<tr class="header_'.$fld.'"><th>'.$this->trans($name).'</th><td>'.$this->html_safe($value).'</td></tr>';
+                        }
+                        break;
+                    }
+                }
+            }
+            foreach ($headers as $name => $value) {
+                if (!in_array(strtolower($name), $small_headers)) {
+                    $txt .= '<tr style="display: none;" class="long_header"><th>'.$this->trans($name).'</th><td>'.$this->html_safe($value).'</td></tr>';
+                }
+            }
+            $txt .= '<tr><th colspan="2" class="header_links">'.
+                '<a href="#" class="header_toggle">'.$this->trans('All').'</a>'.
+                '<a class="header_toggle" style="display: none;" href="#">small</a>'.
+                ' | <a href="?page=compose">'.$this->trans('Reply').'</a>'.
+                ' | <a href="?page=compose">'.$this->trans('Forward').'</a>'.
+                ' | <a href="?page=compose">'.$this->trans('Attach').'</a>'.
+                ' | <a data-message-part="0" href="#">'.$this->trans('raw').'</a>'.
+                ' | <a href="#">'.$this->trans('Flag').'</a>'.
+                '</th></tr></table>';
+
+            $this->out('msg_headers', $txt);
+        }
+        $txt = '<div class="msg_text_inner">';
+        if ($this->get('pop3_message_body')) {
+            foreach ($this->get('pop3_message_body') as $body) {
+                if (array_key_exists('content-type', $body) && $body['content-type'] === 'html') {
+                    $txt .= format_msg_html($body['text']);
+                }
+                else {
+                    $txt .= format_msg_text($body['text'], $this);
+                }
+            }
+        }
+        $txt .= '</div>';
+        $this->out('msg_text', $txt);
+    }
+}
+
+/**
+ * Format a list of POP3 messages
+ * @subpackage pop3/output
+ */
+class Hm_Output_filter_pop3_message_list extends Hm_Output_Module {
+    /**
+     * Build the HTML for a set of POP3 messages
+     */
+    protected function output() {
+        $res = array();
+        if ($this->get('pop3_mailbox_page')) {
+            $style = $this->get('news_list_style') ? 'news' : 'email';
+            if ($this->get('is_mobile')) {
+                $style = 'news';
+            }
+            if ($this->get('login_time')) {
+                $login_time = $this->get('login_time');
+            }
+            else {
+                $login_time = false;
+            }
+            $res = format_pop3_message_list($this->get('pop3_mailbox_page'), $this, $style, $login_time, $this->get('list_path'));
+        }
+        $this->out('formatted_message_list', $res);
+    }
+}
+
+/**
+ * Output POP3 server ids
+ * @subpackage pop3/output
+ */
+class Hm_Output_pop3_server_ids extends Hm_Output_Module {
+    /**
+     * Put a list of POP3 server ids in a hidden page element
+     */
+    protected function output() {
+        return '<input type="hidden" class="pop3_server_ids" value="'.$this->html_safe(implode(',', array_keys($this->get('pop3_servers', array())))).'" />';
+    }
+}
+
+/**
+ * Format a POP3 status response row
+ * @subpackage pop3/output
+ */
+class Hm_Output_display_pop3_status extends Hm_Output_Module {
+    /**
+     * Build the HTML for a POP3 status row on the home page
+     */
+    protected function output() {
+        $res = '';
+        foreach ($this->get('pop3_servers', array()) as $index => $vals) {
+            if ($vals['name'] == 'Default-Auth-Server') {
+                $vals['name'] = $this->trans('Default');
+            }
+            $res .= '<tr><td>POP3</td><td>'.$vals['name'].'</td><td class="pop3_status_'.$index.'"></td>'.
+                '<td class="pop3_detail_'.$index.'"></td></tr>';
+        }
+        return $res;
+    }
+}
+
+/**
+ * Format POP3 status response data
+ * @subpackage pop3/output
+ */
+class Hm_Output_filter_pop3_status_data extends Hm_Output_Module {
+    /**
+     * Build ajax response for a status row on the home page
+     */
+    protected function output() {
+        if ($this->get('pop3_connect_status') == 'Authenticated') {
+            $this->out('pop3_status_display', '<span class="online">'.
+                $this->trans(ucwords($this->get('pop3_connect_status'))).'</span> in '.round($this->get('pop3_connect_time'), 3));
+        }
+        else {
+            $this->out('pop3_status_display', '<span class="down">'.$this->trans('Down').'</span>');
+        }
+    }
+}
+
+/**
+ * Format a list of POP3 messages
+ * @subpackage pop3/functions
+ * @param array $msg_list list of message data
+ * @param object $mod Hm_Output_Module
+ * @param string $style list style
+ * @param string $login_time timestamp of last login
+ * @param string $list_parent list type
+ * @return array
+ */
+if (!hm_exists('format_pop3_message_list')) {
+function format_pop3_message_list($msg_list, $output_module, $style, $login_time, $list_parent) {
+    $res = array();
+    $show_icons = $output_module->get('msg_list_icons');
+    foreach($msg_list as $msg_id => $msg) {
+        $icon = 'env_open';
+        $row_class = 'email';
+        if ($msg['server_name'] == 'Default-Auth-Server') {
+            $msg['server_name'] = 'Default';
+        }
+        $id = sprintf("pop3_%s_%s", $msg['server_id'], $msg_id);
+        $subject = display_value('subject', $msg, false, $output_module->trans('[No Subject]'));
+        $from = display_value('from', $msg);
+        $nofrom = '';
+        if ($style == 'email' && !$from) {
+            $nofrom = ' nofrom';
+            $from = '[No From]';
+        }
+        $date = display_value('date', $msg, false, $output_module->trans('[No Date]'));
+        if ($date) {
+            $date = translate_time_str($date, $output_module);
+        }
+        $timestamp = display_value('date', $msg, 'time');
+        $url = '?page=message&uid='.$msg_id.'&list_path='.sprintf('pop3_%d', $msg['server_id']).'&list_parent='.$list_parent;
+        if ($output_module->get('list_page', 0)) {
+            $url .= '&list_page='.$output_module->html_safe($output_module->get('list_page', 1));
+        }
+        if (Hm_POP3_Uid_Cache::is_read($id)) {
+            $flags = array();
+        }
+        elseif (Hm_POP3_Uid_Cache::is_unread($id)) {
+            $flags = array('unseen');
+            $icon = 'env_closed';
+            $row_class .= ' unseen';
+        }
+        elseif (isset($msg['date']) && $login_time && strtotime($msg['date']) <= $login_time) {
+            $flags = array();
+        }
+        else {
+            $icon = 'env_closed';
+            $flags = array('unseen');
+        }
+        $row_class .= ' '.str_replace(' ', '_', $msg['server_name']);
+        if (!$show_icons) {
+            $icon = false;
+        }
+        if ($style == 'news') {
+            $res[$id] = message_list_row(array(
+                    array('checkbox_callback', $id),
+                    array('icon_callback', $flags),
+                    array('subject_callback', $subject, $url, $flags, $icon),
+                    array('safe_output_callback', 'source', $msg['server_name']),
+                    array('safe_output_callback', 'from'.$nofrom, $from),
+                    array('date_callback', $date, $timestamp),
+                ),
+                $id,
+                $style,
+                $output_module,
+                $row_class
+            );
+        }
+        else {
+            $res[$id] = message_list_row(array(
+                    array('checkbox_callback', $id),
+                    array('safe_output_callback', 'source', $msg['server_name'], $icon),
+                    array('safe_output_callback', 'from'.$nofrom, $from),
+                    array('subject_callback', $subject, $url, $flags),
+                    array('date_callback', $date, $timestamp),
+                    array('icon_callback', $flags)
+                ),
+                $id,
+                $style,
+                $output_module,
+                $row_class
+            );
+        }
+    }
+    return $res;
+}}
+
+/**
+ * Search a POP3 message
+ * @subpackage pop3/functions
+ * @param string $body message body
+ * @param array $headers message headers
+ * @param string $terms search terms
+ * @param string $fld field to search
+ * @return bool
+ */
+if (!hm_exists('search_pop3_msg')) {
+function search_pop3_msg($body, $headers, $terms, $fld) {
+    if ($fld == 'TEXT') {
+        if (stristr($body, $terms)) {
+            return true;
+        }
+    }
+    if ($fld == 'SUBJECT') {
+        if (array_key_exists('subject', $headers) && stristr($headers['subject'], $terms)) {
+            return true;
+        }
+    }
+    if ($fld == 'FROM') {
+        if (array_key_exists('from', $headers) && stristr($headers['from'], $terms)) {
+            return true;
+        }
+    }
+}}
+
+/**
+ * @subpackage pop3/functions
+ */
+if (!hm_exists('bust_pop3_cache')) {
+function bust_pop3_cache($hm_cache, $id) {
+    $hm_cache->del('pop3'.$id);
+    Hm_Debug::add('Busted POP3 cache for id '.$id);
+}}
+
+/**
+ * @subpackage pop3/functions
+ */
+if (!hm_exists('pop3_authed')) {
+function pop3_authed($pop3) {
+    return is_object($pop3) && $pop3->state == 'authed';
+}}
+
diff --git a/modules/smtp/modules.php b/modules/smtp/modules.php
index 3f51f18a90..2520f8e726 100644
--- a/modules/smtp/modules.php
+++ b/modules/smtp/modules.php
@@ -1220,14 +1220,14 @@ protected function output() {
             '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
             '<div class="subtitle">'.$this->trans('Add an SMTP Server').'</div>'.
             '<table><tr><td colspan="2"><label for="new_smtp_name" class="screen_reader">'.$this->trans('SMTP account name').'</label>'.
-            '<input required type="text" id="new_smtp_name" name="new_smtp_name" class="txt_fld" value="'.$name.'" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
+            '<input required type="text" id="new_smtp_name" name="new_smtp_name" class="txt_fld form-control" value="'.$name.'" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
             '<tr><td colspan="2"><label for="new_smtp_address" class="screen_reader">'.$this->trans('SMTP server address').'</label>'.
-            '<input required type="text" id="new_smtp_address" name="new_smtp_address" value="'.$address.'" class="txt_fld" placeholder="'.$this->trans('SMTP server address').'" /></td></tr>'.
+            '<input required type="text" id="new_smtp_address" name="new_smtp_address" value="'.$address.'" class="txt_fld form-control" placeholder="'.$this->trans('SMTP server address').'" /></td></tr>'.
             '<tr><td colspan="2"><label for="new_smtp_port" class="screen_reader">'.$this->trans('SMTP port').'</label>'.
-            '<input required type="number" id="new_smtp_port" name="new_smtp_port" class="port_fld" value="'.$port.'" placeholder="'.$this->trans('Port').'"></td></tr>'.
+            '<input required type="number" id="new_smtp_port" name="new_smtp_port" class="port_fld form-control" value="'.$port.'" placeholder="'.$this->trans('Port').'"></td></tr>'.
             '<tr><td><input type="radio" name="tls" value="1" id="smtp_tls" checked="checked" /> <label for="smtp_tls">'.$this->trans('Use TLS').'</label>'.
             '<br /><input type="radio" name="tls" id="smtp_notls" value="0" /><label for="smtp_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
-            '</tr><tr><td><input type="submit" value="'.$this->trans('Add').'" name="submit_smtp_server" /></td></tr>'.
+            '</tr><tr><td><input class="btn btn-primary btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_smtp_server" /></td></tr>'.
             '</table></form>';
     }
 }

From f258c0cea1caf135051b92344e2ffec4672a248c Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Wed, 15 Nov 2023 17:13:03 +0200
Subject: [PATCH 02/13] Style migration of the Compose page in bootstrap 5

---
 modules/core/output_modules.php |  2 +-
 modules/core/site.css           |  2 +-
 modules/imap/site.css           |  2 +-
 modules/nux/modules.php         | 34 ++++++++------
 modules/nux/site.css            |  4 +-
 modules/profiles/modules.php    |  2 +-
 modules/profiles/site.css       |  2 +-
 modules/smtp/modules.php        | 79 ++++++++++++++++++++-------------
 modules/smtp/site.css           | 22 ++++-----
 modules/smtp/site.js            | 10 ++---
 10 files changed, 93 insertions(+), 66 deletions(-)

diff --git a/modules/core/output_modules.php b/modules/core/output_modules.php
index 9c79ba9cd4..a8189d9258 100644
--- a/modules/core/output_modules.php
+++ b/modules/core/output_modules.php
@@ -1321,7 +1321,7 @@ protected function output() {
         if (!$this->get('hide_folder_icons')) {
             $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$env_closed).'" alt="" width="16" height="16" /> ';
         }
-        $res .= $this->trans('Unread').'</a><span class="total_unread_count"></span></li>';
+        $res .= $this->trans('Unread').' kokok</a><span class="total_unread_count badge bg-secondary"></span></li>';
         $res .= '<li class="menu_flagged"><a class="unread_link" href="?page=message_list&amp;list_path=flagged">';
         if (!$this->get('hide_folder_icons')) {
             $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$star).'" alt="" width="16" height="16" /> ';
diff --git a/modules/core/site.css b/modules/core/site.css
index f5b6940b8e..065563f3f6 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -199,7 +199,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .rtl_page .list_controls { left: 0px; padding-left: 10px; top: 0px; padding-top: 10px; right: auto; background-color: #fff; }
 .rtl_page .toggle_link { margin-right: 5px !important; margin-left: 15px !important; }
 .rtl_page .msg_controls { margin-right: 0px !important; padding-right: 5px !important; margin-left: 15px !important; }
-.rtl_page .smtp_save, .rtl_page .smtp_reset, .rtl_page .compose_attach_button, .rtl_page .compose_sign{ float: left; }
+.rtl_page .smtp_save, .rtl_page .smtp_reset, .rtl_page .compose_attach_button, .rtl_page { float: left; }
 .rtl_page .smtp_send { direction: rtl !important; }
 .rtl_page .sys_messages { left: 20px; right: auto; }
 .rtl_page .total_unread_count { margin-right: 10px; margin-left: 0px; }
diff --git a/modules/imap/site.css b/modules/imap/site.css
index f06ff509f0..ec5a08d803 100644
--- a/modules/imap/site.css
+++ b/modules/imap/site.css
@@ -79,7 +79,7 @@
 .msg_part_download { width: 10%; }
 
 .download_link, .remove_attachment { width: 100px; }
-.remove_attachment a, .disable_remove a { cursor: default; pointer-events: none; text-decoration: none; }
+/* .remove_attachment a, .disable_remove a { cursor: default; pointer-events: none; text-decoration: none; } */
 .disable_remove a { color: grey; }
 
 .mobile .msg_parts td { padding-bottom: 5px !important; width: 25%; padding-left: 3px !important;}
diff --git a/modules/nux/modules.php b/modules/nux/modules.php
index 8d720d3f7d..706b377d02 100644
--- a/modules/nux/modules.php
+++ b/modules/nux/modules.php
@@ -276,15 +276,23 @@ protected function output() {
         }
         return '<div class="quick_add_section">'.
             '<div class="nux_step_one">'.
-            $this->trans('Quickly add an account from popular E-mail providers. To manually configure an account, use the IMAP/SMTP sections below.').
-            '<br /><br /><label class="screen_reader" for="service_select">'.$this->trans('Select an E-mail provider').'</label>'.
-            ' <select id="service_select" name="service_select"><option value="">'.$this->trans('Select an E-mail provider').'</option>'.Nux_Quick_Services::option_list(false, $this).'</select>'.
-            '<label class="screen_reader" for="nux_username">'.$this->trans('Username').'</label>'.
-            '<input type="email" id="nux_username" class="nux_username form-control mb-3" placeholder="'.$this->trans('Your E-mail address').'" />'.
-            '<label class="screen_reader" for="nux_account_name">'.$this->trans('Account name').'</label>'.
-            '<input type="text" id="nux_account_name mb-3" class="nux_account_name form-control mb-3" placeholder="'.$this->trans('Account Name [optional]').'" />'.
-            '<input type="button" class="nux_next_button btn btn-primary btn-sm" value="'.$this->trans('Next').'" />'.
-            '</div><div class="nux_step_two px-4 pt-3"></div></div></div>';
+            '<p class="py-3">'.$this->trans('Quickly add an account from popular E-mail providers. To manually configure an account, use the IMAP/SMTP sections below.').'</p>'.
+            '<div class="form-floating mb-3">'.
+            ' <select id="service_select" name="service_select" class="form-select">'.
+            '<option value="">'.$this->trans('Select an E-mail provider').'</option>'.
+            Nux_Quick_Services::option_list(false, $this).'</select>'.
+            '<label for="service_select">'.$this->trans('Select an E-mail provider').'</label></div>'.
+
+            '<div class="form-floating mb-3">'.
+            '<input type="email" id="nux_username" class="form-control" placeholder="'.$this->trans('Your E-mail address').'">'.
+            '<label for="nux_username">'.$this->trans('Username').'</label></div>'.
+
+            '<div class="form-floating mb-3">'.
+            '<input type="text" id="nux_account_name" class="form-control" placeholder="'.$this->trans('Account Name [optional]').'">'.
+            '<label for="nux_account_name">'.$this->trans('Account name').'</label></div>'.
+
+            '<input type="button" class="nux_next_button btn btn-primary btn-md" value="'.$this->trans('Next').'">'.
+            '</div><div class="nux_step_two px-4 pt-3"></div></div>';
     }
 }
 
@@ -310,7 +318,7 @@ protected function output() {
  */
 class Hm_Output_nux_dev_news extends Hm_Output_Module {
     protected function output() {
-        $res = '<div class="nux_dev_news col-lg-2 mt-3 col-md-2 col-sm-12"><div class="card"><div class="card-body"><div class="nux_title">'.$this->trans('Development Updates').'</div><table>';
+        $res = '<div class="nux_dev_news mt-3 col-12"><div class="card"><div class="card-body"><div class="nux_title">'.$this->trans('Development Updates').'</div><table>';
         foreach ($this->get('nux_dev_news', array()) as $vals) {
             $res .= sprintf('<tr><td><a href="https://github.com/cypht-org/cypht/commit/%s" target="_blank" rel="noopener">%s</a>'.
                 '</td><td class="msg_date">%s</td><td>%s</td><td>%s</td></tr>',
@@ -331,7 +339,7 @@ protected function output() {
  */
 class Hm_Output_nux_help extends Hm_Output_Module {
     protected function output() {
-        return '<div class="nux_help mt-3 col-lg-5 col-md-5 col-sm-12"><div class="card"><div class="card-body"><div class="nux_title">'.$this->trans('Help').'</div>'.
+        return '<div class="nux_help mt-3 col-lg-6 col-md-12 col-sm-12"><div class="card"><div class="card-body"><div class="nux_title">'.$this->trans('Help').'</div>'.
             $this->trans('Cypht is a webmail program. You can use it to access your E-mail accounts from any service that offers IMAP, or SMTP access - which most do.').' '.
         '</div></div></div>';
     }
@@ -349,9 +357,9 @@ protected function output() {
         $tz = $this->get('tzone');
         $protos = array('imap', 'smtp', 'feeds', 'profiles');
 
-        $res = '<div class="nux_welcome mt-3 col-lg-5 col-md-5 col-sm-12"><div class="card"><div class="card-body"><div class="card-title"><h4>'.$this->trans('Welcome to Cypht').'</h4></div>';
+        $res = '<div class="nux_welcome mt-3 col-lg-6 col-md-5 col-sm-12"><div class="card"><div class="card-body"><div class="card-title"><h4>'.$this->trans('Welcome to Cypht').'</h4></div>';
         $res .= '<div class="mb-3"><p>'.$this->trans('Add a popular E-mail source quickly and easily').'</p>';
-        $res .= '<a class="mt-3 btn btn-light" href="?page=servers#quick_add_section">'.$this->trans('Add an E-mail Account').'</a>';
+        $res .= '<a class="mt-3 btn btn-light" href="?page=servers#quick_add_section"><i class="bi bi-person-plus me-3"></i>'.$this->trans('Add an E-mail Account').'</a>';
         $res .= '</div><ul class="mt-4">';
         
         foreach ($protos as $proto) {
diff --git a/modules/nux/site.css b/modules/nux/site.css
index b2e3384d33..95ed75755d 100644
--- a/modules/nux/site.css
+++ b/modules/nux/site.css
@@ -9,8 +9,8 @@
 .nux_submit { margin-bottom: 20px; }
 /* .nux_account_name, .nux_username, #service_select, .nux_extra_fields { margin-bottom: 10px; width: 280px; padding: 3px; } */
 #nux_email { margin-bottom: 10px; }
-.nux_help, .nux_dev_news, .nux_welcome { padding: 20px; margin: 20px; margin-right: 0px; float: left; border: solid 1px #eee; }
-.nux_welcome, .nux_help { min-width: 320px; max-width: 480px; min-height: 400px; }
+/* .nux_help, .nux_dev_news, .nux_welcome { padding: 20px; margin: 20px; margin-right: 0px; float: left; border: solid 1px #eee; } */
+/* .nux_welcome, .nux_help { min-width: 320px; max-width: 480px; min-height: 400px; } */
 .nux_qa, .nux_imap, .nux_smtp, .nux_profiles, .nux_feeds { margin-bottom: 10px; }
 .nux_dev_news table td { padding-right: 10px; white-space: nowrap; }
 .nux_welcome ul li a { float: right; padding-left: 10px; padding-right: 10px; }
diff --git a/modules/profiles/modules.php b/modules/profiles/modules.php
index 79a36389a1..c0f102b346 100644
--- a/modules/profiles/modules.php
+++ b/modules/profiles/modules.php
@@ -206,7 +206,7 @@ protected function output() {
 class Hm_Output_compose_signature_button extends Hm_Output_Module {
     protected function output() {
         return '<input type="hidden" value="'.$this->trans('You need at least one configured profile to sign messages').'" id="sign_msg" />'.
-            '<input class="compose_sign" type="button" value="'.$this->trans('Sign').'" />';
+            '<input class="compose_sign btn btn-light float-end mt-3 me-2 border" type="button" value="'.$this->trans('Sign').'" />';
     }
 }
 
diff --git a/modules/profiles/site.css b/modules/profiles/site.css
index 424ae811e1..012fa50890 100644
--- a/modules/profiles/site.css
+++ b/modules/profiles/site.css
@@ -5,7 +5,7 @@
 .edit_profile table { width: 20%; padding: 20px; }
 .edit_profile table th { white-space: nowrap; font-weight: normal; text-align: left; vertical-align: top; padding-right: 10px; }
 .edit_profile table th, .edit_profile table td { padding-bottom: 10px; }
-.compose_sign { cursor: pointer; margin-left: 10px; float: right; margin-top: 10px; }
+/* .compose_sign { cursor: pointer; margin-left: 10px; float: right; margin-top: 10px; } */
 .profiles_empty { text-align: center; padding-top: 100px; color: #666; }
 .mobile .profile_fld { display: none; }
 .add_profile { position: absolute; top: 10px; right: 10px; }
diff --git a/modules/smtp/modules.php b/modules/smtp/modules.php
index 2520f8e726..2e65fd639a 100644
--- a/modules/smtp/modules.php
+++ b/modules/smtp/modules.php
@@ -933,8 +933,10 @@ protected function output() {
  */
 class Hm_Output_compose_form_start extends Hm_Output_Module {
     protected function output() {
-        return '<div class="compose_page"><div class="content_title">'.$this->trans('Compose').'</div>' .
-    '<form class="compose_form" method="post" action="?page=compose" data-reminder="' . $this->get('enable_attachment_reminder', 0) . '">';
+        return'<div class="compose_page p-0"><div class="content_title">'.$this->trans('Compose').'</div>'.
+            '<div class="container"><div class="row justify-content-md-center">'.
+            '<div class="col col-lg-8">'.
+            '<form class="compose_form p-4" method="post" action="?page=compose" data-reminder="' . $this->get('enable_attachment_reminder', 0) . '">';
     }
 }
 
@@ -943,7 +945,7 @@ protected function output() {
  */
 class Hm_Output_compose_form_end extends Hm_Output_Module {
     protected function output() {
-        return '</form>';
+        return '</form></div></div></div>';
     }
 }
 
@@ -1098,25 +1100,42 @@ protected function output() {
                 ",basePath: '".WEB_ROOT."modules/smtp/assets/kindeditor/'".
                 '})});;</script>';
         }
+
         $res .= '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<input type="hidden" name="compose_msg_path" value="'.$this->html_safe($msg_path).'" />'.
-            '<input type="hidden" name="post_archive" class="compose_post_archive" value="0" />'.
-            '<input type="hidden" name="next_email_post" class="compose_next_email_data" value="" />'.
-            '<input type="hidden" name="compose_msg_uid" value="'.$this->html_safe($msg_uid).'" />'.
-            '<input type="hidden" class="compose_draft_id" name="draft_id" value="'.$this->html_safe($draft_id).'" />'.
-            '<input type="hidden" class="compose_in_reply_to" name="compose_in_reply_to" value="'.$this->html_safe($in_reply_to).'" />'.
-            '<div class="to_outer"><div class="compose_container"><div class="bubbles bubble_dropdown"></div><input autocomplete="off" value="'.$this->html_safe($to).
-            '" required name="compose_to" class="compose_to" type="text" placeholder="'.$this->trans('To').'" /></div>'.
-            '<a href="#" tabindex="-1" class="toggle_recipients">+</a></div><div id="to_contacts"></div>'.
-            '<div class="recipient_fields"><div class="compose_container"><div class="bubbles bubble_dropdown"></div><input autocomplete="off" value="'.$this->html_safe($cc).
-            '" name="compose_cc" class="compose_cc" type="text" placeholder="'.$this->trans('Cc').
-            '" /><div id="cc_contacts"></div></div><div class="compose_container" ><div class="bubbles bubble_dropdown"></div><input autocomplete="off" value="'.$this->html_safe($bcc).
-            '" name="compose_bcc" class="compose_bcc" type="text" placeholder="'.$this->trans('Bcc').'" />'.
-            '<div id="bcc_contacts"></div></div></div><input value="'.$this->html_safe($subject).
-            '" name="compose_subject" class="compose_subject" type="text" placeholder="'.
-            $this->trans('Subject').'" /><textarea id="compose_body" name="compose_body" class="compose_body">'.
-            $this->html_safe($body).'</textarea>'.
-            '<div><input value="1" name="compose_delivery_receipt" id="compose_delivery_receipt" type="checkbox" /><label for="compose_delivery_receipt">'.$this->trans('Request a delivery receipt').'</label></div>';
+                '<input type="hidden" name="compose_msg_path" value="'.$this->html_safe($msg_path).'" />'.
+                '<input type="hidden" name="post_archive" class="compose_post_archive" value="0" />'.
+                '<input type="hidden" name="next_email_post" class="compose_next_email_data" value="" />'.
+                '<input type="hidden" name="compose_msg_uid" value="'.$this->html_safe($msg_uid).'" />'.
+                '<input type="hidden" class="compose_draft_id" name="draft_id" value="'.$this->html_safe($draft_id).'" />'.
+                '<input type="hidden" class="compose_in_reply_to" name="compose_in_reply_to" value="'.$this->html_safe($in_reply_to).'" />'.
+                
+                '<div class="form-floating mb-3 to_outer position-relative">'.
+                    '<input autocomplete="off" value="'.$this->html_safe($to).'" required name="compose_to" class="compose_to form-control" type="text" placeholder="'.$this->trans('To').' kiki" id="compose_to" />'.
+                    '<label for="compose_to">'.$this->trans('To').'</label>'.
+                    '<a href="#" tabindex="-1" class="toggle_recipients position-absolute top-0 end-0 mt-2 me-2"><i class="bi bi-plus-square-fill fs-3"></i></a>'.
+                '</div>'.
+                '<div id="to_contacts"></div>'.
+                '<div class="recipient_fields">'.
+                    '<div class="form-floating mb-3 compose_container">'.
+                        '<input autocomplete="off" value="'.$this->html_safe($cc).'" name="compose_cc" class="compose_cc form-control" type="text" placeholder="'.$this->trans('Cc').'" id="compose_cc" />'.
+                        '<label for="compose_cc">'.$this->trans('Cc').'</label>'.
+                    '</div>'.
+                    '<div id="cc_contacts"></div>'.
+                    '<div class="form-floating mb-3 compose_container">'.
+                        '<input autocomplete="off" value="'.$this->html_safe($bcc).'" name="compose_bcc" class="compose_bcc form-control" type="text" placeholder="'.$this->trans('Bcc').'" id="compose_bcc" />'.
+                        '<label for="compose_bcc">'.$this->trans('Bcc').'</label>'.
+                    '</div>'.
+                    '<div id="bcc_contacts"></div>'.
+                '</div>'.
+                '<div class="form-floating mb-3">'.
+                    '<input value="'.$this->html_safe($subject).'" required name="compose_subject" class="compose_subject form-control" type="text" placeholder="'.$this->trans('Subject').'" id="compose_subject" />'.
+                    '<label for="compose_subject">'.$this->trans('Subject').'</label>'.
+                '</div>'.
+                '<div class="form-floating">'.
+                    '<textarea id="compose_body" name="compose_body" class="compose_body form-control" placeholder="'.$this->trans('Message').'">'.$this->html_safe($body).'</textarea>'.
+                    '<label for="compose_body">'.$this->trans('Message').'</label>'.
+                '</div>'.
+                '<div><input value="1" name="compose_delivery_receipt" id="compose_delivery_receipt" type="checkbox" /><label for="compose_delivery_receipt">'.$this->trans('Request a delivery receipt').'</label></div>';
         if ($html == 2) {
             $res .= '<link href="'.WEB_ROOT.'modules/smtp/assets/markdown/editor.css" rel="stylesheet" />'.
                 '<script type="text/javascript" src="'.WEB_ROOT.'modules/smtp/assets/markdown/editor.js"></script>'.
@@ -1176,17 +1195,17 @@ protected function output() {
 
         $res .= '</table>'.
             smtp_server_dropdown($this->module_output(), $this, $recip, $selected_id).
-            '<input class="smtp_send" type="submit" value="'.$this->trans('Send').'" name="smtp_send" '.$send_disabled.'/>';
+            '<input class="smtp_send btn btn-success mt-3" type="submit" value="'.$this->trans('Send').'" name="smtp_send" '.$send_disabled.'/>';
 
         if ($this->get('list_path') && ($reply_type == 'reply' || $reply_type == 'reply_all')) {
-            $res .= '<input class="smtp_send_archive" type="button" value="'.$this->trans('Send & Archive').'" name="smtp_send" '.$send_disabled.'/>';
+            $res .= '<input class="smtp_send_archive btn btn-success mt-3" type="button" value="'.$this->trans('Send & Archive').'" name="smtp_send" '.$send_disabled.'/>';
         }
 
         $disabled_attachment = $this->get('attachment_dir_access') ? '' : 'disabled="disabled"';
-        $res .= '<input type="hidden" value="" id="send_uploaded_files" name="send_uploaded_files" /><input class="smtp_save" type="button" value="'.$this->trans('Save').'" />'.
-            '<input class="smtp_reset" type="button" value="'.$this->trans('Reset').'" />'.
-            '<input class="compose_attach_button" value="'.$this->trans('Attach').
-            '" name="compose_attach_button" type="button" '.$disabled_attachment.' />';
+        $res .= '<input type="hidden" value="" id="send_uploaded_files" name="send_uploaded_files" />'.
+                '<input class="smtp_save btn btn-light float-end mt-3 border" type="button" value="'.$this->trans('Save').'" />'.
+                '<input class="smtp_reset btn btn-light float-end mt-3 me-2 border" type="button" value="'.$this->trans('Reset').'" />'.
+                '<input class="compose_attach_button btn btn-light float-end mt-3 me-2 border" value="'.$this->trans('Attach').'" name="compose_attach_button" type="button" '.$disabled_attachment.' />';
         return $res;
     }
 }
@@ -1380,7 +1399,7 @@ protected function output() {
  */
 if (!hm_exists('smtp_server_dropdown')) {
 function smtp_server_dropdown($data, $output_mod, $recip, $selected_id=false) {
-    $res = '<select name="compose_smtp_id" class="compose_server">';
+    $res = '<div class="form-floating"><select id="compose_smtp_id" name="compose_smtp_id" class="compose_server form-select" aria-label="'.$output_mod->trans('Compose SMTP ID').'">';
     $profiles = array();
     if (array_key_exists('compose_profiles', $data)) {
         $profiles = $data['compose_profiles'];
@@ -1434,7 +1453,7 @@ function smtp_server_dropdown($data, $output_mod, $recip, $selected_id=false) {
             }
         }
     }
-    $res .= '</select>';
+    $res .= '</select><label for="compose_smtp_id">'.$output_mod->trans('Compose SMTP ID').'</label></div>';
     return $res;
 }}
 
@@ -1530,7 +1549,7 @@ function format_attachment_row($file, $output_mod) {
     return '<tr id="tr-'.$unique_identifier.'"><td>'.
             $output_mod->html_safe($file['name']).'</td><td>'.$output_mod->html_safe($file['type']).' ' .$output_mod->html_safe(round($file['size']/1024, 2)). 'KB '. 
             '<td style="display:none"><input name="uploaded_files[]" type="text" value="'.$file['name'].'" /></td>'.
-            '</td><td><a class="remove_attachment" id="remove-'.$unique_identifier.'" href="#">Remove</a><a style="display:none" id="pause-'.$unique_identifier.'" class="pause_upload" href="#">Pause</a><a style="display:none" id="resume-'.$unique_identifier.'" class="resume_upload" href="#">Resume</a></td></tr><tr><td colspan="2">'.
+            '</td><td><a class="remove_attachment text-danger" id="remove-'.$unique_identifier.'" href="#">Remove</a><a style="display:none" id="pause-'.$unique_identifier.'" class="pause_upload" href="#">Pause</a><a style="display:none" id="resume-'.$unique_identifier.'" class="resume_upload" href="#">Resume</a></td></tr><tr><td colspan="2">'.
             '<div class="meter" style="width:100%; display: none;"><span id="progress-'.
             $unique_identifier.'" style="width:0%;"><span class="progress" id="progress-bar-'.
             $unique_identifier.'"></span></span></div></td></tr>';
diff --git a/modules/smtp/site.css b/modules/smtp/site.css
index 3fed9c81a0..8c871eb739 100644
--- a/modules/smtp/site.css
+++ b/modules/smtp/site.css
@@ -1,16 +1,16 @@
 .compose_page { width: 100%; height: 100%; min-height: 400px; background-color: #fff; width: 100%; }
-.compose_form { position: relative; display: block; padding: 20px; width: 80%; padding-left: 30px; padding-bottom: 0px; }
-.compose_bcc, .compose_cc, .compose_subject, .compose_to { padding: 5px; margin: 5px; width: 95%; }
-.compose_to, .compose_bcc, .compose_cc { border: unset; outline: none; white-space: nowrap; }
-.toggle_recipients { background-color: #fff; position: absolute; padding-left: 5px; right: 9px; top: 28px; font-size: 120%; }
-.compose_subject { width: 98%; padding: 11px 15px; }
-.compose_body { width: 100%; min-height: 300px; padding: 5px; margin: 5px; }
-.smtp_send { cursor: pointer; color: #666; font-size: 125%; padding: 10px; margin-top: 10px; }
-.smtp_send_archive { cursor: pointer; color: #666; font-size: 125%; padding: 10px; margin-top: 10px; margin-left: 10px; }
+/* .compose_form { position: relative; display: block; padding: 20px; width: 80%; padding-left: 30px; padding-bottom: 0px; } */
+/* .compose_bcc, .compose_cc, .compose_subject, .compose_to { padding: 5px; margin: 5px; width: 95%; } */
+/* .compose_to, .compose_bcc, .compose_cc { border: unset; outline: none; white-space: nowrap; } */
+/* .toggle_recipients { background-color: #fff;font-size: 120%; } */
+
+.compose_body { min-height: 300px !important; }
+/* .smtp_send { cursor: pointer; color: #666; font-size: 125%; padding: 10px; margin-top: 10px; }
+.smtp_send_archive { cursor: pointer; color: #666; font-size: 125%; padding: 10px; margin-top: 10px; margin-left: 10px; } */
 .smtp_section { display: none; }
 .smtp_server_setup .content_title { cursor: pointer; }
-.compose_server, .compose_server option { width: 100%; padding: 5px; margin: 5px; }
-.compose_attach_button, .smtp_save, .smtp_reset { cursor: pointer; margin-left: 10px; float: right; margin-top: 10px; }
+/* .compose_server, .compose_server option { width: 100%; padding: 5px; margin: 5px; } */
+/* .compose_attach_button, .smtp_save, .smtp_reset { cursor: pointer; margin-left: 10px; float: right; margin-top: 10px; } */
 .ke-container { margin-left: 5px !important; border-radius: 3px 3px 3px; margin-top: 5px !important; margin-bottom: 5px !important; padding-right: 0px !important; width: 100% !important; }
 .recipient_fields { display: none; }
 .compose_attach_file { width: 0px; opacity: 0; }
@@ -30,7 +30,7 @@
 .meter span {display: block; height: 100%; }
 .progress {background-color: #4323f5; animation: progressBar 1s ease-in-out; animation-fill-mode:both; }
 @keyframes progressBar { 0% { width: 0; } 100% { width: 100%; }}
-.compose_container { padding: 0 10px 0 0; border: 1px solid #ddd; margin-left: 5px; width: 100%; border-radius: 5px; margin-bottom: 10px; }
+/* .compose_container { padding: 0 10px 0 0; border: 1px solid #ddd; margin-left: 5px; width: 100%; border-radius: 5px; margin-bottom: 10px; } */
 .bubbles { display: inline-block; margin-left: 5px; background-color: #fff; cursor: pointer; padding: 5px 0; }
 .bubble { font-size: .9rem; border: 1px solid #ddd; border-radius: 4px; padding: 7px 14px; display: inline-block; }
 .bubble:hover { background-color: #eee; }
diff --git a/modules/smtp/site.js b/modules/smtp/site.js
index ab088b205c..10b660d8d0 100644
--- a/modules/smtp/site.js
+++ b/modules/smtp/site.js
@@ -170,11 +170,11 @@ var save_compose_state = function(no_files, notice) {
 };
 
 var toggle_recip_flds = function() {
-    var symbol = '+';
-    if ($('.toggle_recipients').text() == '+') {
-        symbol = '-';
+    var symbol = '<i class="bi bi-plus-square-fill fs-3"></i>';
+    if ($('.toggle_recipients').html() == '<i class="bi bi-plus-square-fill fs-3"></i>') {
+        symbol = '<i class="bi bi-dash-square fs-3"></i>';
     }
-    $('.toggle_recipients').text(symbol);
+    $('.toggle_recipients').html(symbol);
     $('.recipient_fields').toggle();
     return false;
 }
@@ -220,7 +220,7 @@ var init_resumable_upload = function () {
     r.on('fileAdded', function(file, event){
         $('.uploaded_files').append('<tr id="tr-'+file.uniqueIdentifier+'"><td>'
                 +file.fileName+'</td><td>'+file.file.type+' ' + (Math.round((file.file.size/1024) * 100)/100) + 'KB '
-                +'</td><td><a class="remove_attachment" id="remove-'+file.uniqueIdentifier+'" style="display:none" href="#">Remove</a><a  id="pause-'+file.uniqueIdentifier+'" class="pause_upload" href="#">Pause</a><a style="display:none" id="resume-'+file.uniqueIdentifier+'" class="resume_upload" href="#">Resume</a></td></tr><tr><td colspan="2">'
+                +'</td><td><a class="remove_attachment text-danger" id="remove-'+file.uniqueIdentifier+'" style="display:none" href="#">Remove</a><a  id="pause-'+file.uniqueIdentifier+'" class="pause_upload" href="#">Pause</a><a style="display:none" id="resume-'+file.uniqueIdentifier+'" class="resume_upload" href="#">Resume</a></td></tr><tr><td colspan="2">'
                 +'<div class="meter" style="width:100%"><span id="progress-'
                 +file.uniqueIdentifier+'" style="width:0%;"><span class="progress" id="progress-bar-'
                 +file.uniqueIdentifier+'"></span></span></div></td></tr>');

From 24b9397e3ad8b4b8e1305236ef4e5bb298dac9e2 Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Wed, 15 Nov 2023 17:18:21 +0200
Subject: [PATCH 03/13] Upgrade bootstrap 5 version to ^5.3

---
 composer.json |  2 +-
 composer.lock | 89 +++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 90 insertions(+), 1 deletion(-)

diff --git a/composer.json b/composer.json
index 296e7e0646..ca59bb591a 100644
--- a/composer.json
+++ b/composer.json
@@ -40,7 +40,7 @@
         "zbateson/mail-mime-parser": "^2.4",
         "league/commonmark": "^2.4",
         "symfony/dotenv": "^4.3 || 5.4",
-        "twbs/bootstrap": "5.0.2",
+        "twbs/bootstrap": "^5.3",
         "twbs/bootstrap-icons": "^1.11"
     },
     "require-dev": {
diff --git a/composer.lock b/composer.lock
index 70977eb0a2..aed126068f 100755
--- a/composer.lock
+++ b/composer.lock
@@ -1554,6 +1554,95 @@
             ],
             "time": "2023-01-26T09:26:14+00:00"
         },
+        {
+            "name": "twbs/bootstrap",
+            "version": "v5.3.2",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/twbs/bootstrap.git",
+                "reference": "344e912d04b5b6a04482113eff20ab416ff01048"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/twbs/bootstrap/zipball/344e912d04b5b6a04482113eff20ab416ff01048",
+                "reference": "344e912d04b5b6a04482113eff20ab416ff01048",
+                "shasum": ""
+            },
+            "replace": {
+                "twitter/bootstrap": "self.version"
+            },
+            "type": "library",
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Mark Otto",
+                    "email": "markdotto@gmail.com"
+                },
+                {
+                    "name": "Jacob Thornton",
+                    "email": "jacobthornton@gmail.com"
+                }
+            ],
+            "description": "The most popular front-end framework for developing responsive, mobile first projects on the web.",
+            "homepage": "https://getbootstrap.com/",
+            "keywords": [
+                "JS",
+                "css",
+                "framework",
+                "front-end",
+                "mobile-first",
+                "responsive",
+                "sass",
+                "web"
+            ],
+            "support": {
+                "issues": "https://github.com/twbs/bootstrap/issues",
+                "source": "https://github.com/twbs/bootstrap/tree/v5.3.2"
+            },
+            "time": "2023-09-14T14:19:27+00:00"
+        },
+        {
+            "name": "twbs/bootstrap-icons",
+            "version": "v1.11.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/twbs/icons.git",
+                "reference": "8d7bc695fb407627378cb184976b348e6a128d59"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/twbs/icons/zipball/8d7bc695fb407627378cb184976b348e6a128d59",
+                "reference": "8d7bc695fb407627378cb184976b348e6a128d59",
+                "shasum": ""
+            },
+            "type": "library",
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Mark Otto",
+                    "email": "markdotto@gmail.com"
+                }
+            ],
+            "description": "Official open source SVG icon library for Bootstrap",
+            "homepage": "https://icons.getbootstrap.com/",
+            "keywords": [
+                "bootstrap",
+                "icon font",
+                "icons",
+                "svg"
+            ],
+            "support": {
+                "issues": "https://github.com/twbs/icons/issues",
+                "source": "https://github.com/twbs/icons/tree/v1.11.1"
+            },
+            "time": "2023-09-17T14:09:28+00:00"
+        },
         {
             "name": "webklex/composer-info",
             "version": "0.0.1",

From 7824da5399c18ea2ad585fa403f5e694997760be Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Fri, 17 Nov 2023 16:13:03 +0200
Subject: [PATCH 04/13] Improve the styles of all components of the server
 configuration page (Email Account, SMTP, IMAP and Feeds)

---
 modules/core/handler_modules.php |   3 +-
 modules/core/output_modules.php  |  14 +--
 modules/core/site.css            |  20 ++--
 modules/core/site.js             |  10 +-
 modules/feeds/modules.php        |  55 +++++++----
 modules/feeds/site.css           |   2 +-
 modules/github/modules.php       |  14 ++-
 modules/imap/output_modules.php  | 157 +++++++++++++++++++++----------
 modules/imap/site.css            |   6 +-
 modules/nasa/modules.php         |  18 ++--
 modules/nux/modules.php          |  59 +++++++-----
 modules/nux/site.css             |   4 +-
 modules/smtp/modules.php         |  82 +++++++++++-----
 modules/wordpress/modules.php    |  15 ++-
 14 files changed, 303 insertions(+), 156 deletions(-)

diff --git a/modules/core/handler_modules.php b/modules/core/handler_modules.php
index 877262023e..efbb38bec4 100644
--- a/modules/core/handler_modules.php
+++ b/modules/core/handler_modules.php
@@ -738,8 +738,7 @@ public function process() {
                 if ($user && $path && $pass) {
                     $this->user_config->save($user, $pass);
                     $this->session->destroy($this->request);
-                    Hm_Msgs::add('Saved user data on logout');
-                    Hm_Msgs::add('Session destroyed on logout');
+                    Hm_Msgs::add('Saved user data on logout, Session destroyed on logout');
                 }
             }
             else {
diff --git a/modules/core/output_modules.php b/modules/core/output_modules.php
index a8189d9258..4251202e24 100644
--- a/modules/core/output_modules.php
+++ b/modules/core/output_modules.php
@@ -292,6 +292,7 @@ protected function output() {
                     <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                     </div>
                     <div class="modal-body">
+                        <input type="hidden" name="hm_page_key" value="'.Hm_Request_Key::generate().'" />
                         <p class="text-wrap">'.$this->trans('Unsaved changes will be lost! Re-enter your password to save and exit.').' <a href="?page=save">'.$this->trans('More info').'</a></p>
                         <input type="text" value="'.$this->html_safe($this->get('username', 'cypht_user')).'" autocomplete="username" style="display: none;"/>
                         <div class="my-3 form-floating">
@@ -367,16 +368,17 @@ protected function output() {
         if (!$this->get('router_login_state') && !empty($msgs)) {
             $logged_out_class = ' logged_out';
         }
-        $res .= '<div class="sys_messages'.$logged_out_class.'">';
+        $res .= '<div class="z-3 position-fixed top-0 end-0 mt-3 me-3 sys_messages'.$logged_out_class.'">';
         if (!empty($msgs)) {
             $res .= implode(',', array_map(function($v) {
                 if (preg_match("/ERR/", $v)) {
-                    return sprintf('<span class="err">%s</span>', $this->trans(substr((string) $v, 3)));
+                    return sprintf('<div class="alert alert-danger alert-dismissible fade show" role="alert"><i class="bi bi-exclamation-triangle me-2"></i><span class="err">%s</span>', $this->trans(substr((string) $v, 3)));
                 }
                 else {
-                    return $this->trans($v);
+                    return sprintf('<div class="alert alert-info alert-dismissible fade show" role="alert"><i class="bi bi-info-circle me-2"></i><span>%s</span>', $this->trans($v));
                 }
             }, $msgs));
+            $res .= '<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button></div>';
         }
         $res .= '</div>';
         return $res;
@@ -407,8 +409,8 @@ protected function output() {
             '<meta name="mobile-web-app-capable" content="yes" />'.
             '<meta name="apple-mobile-web-app-status-bar-style" content="black" />'.
             '<meta name="theme-color" content="#888888" /><meta charset="utf-8" />'.
-            '<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />';
-            '<link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />';
+            '<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />'.
+            '<link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />'.
             '<script src="vendor/twbs/bootstrap/dist/js/bootstrap.bundle.min.js"></script>';
 
         if ($this->get('router_login_state')) {
@@ -1321,7 +1323,7 @@ protected function output() {
         if (!$this->get('hide_folder_icons')) {
             $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$env_closed).'" alt="" width="16" height="16" /> ';
         }
-        $res .= $this->trans('Unread').' kokok</a><span class="total_unread_count badge bg-secondary"></span></li>';
+        $res .= $this->trans('Unread').'</a><span class="total_unread_count badge bg-secondary"></span></li>';
         $res .= '<li class="menu_flagged"><a class="unread_link" href="?page=message_list&amp;list_path=flagged">';
         if (!$this->get('hide_folder_icons')) {
             $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$star).'" alt="" width="16" height="16" /> ';
diff --git a/modules/core/site.css b/modules/core/site.css
index 065563f3f6..d87cd28a32 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -36,7 +36,7 @@ td { vertical-align: top; }
 .title { font-weight: normal; padding: 0px; margin: 0px; margin-left: 20px; margin-bottom: 20px; letter-spacing: -1px; color: #999; }
 .date { display: none; position: absolute; top: 15px; right: 20px; color: #888; padding-right: 0px; padding-top: 6px;}
 .mailbox_list_title { display: inline; }
-.sys_messages { position: fixed; right: 20px; top: 15px; min-height: 30px; min-width: 300px; cursor: pointer; display: none; margin-top: 0px; padding: 15px; padding-bottom: 5px; white-space: nowrap; border: solid 1px #999; border-radius: 5px; filter: drop-shadow(4px 4px 4px #ccc); z-index: 101; }
+/* .sys_messages { position: fixed; right: 20px; top: 15px; min-height: 30px; min-width: 300px; cursor: pointer; display: none; margin-top: 0px; padding: 15px; padding-bottom: 5px; white-space: nowrap; border: solid 1px #999; border-radius: 5px; filter: drop-shadow(4px 4px 4px #ccc); z-index: 101; } */
 .logged_out { display: block !important; }
 #theme_setting, #timezone_setting { max-width: 200px; }
 .s_pre { color: #666}
@@ -136,21 +136,21 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .plink:hover, .nlink:hover { color: teal !important; }
 .limit { width: 50px; margin-left: 20px; }
 .settings_subtitle { font-size: 115%; color: #777 !important; letter-spacing: -1px; padding-bottom: 6px !important; padding-left: 30px !important; height: 25px !important; padding-top: 15px !important; }
-.server_section img, .settings_subtitle img { opacity: .4; padding-right: 10px; vertical-align: -1px; }
-.settings_subtitle, .server_section { cursor: pointer; max-height: 50px; margin-top: 0px; color: #777; padding-bottom: 10px; padding-top: 15px; letter-spacing: -1px; font-size: 115%; padding-left: 30px; border-bottom: solid 1px #ede8e6; }
+/* .server_section img, .settings_subtitle img { opacity: .4; padding-right: 10px; vertical-align: -1px; } */
+/* .settings_subtitle, .server_section { cursor: pointer; max-height: 50px; margin-top: 0px; color: #777; padding-bottom: 10px; padding-top: 15px; letter-spacing: -1px; font-size: 115%; padding-left: 30px; border-bottom: solid 1px #ede8e6; } */
 .list_meta { float: right; margin-right: 20px; letter-spacing: 0px; display: inline; color: #666 !important; font-size: 70% !important; margin-top: 2px; font-style: normal; margin-left: 20px; }
 .list_meta b { color: #333 !important; font-weight: normal; padding-left: 5px; padding-right: 5px; vertical-align: 1px; }
 .noscript { position: absolute; z-index: 100; right: 0px; left: 0px; top: 0px; bottom: 0px; background-color: #ede8e6; opacity: 1; padding-top: 100px; text-align: center; }
 .hide_folders { font-size: 0px; float: left; clear: none; margin-top: 10px; margin-left: 23px; }
 .hide_folders img { opacity: .4; }
 .section_caret { opacity: .15; vertical-align: 4px; padding-right: 10px; }
-.server_count { float: right; margin-right: 120px; font-size: 90%; }
+.server_count { float: right; font-size: 90%; }
 .email_setting, .all_setting, .unread_setting, .flagged_setting, .general_setting, .junk_setting, .trash_setting, .drafts_setting { display: none; }
-.configured_server, .add_server { margin-top: 10px; color: #666; background-color: #fff; margin-bottom: 20px; padding: 10px; width: 200px; }
+/* .configured_server, .add_server { margin-top: 10px; color: #666; background-color: #fff; margin-bottom: 20px; padding: 10px; width: 200px; } */
 .message_list { min-height: 600px; background-color: #fff; height: 100%; padding-bottom: 20px; }
-.configured_server { float: left; margin-left: 25px; width: 230px; }
-.add_server { margin-right: 25px; float: left; clear: left; margin-left: 25px; width: 230px; }
-.configured_server input, .add_server input, .add_server select { margin-bottom: 10px; padding: 5px; margin-right: 5px; }
+/* .configured_server { float: left; margin-left: 25px; width: 230px; } */
+/* .add_server { margin-right: 25px; float: left; clear: left; margin-left: 25px; width: 230px; } */
+/* .configured_server input, .add_server input, .add_server select { margin-bottom: 10px; padding: 5px; margin-right: 5px; } */
 .list_sources, .update_search_label_field { z-index: 100; border-left: solid 1px #ede8e6; border-bottom: solid 1px #ede8e6; position: absolute; right: 0px; top: 54px; background-color: #fafafa; font-size: 85%; padding: 30px; padding-top: 10px; display: none;}
 .list_src, .old_search_terms_label, .search_terms_label { color: #666; margin-bottom: 10px; }
 .old_search_terms_label, .search_terms_label { display: block; width: 100%; }
@@ -201,7 +201,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .rtl_page .msg_controls { margin-right: 0px !important; padding-right: 5px !important; margin-left: 15px !important; }
 .rtl_page .smtp_save, .rtl_page .smtp_reset, .rtl_page .compose_attach_button, .rtl_page { float: left; }
 .rtl_page .smtp_send { direction: rtl !important; }
-.rtl_page .sys_messages { left: 20px; right: auto; }
+/* .rtl_page .sys_messages { left: 20px; right: auto; } */
 .rtl_page .total_unread_count { margin-right: 10px; margin-left: 0px; }
 .rtl_page .debug_title { right: auto; left: 0; }
 .rtl_page .combined_sort { margin-right: 15px; margin-left: 105px;}
@@ -211,7 +211,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 
 /* mobile */
 .mobile { font-size: 90%; min-width: 100%; background: none; }
-.mobile .sys_messages { z-index: 1002; }
+/* .mobile .sys_messages { z-index: 1002; } */
 .mobile .account_icon { width: 24px; height: 24px; padding-bottom: 4px; }
 /* .mobile .save_settings { margin-left: 0px !important; } */
 /* .mobile .save_settings_password { margin-right: 10px; } */
diff --git a/modules/core/site.js b/modules/core/site.js
index 7734ee0b4d..52a6c924ba 100644
--- a/modules/core/site.js
+++ b/modules/core/site.js
@@ -357,22 +357,22 @@ var Hm_Notices = {
         var msg_list = [];
         for (var i in msgs) {
             if (msgs[i].match(/^ERR/)) {
-                msg_list.push('<span class="err">'+msgs[i].substring(3)+'</span>');
+                msg_list.push(msgs[i].substring(3));
             }
             else {
                 msg_list.push(msgs[i]);
             }
         }
         if (!keep) {
-            $('.sys_messages').html(msg_list.join(', '));
+            $('.err').html(msg_list.join(', '));
         }
         else {
-            var existing = $('.sys_messages').html();
+            var existing = $('.err').html();
             if (existing) {
-                $('.sys_messages').append('<br />'+msg_list.join(', '));
+                $('.err').append('<br />'+msg_list.join(', '));
             }
             else {
-                $('.sys_messages').html(msg_list.join(', '));
+                $('.err').html(msg_list.join(', '));
             }
         }
         $('.sys_messages').show();
diff --git a/modules/feeds/modules.php b/modules/feeds/modules.php
index 4d9aafe0a5..8755b12af6 100644
--- a/modules/feeds/modules.php
+++ b/modules/feeds/modules.php
@@ -533,21 +533,42 @@ protected function output() {
         if ($this->format == 'HTML5') {
             $count = count($this->get('feeds', array()));
             $count = sprintf($this->trans('%d configured'), $count);
-            return '<div class="feed_server_setup"><div data-target=".feeds_section" class="server_section">'.
-                '<img alt="" src="'.Hm_Image_Sources::$rss.'" width="16" height="16" />'.
-                ' '.$this->trans('Feeds').' <div class="server_count">'.$count.'</div></div><div class="feeds_section"><form class="add_server" method="POST">'.
-                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<div class="subtitle">'.$this->trans('Add an RSS/ATOM Feed').'</div><table>'.
-                '<tr><td><label class="screen_reader" for="new_feed_name">'.$this->trans('Feed name').'</label>'.
-                '<input required type="text" id="new_feed_name" name="new_feed_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Feed name').'" /></td></tr>'.
-                '<tr><td><label for="new_feed_address" class="screen_reader">'.$this->trans('Site address or feed URL').'</label>'.
-                '<input required type="url" id="new_feed_address" name="new_feed_address" class="txt_fld form-control" placeholder="'.$this->trans('Site address or feed URL').'" value="" /></td></tr>'.
-                '<tr><td><input type="submit" class="btn btn-primary" value="'.$this->trans('Add').'" name="submit_feed" /></td></tr>'.
-                '</table></form>';
+
+            return '<div class="feed_server_setup">
+                        <div data-target=".feeds_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4 pe-auto">
+                            <a href="#" class="pe-auto">
+                                <i class="bi bi-rss-fill me-3"></i>
+                                <b> '.$this->trans('Feeds').'</b>
+                            </a> 
+                            <div class="server_count">'.$count.'</div>
+                        </div>
+
+                        <div class="feeds_section px-4 pt-3">
+                            <div class="row">
+                                <div class="col-12 col-lg-4 mb-4">
+                                    <form class="add_server" method="POST">
+                                        <input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />
+
+                                        <div class="subtitle mt-4">'.$this->trans('Add an RSS/ATOM Feed').'</div>
+
+                                        <div class="form-floating mb-3">
+                                            <input required type="text" id="new_feed_name" name="new_feed_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Feed name').'">
+                                            <label class="" for="new_feed_name">'.$this->trans('Feed name').'</label>
+                                        </div>
+
+                                        <div class="form-floating mb-3">
+                                            <input required type="url" id="new_feed_address" name="new_feed_address" class="txt_fld form-control" placeholder="'.$this->trans('Site address or feed URL').'" value="">
+                                            <label for="new_feed_address" class="">'.$this->trans('Site address or feed URL').'</label>
+                                        </div>
+
+                                        <input type="submit" class="btn btn-primary" value="'.$this->trans('Add').'" name="submit_feed" />
+                                    </form>
+                                </div>';
         }
     }
 }
 
+
 /**
  * @subpackage feeds/output
  */
@@ -556,15 +577,15 @@ protected function output() {
         $res = '';
         if ($this->format == 'HTML5') {
             foreach ($this->get('feeds', array()) as $index => $vals) {
-                $res .= '<div class="configured_server">';
-                $res .= sprintf('<div class="server_title">%s</div><div title="%s" class="server_subtitle">%s</div>',
+                $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
+                $res .= sprintf('<div class="server_title"><b>%s</b></div><div title="%s" class="server_subtitle">%s</div>',
                     $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['server']));
-                $res .= '<form class="feed_connect" method="POST">';
+                $res .= '<form class="feed_connect d-flex gap-2" method="POST">';
                 $res .= '<input type="hidden" name="feed_id" value="'.$this->html_safe($index).'" />';
-                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_feed_connect" />';
-                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="feed_delete" />';
+                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_feed_connect btn btn-outline-secondary btn-sm" />';
+                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="feed_delete btn btn-outline-danger btn-sm" />';
                 $res .= '<input type="hidden" value="ajax_feed_debug" name="hm_ajax_hook" />';
-                $res .= '</form></div>';
+                $res .= '</form></div></div>';
             }
             $res .= '<br class="clear_float" /></div></div>';
         }
diff --git a/modules/feeds/site.css b/modules/feeds/site.css
index 7f62a02333..03362f165c 100644
--- a/modules/feeds/site.css
+++ b/modules/feeds/site.css
@@ -1,6 +1,6 @@
 /* .feeds_section { display: none; } */
 /* .feed_server_setup .content_title { cursor: pointer; } */
 /* .feeds_setting { display: none; } */
-.feeds_section .configured_server, .feeds_section .add_server { height: 140px; }
+/* .feeds_section .configured_server, .feeds_section .add_server { height: 140px; } */
 .feeds_section .add_server { margin-right: 0px; }
 .feeds .source a { color: #666; }
diff --git a/modules/github/modules.php b/modules/github/modules.php
index eb43cd6ac3..4a540b64b7 100644
--- a/modules/github/modules.php
+++ b/modules/github/modules.php
@@ -616,12 +616,18 @@ protected function output() {
 class Hm_Output_github_connect_section extends Hm_Output_Module {
     protected function output() {
         $details = $this->get('github_connect_details', array());
-        $res = '<div class="github_connect"><div data-target=".github_connect_section" class="server_section">'.
-            '<img src="'.Hm_Image_Sources::$code.'" alt="" width="16" height="16" /> '.
-            $this->trans('Github Connect').'</div><div class="github_connect_section"><div class="add_server">';
+        $res = '<div class="github_connect"><div data-target=".github_connect_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4 pe-auto">
+                    <a href="#" class="pe-auto">
+                        <i class="bi bi-github me-3"></i>
+                        <b>'.$this->trans('Github Connect').'</b>
+                    </a>
+                </div>';
+        
+        $res .= '<div class="github_connect_section"><div class="add_server">';
+        
         if (empty($details)) {
             $res .= 'Connect to Github<br /><br />';
-            $res .= '<a href="'.$this->get('github_auth_url', '').'">'.$this->trans('Enable').'</a></div></div><div class="end_float"</div>';
+            $res .= '<a class="btn btn-secondary" href="'.$this->get('github_auth_url', '').'">'.$this->trans('Enable').'</a></div></div><div class="end_float"</div>';
         }
         else {
             $res .= $this->trans('Already connected');
diff --git a/modules/imap/output_modules.php b/modules/imap/output_modules.php
index 5d69d1453a..6c4391a7b1 100644
--- a/modules/imap/output_modules.php
+++ b/modules/imap/output_modules.php
@@ -456,8 +456,8 @@ protected function output() {
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
             }
-            $res .= '<div class="configured_server">';
-            $res .= sprintf('<div class="server_title">%s</div><div class="server_subtitle">%s/%d %s</div>',
+            $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
+            $res .= sprintf('<div class="server_title"><b>%s</b></div><div class="server_subtitle">%s/%d %s</div>',
                 $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['port']),
                 $vals['tls'] ? 'TLS' : '' );
             $res .= '<form class="imap_connect" method="POST">'.
@@ -480,14 +480,15 @@ protected function output() {
                 }
             }
 
+            $res .= '<div class="d-flex gap-2">';
             if (!isset($vals['user']) || !$vals['user']) {
-                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete" />';
-                $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_imap_connection" />';
+                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete btn btn-outline-danger btn-sm" />';
+                $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_imap_connection btn btn-outline-secondary btn-sm" />';
             }
             else {
-                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_imap_connect" />';
-                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete" />';
-                $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_imap_connection" />';
+                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_imap_connect btn btn-outline-secondary btn-sm" />';
+                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete btn btn-outline-danger btn-sm" />';
+                $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_imap_connection btn btn-outline-warning btn-sm" />';
             }
 
             $hidden = false;
@@ -498,16 +499,19 @@ protected function output() {
             if ($hidden) {
                 $res .= 'style="display: none;" ';
             }
-            $res .= 'value="'.$this->trans('Hide').'" class="hide_imap_connection" />';
+            $res .= 'value="'.$this->trans('Hide').'" class="hide_imap_connection btn btn-outline-secondary btn-sm" />';
             $res .= '<input type="submit" ';
             if (!$hidden) {
                 $res .= 'style="display: none;" ';
             }
-            $res .= 'value="'.$this->trans('Unhide').'" class="unhide_imap_connection" />';
+            $res .= 'value="'.$this->trans('Unhide').'" class="unhide_imap_connection btn btn-outline-secondary btn-sm" />';
             $res .= '<input type="hidden" value="ajax_imap_debug" name="hm_ajax_hook" />';
-            $res .= '</form></div>';
+
+            $res .= '</div>';
+
+            $res .= '</form></div></div>';
         }
-        $res .= '<br class="clear_float" /></div></div>';
+        $res .= '<br class="clear_float" /></div></div></div></div>';
         return $res;
     }
 }
@@ -537,25 +541,54 @@ protected function output() {
                 '<label for="enable_sieve_filter">'.$this->trans('Enable Sieve Filters').'</label></td></tr>';
         }
 
-        return '<div class="imap_server_setup"><div data-target=".imap_section" class="server_section">'.
-            '<img alt="" src="'.Hm_Image_Sources::$env_closed.'" width="16" height="16" />'.
-            ' '.$this->trans('IMAP Servers').'<div class="server_count">'.$count.'</div></div><div class="imap_section"><form class="add_server" method="POST">'.
-            '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<div class="subtitle">'.$this->trans('Add an IMAP Server').'</div><table>'.
-            '<tr><td colspan="2"><label class="screen_reader" for="new_imap_name">'.$this->trans('Account name').'</label>'.
-            '<input id="new_imap_name" required type="text" name="new_imap_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
-            '<tr><td colspan="2"><label class="screen_reader" for="new_imap_address">'.$this->trans('Server address').'</label>'.
-            '<input required type="text" id="new_imap_address" name="new_imap_address" class="txt_fld form-control" placeholder="'.$this->trans('IMAP server address').'" value=""/></td></tr>'.
-            '<tr><td colspan="2"><label class="screen_reader" for="new_imap_port">'.$this->trans('IMAP port').'</label>'.
-            '<input required type="number" id="new_imap_port" name="new_imap_port" class="txt_fld form-control" value="993" placeholder="'.$this->trans('Port').'"></td></tr>'.
-             $sieve_extra.
-            '<tr><td colspan="2"><input type="checkbox" id="new_imap_hidden" name="new_imap_hidden" class="form-check-input" value="1">'.
-            '<label for="new_imap_hidden" class="form-check-label">'.$this->trans('Hide From Combined Pages').'</label></td></tr>'.
-             $sieve_extra2.
-            '<tr><td><input type="radio" class="form-check-input" name="tls" value="1" id="imap_tls" checked="checked" /> <label class="form-check-label" for="imap_tls">'.$this->trans('Use TLS').'</label>'.
-            '<br /><input type="radio" class="form-check-input" name="tls" value="0" id="imap_notls" /><label class="form-check-label" for="imap_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
-            '</tr><tr><td><input class="btn btn-primary btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_imap_server" /></td></tr>'.
-            '</table></form>';
+        return '<div class="imap_server_setup"><div data-target=".imap_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4">'.
+            '<a href="#" class="pe-auto"><i class="bi bi-envelope-fill me-3"></i>'.
+            '<b> '.$this->trans('IMAP Servers').'</b></a>'.
+            '<div class="server_count">'.$count.'</div></div>
+            <div class="imap_section px-4 pt-3">
+                <div class="row">
+                    <div class="col-12 col-lg-4">
+                        <form class="add_server" method="POST">'.
+                            '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
+                            '<div class="subtitle">'.$this->trans('Add an IMAP Server').'</div>'.
+
+                            // Account Name Field
+                            '<div class="form-floating mb-3">'.
+                            '<input id="new_imap_name" required type="text" name="new_imap_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Account name').'">'.
+                            '<label for="new_imap_name" class="">'.$this->trans('Account name').'</label></div>'.
+
+                            // Server Address Field
+                            '<div class="form-floating mb-3">'.
+                            '<input required type="text" id="new_imap_address" name="new_imap_address" class="txt_fld form-control" placeholder="'.$this->trans('IMAP server address').'" value="">'.
+                            '<label for="new_imap_address" class="">'.$this->trans('Server address').'</label></div>'.
+
+                            // IMAP Port Field
+                            '<div class="form-floating mb-3">'.
+                            '<input required type="number" id="new_imap_port" name="new_imap_port" class="txt_fld form-control" value="993" placeholder="'.$this->trans('Port').'">'.
+                            '<label for="new_imap_port" class="">'.$this->trans('IMAP port').'</label></div>'.
+
+                            $sieve_extra.
+
+                            // Checkbox for Hide From Combined Pages
+                            '<div class="form-check mb-3">'.
+                            '<input type="checkbox" id="new_imap_hidden" name="new_imap_hidden" class="form-check-input" value="1">'.
+                            '<label for="new_imap_hidden" class="form-check-label">'.$this->trans('Hide From Combined Pages').'</label></div>'.
+
+                            $sieve_extra2.
+
+                            // TLS Radio Button
+                            '<div class="form-check">'.
+                            '<input type="radio" class="form-check-input" name="tls" value="1" id="imap_tls" checked="checked">'.
+                            '<label class="form-check-label" for="imap_tls">'.$this->trans('Use TLS').'</label></div>'.
+
+                            '<div class="form-check mb-3">'.
+                            '<input type="radio" class="form-check-input" name="tls" value="0" id="imap_notls">'.
+                            '<label class="form-check-label" for="imap_notls">'.$this->trans('STARTTLS or unencrypted').'</label></div>'.
+
+                            '<input class="btn btn-primary px-5" type="submit" value="'.$this->trans('Add').'" name="submit_imap_server" />'.
+                        '</form>
+                    </div>';
+
     }
 }
 
@@ -571,27 +604,50 @@ protected function output() {
         if ($this->get('single_server_mode')) {
             return '';
         }
-
+    
         if(!$this->get('is_jmap_supported')){
             return '<div class="jmap_server_setup"><div class="jmap_section" style="display: none;">';
-         }
-
+        }
+    
         $count = count(array_filter($this->get('imap_servers', array()), function($v) { return array_key_exists('type', $v) && $v['type'] == 'jmap';}));
         $count = sprintf($this->trans('%d configured'), $count);
-        return '<div class="jmap_server_setup"><div data-target=".jmap_section" class="server_section">'.
-            '<img alt="" src="'.Hm_Image_Sources::$env_closed.'" width="16" height="16" />'.
-            ' '.$this->trans('JMAP Servers').'<div class="server_count">'.$count.'</div></div><div class="jmap_section"><form class="add_server" method="POST">'.
-            '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<div class="subtitle">'.$this->trans('Add a JMAP Server').'</div><table>'.
-            '<tr><td colspan="2"><label class="screen_reader" for="new_jmap_name">'.$this->trans('Account name').'</label>'.
-            '<input id="new_jmap_name" required type="text" name="new_jmap_name" class="txt_fld" value="" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
-            '<tr><td colspan="2"><label class="screen_reader" for="new_jmap_address">'.$this->trans('Server URL').'</label>'.
-            '<input required type="url" id="new_jmap_address" name="new_jmap_address" class="txt_fld" placeholder="'.$this->trans('Server URL').'" value=""/></td></tr>'.
-            '<tr><td colspan="2"><input type="checkbox" id="new_jmap_hidden" name="new_jmap_hidden" class="" value="1">'.
-            '<label for="new_jmap_hidden">'.$this->trans('Hide From Combined Pages').'</label></td></tr>'.
-            '</tr><tr><td><input type="submit" value="'.$this->trans('Add').'" name="submit_jmap_server" /></td></tr>'.
-            '</table></form>';
+    
+        return '
+        <div class="jmap_server_setup">
+            <div data-target=".jmap_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4 pe-auto">
+                <a href="#" class="pe-auto">
+                    <i class="bi bi-envelope-fill me-3"></i>
+                    <b>'.$this->trans('JMAP Servers').'</b>
+                </a> 
+                <div class="server_count">'.$count.'</div>
+            </div>
+            <div class="jmap_section px-4 pt-3">
+                <div class="row">
+                <div class="col-12 col-lg-4">
+                    <form class="add_server" method="POST">
+                        <input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />
+                        <div class="subtitle">'.$this->trans('Add a JMAP Server').'</div>
+        
+                        <div class="form-floating mb-3">
+                            <input id="new_jmap_name" required type="text" name="new_jmap_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Account name').'">
+                            <label class="" for="new_jmap_name">'.$this->trans('Account name').'</label>
+                        </div>
+        
+                        <div class="form-floating mb-3">
+                            <input required type="url" id="new_jmap_address" name="new_jmap_address" class="txt_fld form-control" placeholder="'.$this->trans('Server URL').'" value="">
+                            <label class="" for="new_jmap_address">'.$this->trans('Server URL').'</label>
+                        </div>
+        
+                        <div class="mb-3">
+                            <input type="checkbox" id="new_jmap_hidden" name="new_jmap_hidden" class="form-check-input" value="1">
+                            <label for="new_jmap_hidden">'.$this->trans('Hide From Combined Pages').'</label>
+                        </div>
+        
+                        <input type="submit" class="btn btn-success px-5" value="'.$this->trans('Add').'" name="submit_jmap_server" />
+                    </form>
+                </div>';
     }
+    
 }
 
 /**
@@ -632,7 +688,7 @@ protected function output() {
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
             }
-            $res .= '<div class="configured_server">';
+            $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
             $res .= sprintf('<div class="server_title">%s</div><div class="server_subtitle">%s</div>',
                 $this->html_safe($vals['name']), $this->html_safe($vals['server']));
             $res .= '<form class="imap_connect" method="POST">'.
@@ -645,6 +701,8 @@ protected function output() {
                 '<input '.$disabled.' id="imap_pass_'.$index.'" class="credentials imap_password" placeholder="'.$pass_pc.
                 '" type="password" name="imap_pass"></span>';
 
+            $res .= '<div class="d-flex gap-2">';    
+
             if (!isset($vals['user']) || !$vals['user']) {
                 $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete" />';
                 $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_imap_connection" />';
@@ -670,9 +728,10 @@ protected function output() {
             }
             $res .= 'value="'.$this->trans('Unhide').'" class="unhide_imap_connection" />';
             $res .= '<input type="hidden" value="ajax_imap_debug" name="hm_ajax_hook" />';
-            $res .= '</form></div>';
+            $res .= '</div>';
+            $res .= '</form></div></div>';
         }
-        $res .= '<br class="clear_float" /></div></div>';
+        $res .= '<br class="clear_float" /></div></div></div>';
         return $res;
     }
 }
diff --git a/modules/imap/site.css b/modules/imap/site.css
index ec5a08d803..07b6f72f86 100644
--- a/modules/imap/site.css
+++ b/modules/imap/site.css
@@ -7,9 +7,9 @@
 .dl { color: #888; }
 .empty_list { text-align: center; color: #ccc; font-size: 2em; font-style: italic; padding: 30px; padding-bottom: 100px; }
 .credentials { width: 205px; margin-bottom: 15px !important; }
-.add_server .txt_fld { width: 205px; }
-.add_server .port_fld { width: 50px; }
-.server_title { font-size: 110%; margin-bottom: 0px; color: #666; }
+/* .add_server .txt_fld { width: 205px; } */
+/* .add_server .port_fld { width: 50px; } */
+/* .server_title { font-size: 110%; margin-bottom: 0px; color: #666; } */
 .server_subtitle { margin-bottom: 20px; color: #666; overflow: hidden; text-overflow: ellipsis}
 .msg_text { min-height: 600px; background-color: #fff; height: 100%; }
 .msg_text_inner { min-height: 300px; font-family: monospace; width: 90%; padding: 30px; padding-left: 40px; }
diff --git a/modules/nasa/modules.php b/modules/nasa/modules.php
index f5ce09b58c..f6aa30d77b 100644
--- a/modules/nasa/modules.php
+++ b/modules/nasa/modules.php
@@ -128,21 +128,27 @@ protected function output() {
  */
 class Hm_Output_nasa_connect_section extends Hm_Output_Module {
     protected function output() {
-        $res = '<div class="nasa_connect"><div data-target=".nasa_connect_section" class="server_section">'.
-            '<img src="'.Hm_Image_Sources::$key.'" alt="" width="16" height="16" /> '.
-            $this->trans('NASA APIs').'</div><div class="nasa_connect_section"><div class="nasa_connect_inner_1" ';
+        $res = '<div class="nasa_connect"><div data-target=".nasa_connect_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4 pe-auto">
+                    <a href="#" class="pe-auto">
+                        <i class="bi bi-key-fill me-3"></i>
+                        <b>'.$this->trans('NASA APIs').'</b>
+                    </a>
+                </div>';
+        
+        $res .= '<div class="nasa_connect_section"><div class="nasa_connect_inner_1" ';
+
         if ($this->get('nasa_api_key')) {
             $res .= 'style="display: none;"';
         }
         $res .= '><div>Connect to NASA APIs</div>';
-        $res .= '<div><input type="text" size="50" class="nasa_api_key" placeholder="'.$this->trans('Enter your API key').'" />';
-        $res .= '<input type="button" class="nasa_api_connect" value="'.$this->trans('Connect').'" /></div></div>';
+        $res .= '<div><input type="text" size="50" class="nasa_api_key form-control" placeholder="'.$this->trans('Enter your API key').'" />';
+        $res .= '<input type="button" class="nasa_api_connect btn btn-secondary" value="'.$this->trans('Connect').'" /></div></div>';
         $res .= '<div class="nasa_connect_inner_2" ';
         if (!$this->get('nasa_api_key')) {
             $res .= 'style="display: none;"';
         }
         $res .= '><div>'.$this->trans('Already connected').'</div>';
-        $res .= '<div><input type="button" class="nasa_api_disconnect" value="'.$this->trans('Disconnect').'" /></div>';
+        $res .= '<div><input type="button" class="nasa_api_disconnect btn btn-danger" value="'.$this->trans('Disconnect').'" /></div>';
         $res .= '</div></div></div>';
         return $res;
     }
diff --git a/modules/nux/modules.php b/modules/nux/modules.php
index 706b377d02..22bb663c59 100644
--- a/modules/nux/modules.php
+++ b/modules/nux/modules.php
@@ -275,24 +275,24 @@ protected function output() {
             return '';
         }
         return '<div class="quick_add_section">'.
-            '<div class="nux_step_one">'.
+            '<div class="nux_step_one px-4 pt-">'.
             '<p class="py-3">'.$this->trans('Quickly add an account from popular E-mail providers. To manually configure an account, use the IMAP/SMTP sections below.').'</p>'.
-            '<div class="form-floating mb-3">'.
+            '<div class="row"><div class="col col-lg-4"><div class="form-floating mb-3">'.
             ' <select id="service_select" name="service_select" class="form-select">'.
             '<option value="">'.$this->trans('Select an E-mail provider').'</option>'.
             Nux_Quick_Services::option_list(false, $this).'</select>'.
             '<label for="service_select">'.$this->trans('Select an E-mail provider').'</label></div>'.
 
             '<div class="form-floating mb-3">'.
-            '<input type="email" id="nux_username" class="form-control" placeholder="'.$this->trans('Your E-mail address').'">'.
+            '<input type="email" id="nux_username" class="form-control nux_username" placeholder="'.$this->trans('Your E-mail address').'">'.
             '<label for="nux_username">'.$this->trans('Username').'</label></div>'.
 
             '<div class="form-floating mb-3">'.
-            '<input type="text" id="nux_account_name" class="form-control" placeholder="'.$this->trans('Account Name [optional]').'">'.
+            '<input type="text" id="nux_account_name" class="form-control nux_account_name" placeholder="'.$this->trans('Account Name [optional]').'">'.
             '<label for="nux_account_name">'.$this->trans('Account name').'</label></div>'.
 
-            '<input type="button" class="nux_next_button btn btn-primary btn-md" value="'.$this->trans('Next').'">'.
-            '</div><div class="nux_step_two px-4 pt-3"></div></div>';
+            '<input type="button" class="nux_next_button btn btn-primary btn-md px-5" value="'.$this->trans('Next').'">'.
+            '</div></div></div><div class="nux_step_two px-4 pt-3"></div></div>';
     }
 }
 
@@ -435,9 +435,9 @@ protected function output() {
         if ($this->get('single_server_mode')) {
             return '';
         }
-        return '<div class="nux_add_account"><div data-target=".quick_add_section" class="server_section">'.
-            '<img src="'.Hm_Image_Sources::$circle_check.'" alt="" width="16" height="16" /> '.
-            $this->trans('Add an E-mail Account').'</div>';
+        return '<div class="nux_add_account"><div data-target=".quick_add_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-2 pe-auto"><a href="#" class="pe-auto">'.
+            '<i class="bi bi-check-circle-fill me-3"></i>'.
+            '<b>'.$this->trans('Add an E-mail Account').'</b></a></div>';
     }
 }
 
@@ -461,19 +461,34 @@ function oauth2_form($details, $mod) {
  * @subpackage nux/functions
  */
 if (!hm_exists('credentials_form')) {
-function credentials_form($details, $mod) {
-    $res = '<input type="hidden" id="nux_service" name="nux_service" value="'.$mod->html_safe($details['id']).'" />';
-    $res .= '<input type="hidden" name="nux_name" class="nux_name" value="'.$mod->html_safe($details['name']).'" />';
-    $res .= '<div class="nux_step_two_title">'.$mod->html_safe($details['name']).'</div>';
-    $res .= $mod->trans('Enter your password for this E-mail provider to complete the connection process');
-    $res .= '<br /><br /><label class="screen_reader" for="nux_email">';
-    $res .= $mod->trans('E-mail Address').'</label><input type="email" id="nux_email" name="nux_email" value="'.$mod->html_safe($details['email']).'" />';
-    $res .= '<br /><label class="screen_reader" for="nux_password">'.$mod->trans('E-mail Password').'</label>';
-    $res .= '<input type="password" id="nux_password" placeholder="'.$mod->trans('E-Mail Password').'" name="nux_password" class="nux_password" />';
-    $res .= '<br /><input type="button" class="nux_submit" value="'.$mod->trans('Connect').'" /><br />';
-    $res .= '<a href="" class="reset_nux_form">Reset</a>';
-    return $res;
-}}
+    function credentials_form($details, $mod) {
+        $res = '<input type="hidden" id="nux_service" name="nux_service" value="'.$mod->html_safe($details['id']).'" />';
+        $res .= '<input type="hidden" name="nux_name" class="nux_name" value="'.$mod->html_safe($details['name']).'" />';
+        $res .= '<div class="nux_step_two_title"><b>'.$mod->html_safe($details['name']).'</b></div>';
+        $res .= $mod->trans('Enter your password for this E-mail provider to complete the connection process');
+    
+        $res .= '<div class="row"><div class="col col-lg-4">';
+        // E-mail Address Field
+        $res .= '<div class="form-floating mb-3 mt-3">';
+        $res .= '<input type="email" class="form-control" id="nux_email" name="nux_email" placeholder="'.$mod->trans('E-mail Address').'" value="'.$mod->html_safe($details['email']).'">';
+        $res .= '<label for="nux_email">'.$mod->trans('E-mail Address').'</label></div>';
+    
+        // E-mail Password Field
+        $res .= '<div class="form-floating mb-3">';
+        $res .= '<input type="password" class="form-control nux_password" id="nux_password" name="nux_password" placeholder="'.$mod->trans('E-Mail Password').'">';
+        $res .= '<label for="nux_password">'.$mod->trans('E-mail Password').'</label></div>';
+    
+        // Connect Button
+        $res .= '<input type="button" class="nux_submit px-5 btn btn-primary me-3" value="'.$mod->trans('Connect').'">';
+    
+        // Reset Link
+        $res .= '<a href="" class="reset_nux_form px-5 btn btn-secondary">Reset</a>';
+
+        $res .= '</div></div>';
+    
+        return $res;
+    }
+}
 
 /**
  * @subpackage nux/functions
diff --git a/modules/nux/site.css b/modules/nux/site.css
index 95ed75755d..0c668d29c3 100644
--- a/modules/nux/site.css
+++ b/modules/nux/site.css
@@ -5,8 +5,8 @@
 /* .nux_step_one, .nux_step_two { padding-left: 40px; max-width: 600px; } */
 /* .enable_auth2 { float: left; padding: 20px; padding-left: 0px; padding-bottom: 40px; font-size: 110%; } */
 .nux_password, .app_password { margin: 10px; margin-left: 0px; margin-top: 0px; width: 280px; }
-.reset_nux_form { float: right; padding: 20px; padding-bottom: 40px; font-size: 110%; }
-.nux_submit { margin-bottom: 20px; }
+/* .reset_nux_form { float: right; padding: 20px; padding-bottom: 40px; font-size: 110%; } */
+/* .nux_submit { margin-bottom: 20px; } */
 /* .nux_account_name, .nux_username, #service_select, .nux_extra_fields { margin-bottom: 10px; width: 280px; padding: 3px; } */
 #nux_email { margin-bottom: 10px; }
 /* .nux_help, .nux_dev_news, .nux_welcome { padding: 20px; margin: 20px; margin-right: 0px; float: left; border: solid 1px #eee; } */
diff --git a/modules/smtp/modules.php b/modules/smtp/modules.php
index 2e65fd639a..5583028e11 100644
--- a/modules/smtp/modules.php
+++ b/modules/smtp/modules.php
@@ -1233,21 +1233,51 @@ protected function output() {
         if (array_key_exists('new_smtp_port', $add_form_vals)) {
             $port = $this->html_safe($add_form_vals['new_smtp_port']);
         }
-        return '<div class="smtp_server_setup"><div data-target=".smtp_section" class="server_section">'.
-            '<img alt="" src="'.Hm_Image_Sources::$doc.'" width="16" height="16" />'.
-            ' '.$this->trans('SMTP Servers').' <div class="server_count">'.$count.'</div></div><div class="smtp_section"><form class="add_server" method="POST">'.
-            '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<div class="subtitle">'.$this->trans('Add an SMTP Server').'</div>'.
-            '<table><tr><td colspan="2"><label for="new_smtp_name" class="screen_reader">'.$this->trans('SMTP account name').'</label>'.
-            '<input required type="text" id="new_smtp_name" name="new_smtp_name" class="txt_fld form-control" value="'.$name.'" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
-            '<tr><td colspan="2"><label for="new_smtp_address" class="screen_reader">'.$this->trans('SMTP server address').'</label>'.
-            '<input required type="text" id="new_smtp_address" name="new_smtp_address" value="'.$address.'" class="txt_fld form-control" placeholder="'.$this->trans('SMTP server address').'" /></td></tr>'.
-            '<tr><td colspan="2"><label for="new_smtp_port" class="screen_reader">'.$this->trans('SMTP port').'</label>'.
-            '<input required type="number" id="new_smtp_port" name="new_smtp_port" class="port_fld form-control" value="'.$port.'" placeholder="'.$this->trans('Port').'"></td></tr>'.
-            '<tr><td><input type="radio" name="tls" value="1" id="smtp_tls" checked="checked" /> <label for="smtp_tls">'.$this->trans('Use TLS').'</label>'.
-            '<br /><input type="radio" name="tls" id="smtp_notls" value="0" /><label for="smtp_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
-            '</tr><tr><td><input class="btn btn-primary btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_smtp_server" /></td></tr>'.
-            '</table></form>';
+        
+        return '<div class="smtp_server_setup">
+                    <div data-target=".smtp_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4 pe-auto">
+                        <a href="#" class="pe-auto">
+                            <i class="bi bi-file-earmark-text-fill me-3"></i>
+                            <b>'.$this->trans('SMTP Servers').'</b>
+                        </a> 
+                        <div class="server_count">'.$count.'</div>
+                    </div>
+                    <div class="smtp_section px-4 pt-3">
+                        <div class="row">
+                        <div class="col-12 col-lg-4">
+                            <form class="" method="POST">
+                                <input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />
+                                <div class="subtitle">'.$this->trans('Add an SMTP Server').'</div>
+
+                                <div class="form-floating mb-3">
+                                    <input required type="text" class="form-control" id="new_smtp_name" name="new_smtp_name" placeholder="'.$this->trans('Account name').'" value="'.$name.'">
+                                    <label for="new_smtp_name">'.$this->trans('SMTP account name').'</label>
+                                </div>
+
+                                <div class="form-floating mb-3">
+                                    <input required type="text" class="form-control" id="new_smtp_address" name="new_smtp_address" placeholder="'.$this->trans('SMTP server address').'" value="'.$address.'">
+                                    <label for="new_smtp_address">'.$this->trans('SMTP server address').'</label>
+                                </div>
+
+                                <div class="form-floating mb-3">
+                                    <input required type="number" class="form-control" id="new_smtp_port" name="new_smtp_port" placeholder="'.$this->trans('Port').'" value="'.$port.'">
+                                    <label for="new_smtp_port">'.$this->trans('SMTP port').'</label>
+                                </div>
+
+                                <div class="mb-3">
+                                    <input type="radio" name="tls" value="1" id="smtp_tls" checked="checked" />
+                                    <label for="smtp_tls">'.$this->trans('Use TLS').'</label>
+                                    <br />
+                                    <input type="radio" name="tls" id="smtp_notls" value="0" />
+                                    <label for="smtp_notls">'.$this->trans('STARTTLS or unencrypted').'</label>
+                                </div>
+
+                                <div class="">
+                                    <input class="btn btn-primary px-5" type="submit" value="'.$this->trans('Add').'" name="submit_smtp_server" />
+                                </div>
+                            </form>
+                        </div>';
+
     }
 }
 
@@ -1344,8 +1374,8 @@ protected function output() {
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
             }
-            $res .= '<div class="configured_server">';
-            $res .= sprintf('<div class="server_title">%s</div><div class="server_subtitle">%s/%d %s</div>',
+            $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
+            $res .= sprintf('<div class="server_title"><b>%s</b></div><div class="server_subtitle">%s/%d %s</div>',
                 $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['port']), $vals['tls'] ? 'TLS' : '' );
             $res .=
                 '<form class="smtp_connect" method="POST">'.
@@ -1353,25 +1383,27 @@ protected function output() {
                 '<input type="hidden" name="smtp_server_id" value="'.$this->html_safe($index).'" /><span> '.
                 '<label class="screen_reader" for="smtp_user_'.$index.'">'.$this->trans('SMTP username').'</label>'.
                 '<input '.$disabled.' class="credentials" id="smtp_user_'.$index.'" placeholder="'.$this->trans('Username').
-                '" type="text" name="smtp_user" value="'.$this->html_safe($user_pc).'"></span><span> <label class="screen_reader" for="smtp_pass_'.
+                '" type="text" name="smtp_user" value="'.$this->html_safe($user_pc).'"></span><br/><span> <label class="screen_reader" for="smtp_pass_'.
                 $index.'">'.$this->trans('SMTP password').'</label><input '.$disabled.' class="credentials smtp_password" placeholder="'.
                 $pass_pc.'" type="password" id="smtp_pass_'.$index.'" name="smtp_pass"></span>';
 
+            $res .= '<div class="d-flex gap-2">';
             if (!$no_edit) {
                 if (!isset($vals['user']) || !$vals['user']) {
-                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_smtp_connection" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection btn btn-light border btn-sm" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_smtp_connection btn btn-light border btn-sm" />';
                 }
                 else {
-                    $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_smtp_connect" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_smtp_connection" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_smtp_connect btn btn-outline-secondary btn-sm" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection btn btn-outline-danger btn-sm" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_smtp_connection btn btn-outline-warning btn-sm" />';
                 }
                 $res .= '<input type="hidden" value="ajax_smtp_debug" name="hm_ajax_hook" />';
             }
-            $res .= '</form></div>';
+            $res .= '</div>';
+            $res .= '</form></div></div>';
         }
-        $res .= '<br class="clear_float" /></div></div>';
+        $res .= '<br class="clear_float" /></div></div></div>';
         return $res;
     }
 }
diff --git a/modules/wordpress/modules.php b/modules/wordpress/modules.php
index 2fa533b5ba..9eccfe4b06 100644
--- a/modules/wordpress/modules.php
+++ b/modules/wordpress/modules.php
@@ -419,12 +419,19 @@ protected function output() {
 class Hm_Output_wordpress_connect_section extends Hm_Output_Module {
     protected function output() {
         $details = $this->get('wp_connect_details', array());
-        $res = '<div class="wordpress_connect"><div data-target=".wordpress_connect_section" class="server_section">'.
-            '<img src="'.Hm_Image_Sources::$key.'" alt="" width="16" height="16" /> '.
-            $this->trans('WordPress.com Connect').'</div><div class="wordpress_connect_section">';
+        
+        $res = '<div class="wordpress_connect"><div data-target=".wordpress_connect_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4 pe-auto">
+                    <a href="#" class="pe-auto">
+                        <i class="bi bi-wordpress me-3"></i>
+                        <b>'.$this->trans('WordPress.com Connect').'</b>
+                    </a>
+                </div>';
+        
+        $res .= '<div class="wordpress_connect_section">';
+        
         if (empty($details)) {
             $res .= 'Connect to WordPress.com to view notifications and posts.<br /><br />';
-            $res .= '<a href="'.$this->get('wp_auth_url', '').'">'.$this->trans('Enable').'</a></div></div>';
+            $res .= '<a class="btn btn-secondary" href="'.$this->get('wp_auth_url', '').'">'.$this->trans('Enable').'</a></div></div>';
         }
         else {
             $res .= $this->trans('Already connected');

From af7df3a3c0a07feba5c106423035973829ebc32b Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Thu, 30 Nov 2023 00:43:46 +0200
Subject: [PATCH 05/13] Improve styles of imap_folders and other message list
 components

---
 modules/account/modules.php             |  39 ++-
 modules/account/site.css                |   4 -
 modules/calendar/modules.php            |   2 +-
 modules/core/message_list_functions.php |  22 +-
 modules/core/output_modules.php         |  37 +--
 modules/core/site.css                   |  36 ++-
 modules/core/site.js                    |   6 +-
 modules/feeds/modules.php               |   2 +-
 modules/imap/functions.php              |   2 +-
 modules/imap/output_modules.php         |  20 +-
 modules/imap/site.css                   |  10 +-
 modules/imap_folders/modules.php        | 316 ++++++++++++++++--------
 modules/imap_folders/site.css           |   9 +-
 modules/imap_folders/site.js            |   2 +-
 modules/nasa/modules.php                |   2 +-
 modules/nux/modules.php                 |   4 +-
 modules/pop3/modules.php                |   2 +-
 modules/smtp/modules.php                |   2 +-
 18 files changed, 318 insertions(+), 199 deletions(-)

diff --git a/modules/account/modules.php b/modules/account/modules.php
index daf9e0845e..f0e2a961f9 100644
--- a/modules/account/modules.php
+++ b/modules/account/modules.php
@@ -224,20 +224,37 @@ class Hm_Output_change_password extends Hm_Output_Module {
     protected function output() {
         $res = '';
         if ($this->get('internal_users')) {
-            $res .= '<div class="chg_pass_page"><div class="content_title">'.$this->trans('Change Password').'</div>'.
-                '<div class="change_pass"><form method="POST">'.
-                '<input type="hidden" name="hm_page_key" value="'.Hm_Request_Key::generate().'" />'.
-                '<label class="screen_reader" for="old_pass">'.$this->trans('Current password').'</label>'.
-                '<input required type="password" id="old_pass" name="old_pass" placeholder="'.$this->trans('Current password').'" /><br />'.
-                '<label class="screen_reader" for="new_pass1">'.$this->trans('New password').'</label>'.
-                '<input required type="password" id="new_pass1" name="new_pass1" placeholder="'.$this->trans('New password').'" /><br />'.
-                '<label class="screen_reader" for="new_pass2">'.$this->trans('New password again').'</label>'.
-                '<input required type="password" id="new_pass2" name="new_pass2" placeholder="'.$this->trans('New password again').'" /><br />'.
-                '<input type="submit" name="change_password" value="'.$this->trans('Update').'" />';
-            $res .= '</form></div></div>';
+            $res .= '<div class="chg_pass_page px-0">
+                        <div class="content_title px-3">'.$this->trans('Change Password').'</div>
+                        <div class="change_pass row px-3 mt-3">
+                            <div class="col-lg-4 col-sm-12">
+                                <form method="POST">
+                                    <input type="hidden" name="hm_page_key" value="'.Hm_Request_Key::generate().'" />
+
+                                    <div class="form-floating mb-3">
+                                        <input required type="password" id="old_pass" name="old_pass" class="form-control" placeholder="'.$this->trans('Current password').'">
+                                        <label for="old_pass">'.$this->trans('Current password').'</label>
+                                    </div>
+
+                                    <div class="form-floating mb-3">
+                                        <input required type="password" id="new_pass1" name="new_pass1" class="form-control" placeholder="'.$this->trans('New password').'">
+                                        <label for="new_pass1">'.$this->trans('New password').'</label>
+                                    </div>
+
+                                    <div class="form-floating mb-3">
+                                        <input required type="password" id="new_pass2" name="new_pass2" class="form-control" placeholder="'.$this->trans('New password again').'">
+                                        <label for="new_pass2">'.$this->trans('New password again').'</label>
+                                    </div>
+
+                                    <input type="submit" name="change_password" class="btn btn-success" value="'.$this->trans('Update').'">
+                                </form>
+                            </div>
+                        </div>
+                    </div>';
         }
         return $res;
     }
 }
 
 
+
diff --git a/modules/account/site.css b/modules/account/site.css
index 2801e3ece2..cad245438c 100644
--- a/modules/account/site.css
+++ b/modules/account/site.css
@@ -1,10 +1,6 @@
 .create_user { margin-top: 20px; margin-left: 10px; }
-.chg_pass_page { width: 100%; }
-.change_pass { width: 100%; }
 .create_user input { clear: both; float: left; padding: 4px; margin-left: 20px; margin-top: 10px; margin-bottom: 10px; }
 .create_account_link { margin-left: 120px; float: left; clear: left; font-size: 115%; padding: 5px; }
-.change_pass { margin-left: 20px; margin-top: 20px; }
-.change_pass input { margin-bottom: 20px; }
 .user_list { padding-left: 40px; padding-top: 20px; }
 .user_list td {padding-bottom: 10px; }
 .user_list .user_delete { cursor: pointer; margin-right: 10px; }
diff --git a/modules/calendar/modules.php b/modules/calendar/modules.php
index 66b69899ec..2b07e924ae 100644
--- a/modules/calendar/modules.php
+++ b/modules/calendar/modules.php
@@ -203,7 +203,7 @@ protected function output() {
                                 <div class="mb-3 row">
                                     <div class="col-md-2"></div>
                                     <div class="col-md-10">
-                                        <button type="submit" class="btn btn-primary">'.$this->trans('Create').'</button>
+                                        <button type="submit" class="btn btn-success">'.$this->trans('Create').'</button>
                                     </div>
                                 </div>
                             </form>
diff --git a/modules/core/message_list_functions.php b/modules/core/message_list_functions.php
index 228952efcc..0338452c52 100644
--- a/modules/core/message_list_functions.php
+++ b/modules/core/message_list_functions.php
@@ -104,7 +104,7 @@ function message_list_meta($input, $output_mod) {
     $date = sprintf('%s', strtolower($output_mod->trans($times[$since])));
     $max = sprintf($output_mod->trans('sources@%d each'), $limit);
 
-    return '<div class="list_meta">'.
+    return '<div class="list_meta d-flex align-items-center fs-6">'.
         $date.
         '<b>-</b>'.
         '<span class="src_count"></span> '.$max.
@@ -127,7 +127,7 @@ function combined_sort_dialog($mod) {
         '3' => $mod->trans('Subject'),
     );
 
-    $res = '<select name="sort" class="combined_sort">';
+    $res = '<select name="sort" style="width: 150px" class="combined_sort form-select form-select-sm">';
     foreach ($sorts as $name => $val) {
         $res .= '<option value="'.$name.'">'.$val.' &darr;</option>';
         $res .= '<option value="-'.$name.'">'.$val.' &uarr;</option>';
@@ -350,14 +350,14 @@ function icon_callback($vals, $style, $output_mod) {
  */
 if (!hm_exists('message_controls')) {
 function message_controls($output_mod) {
-    $res = '<a class="toggle_link" href="#"><img alt="x" src="'.Hm_Image_Sources::$check.'" width="8" height="8" /></a>'.
-        '<div class="msg_controls">'.
-        '<a class="msg_read core_msg_control" href="#" data-action="read">'.$output_mod->trans('Read').'</a>'.
-        '<a class="msg_unread core_msg_control" href="#" data-action="unread">'.$output_mod->trans('Unread').'</a>'.
-        '<a class="msg_flag core_msg_control" href="#" data-action="flag">'.$output_mod->trans('Flag').'</a>'.
-        '<a class="msg_unflag core_msg_control" href="#" data-action="unflag">'.$output_mod->trans('Unflag').'</a>'.
-        '<a class="msg_delete core_msg_control" href="#" data-action="delete">'.$output_mod->trans('Delete').'</a>'.
-        '<a class="msg_archive core_msg_control" href="#" data-action="archive">'.$output_mod->trans('Archive').'</a>';
+    $res = '<a class="toggle_link border px-1 m-0" href="#"><i class="bi bi-check"></i></a>'.
+        '<div class="msg_controls fs-6 d-none gap-2">'.
+        '<a class="msg_read core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="read">'.$output_mod->trans('Read').'</a>'.
+        '<a class="msg_unread core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="unread">'.$output_mod->trans('Unread').'</a>'.
+        '<a class="msg_flag core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="flag">'.$output_mod->trans('Flag').'</a>'.
+        '<a class="msg_unflag core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="unflag">'.$output_mod->trans('Unflag').'</a>'.
+        '<a class="msg_delete core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="delete">'.$output_mod->trans('Delete').'</a>'.
+        '<a class="msg_archive core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="archive">'.$output_mod->trans('Archive').'</a>';
 
     if ($output_mod->get('msg_controls_extra')) {
         $res .= $output_mod->get('msg_controls_extra');
@@ -492,7 +492,7 @@ function update_search_label_field($search_term, $output_mod) {
  */
 if (!hm_exists('list_controls')) {
 function list_controls($refresh_link, $config_link, $source_link=false, $search_field='') {
-    return '<div class="list_controls no_mobile">'.
+    return '<div class="list_controls no_mobile d-flex gap-3 align-items-center">'.
         $refresh_link.$source_link.$config_link.$search_field.'</div>
     <div class="list_controls on_mobile">'.$search_field.'
         <img alt="" src="'.Hm_Image_Sources::$three_dot.'" width="20" height="20" onclick="listControlsMenu()"/>
diff --git a/modules/core/output_modules.php b/modules/core/output_modules.php
index 4251202e24..5144065bbc 100644
--- a/modules/core/output_modules.php
+++ b/modules/core/output_modules.php
@@ -302,7 +302,7 @@ protected function output() {
                     </div>
                     <div class="modal-footer">
                         <input class="cancel_logout save_settings btn btn-secondary" data-bs-dismiss="modal" type="button" value="'.$this->trans('Cancel').'" />
-                        <input class="save_settings btn btn-primary" id="logout_without_saving" type="submit" name="logout" value="'.$this->trans('Just Logout').'" />
+                        <input class="save_settings btn btn-success" id="logout_without_saving" type="submit" name="logout" value="'.$this->trans('Just Logout').'" />
                         <input class="save_settings btn btn-success" type="submit" name="save_and_logout" value="'.$this->trans('Save and Logout').'" />
                     </div>
                 </div>
@@ -1463,12 +1463,12 @@ class Hm_Output_save_form extends Hm_Output_Module {
      */
     protected function output() {
         $changed = $this->get('changed_settings', array());
-        $res = '<div class="save_settings_page"><div class="content_title">'.$this->trans('Save Settings').'</div>';
-        $res .= '<div class="save_details">'.$this->trans('Settings are not saved permanently on the server unless you explicitly allow it. '.
+        $res = '<div class="save_settings_page p-0"><div class="content_title px-3">'.$this->trans('Save Settings').'</div>';
+        $res .= '<div class="save_details p-3">'.$this->trans('Settings are not saved permanently on the server unless you explicitly allow it. '.
             'If you don\'t save your settings, any changes made since you last logged in will be deleted when your '.
             'session expires or you logout. You must re-enter your password for security purposes to save your settings '.
             'permanently.');
-        $res .= '<div class="save_subtitle">'.$this->trans('Unsaved Changes').'</div>';
+        $res .= '<div class="save_subtitle mt-3"><b>'.$this->trans('Unsaved Changes').'</b></div>';
         $res .= '<ul class="unsaved_settings">';
         if (!empty($changed)) {
             $changed = array_count_values($changed);
@@ -1479,15 +1479,15 @@ protected function output() {
         else {
             $res .= '<li>'.$this->trans('No changes need to be saved').'</li>';
         }
-        $res .= '</ul></div><div class="save_perm_form"><form method="post">'.
+        $res .= '</ul></div><div class="save_perm_form px-3"><form method="post">'.
             '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
             '<input type="text" value="'.$this->html_safe($this->get('username', 'cypht_user')).'" autocomplete="username" style="display: none;"/>'.
             '<label class="screen_reader" for="password">Password</label><input required id="password" '.
-            'name="password" autocomplete="current-password" class="save_settings_password" type="password" placeholder="'.$this->trans('Password').'" />'.
-            '<input class="save_settings" type="submit" name="save_settings_permanently" value="'.$this->trans('Save').'" />'.
-            '<input class="save_settings" type="submit" name="save_settings_permanently_then_logout" value="'.$this->trans('Save and Logout').'" />'.
+            'name="password" autocomplete="current-password" class="save_settings_password form-control mb-2" type="password" placeholder="'.$this->trans('Password').'" />'.
+            '<input class="save_settings btn btn-success me-2" type="submit" name="save_settings_permanently" value="'.$this->trans('Save').'" />'.
+            '<input class="save_settings btn btn-outline-secondary me-2" type="submit" name="save_settings_permanently_then_logout" value="'.$this->trans('Save and Logout').'" />'.
             '</form><form method="post"><input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<input class="save_settings" type="submit" name="logout" value="'.$this->trans('Just Logout').'" />'.
+            '<input class="save_settings btn btn-outline-secondary" type="submit" name="logout" value="'.$this->trans('Just Logout').'" />'.
             '</form></div>';
 
         $res .= '</div>';
@@ -1814,18 +1814,18 @@ protected function output() {
         if ($this->get('custom_list_controls', '')) {
             $config_link = $this->get('custom_list_controls');
             $source_link = '';
-            $refresh_link = '<a class="refresh_link" title="'.$this->trans('Refresh').'" href="#"><img alt="Refresh" class="refresh_list" src="'.Hm_Image_Sources::$refresh.'" width="20" height="20" /></a>';
+            $refresh_link = '<a class="refresh_link" title="'.$this->trans('Refresh').'" href="#"><i class="bi bi-arrow-clockwise refresh_list"></i></a>';
         }
         elseif (!$this->get('no_list_controls', false)) {
-            $source_link = '<a href="#" title="'.$this->trans('Sources').'" class="source_link"><img alt="Sources" class="refresh_list" src="'.Hm_Image_Sources::$folder.'" width="20" height="20" /></a>';
+            $source_link = '<a href="#" title="'.$this->trans('Sources').'" class="source_link"><i class="bi bi-folder-fill refresh_list"></i></a>';
             if ($this->get('list_path') == 'combined_inbox') {
                 $path = 'all';
             }
             else {
                 $path = $this->get('list_path');
             }
-            $config_link = '<a title="'.$this->trans('Configure').'" href="?page=settings#'.$path.'_setting"><img alt="Configure" class="refresh_list" src="'.Hm_Image_Sources::$cog.'" width="20" height="20" /></a>';
-            $refresh_link = '<a class="refresh_link" title="'.$this->trans('Refresh').'" href="#"><img alt="Refresh" class="refresh_list" src="'.Hm_Image_Sources::$refresh.'" width="20" height="20" /></a>';
+            $config_link = '<a title="'.$this->trans('Configure').'" href="?page=settings#'.$path.'_setting"><i class="bi bi-gear-wide refresh_list"></i></a>';
+            $refresh_link = '<a class="refresh_link" title="'.$this->trans('Refresh').'" href="#"><i class="bi bi-arrow-clockwise refresh_list"></i></a>';
             //$search_field = '<form method="GET">
             //<input type="hidden" name="page" value="message_list" />
             //<input type="hidden" name="list_path" value="'.$this->html_safe($this->get('list_path')).'"/>
@@ -1839,15 +1839,16 @@ protected function output() {
             $search_field = '';
         }
         $res = '';
-        $res .= '<div class="message_list '.$this->html_safe($this->get('list_path')).'_list"><div class="content_title">';
-        $res .= message_controls($this).'<div class="mailbox_list_title">'.
+        $res .= '<div class="message_list p-0 '.$this->html_safe($this->get('list_path')).'_list"><div class="content_title d-flex gap-3 justify-content-between px-3 align-items-center">';
+        $res .= '<div class="d-flex gap-3">' . message_controls($this).'<div class="mailbox_list_title">'.
             implode('<img class="path_delim" src="'.Hm_Image_Sources::$caret.'" alt="&gt;" width="8" height="8" />', array_map( function($v) { return $this->trans($v); },
                 $this->get('mailbox_list_title', array()))).'</div>';
         if (!$this->get('is_mobile') && substr((string) $this->get('list_path'), 0, 5) != 'imap_') {
             $res .= combined_sort_dialog($this);
         }
+        $res .= '</div>';
+        $res .= message_list_meta($this->module_output(), $this);
         $res .= list_controls($refresh_link, $config_link, $source_link, $search_field);
-	    $res .= message_list_meta($this->module_output(), $this);
         $res .= list_sources($this->get('data_sources', array()), $this);
         $res .= '</div>';
         return $res;
@@ -1874,8 +1875,8 @@ protected function output() {
  */
 class Hm_Output_search_move_copy_controls extends Hm_Output_Module {
     protected function output() {
-        $res = '<span class="ctr_divider"></span> <a class="imap_move disabled_input" href="#" data-action="copy">'.$this->trans('Copy').'</a>';
-        $res .= '<a class="imap_move disabled_input" href="#" data-action="move">'.$this->trans('Move').'</a>';
+        $res = '<span class="ctr_divider"></span> <a class="imap_move disabled_input btn btn-sm btn-secondary" href="#" data-action="copy">'.$this->trans('Copy').'</a>';
+        $res .= '<a class="imap_move disabled_input btn btn-sm btn-secondary" href="#" data-action="move">'.$this->trans('Move').'</a>';
         $res .= '<div class="move_to_location"></div>';
         $res .= '<input type="hidden" class="move_to_type" value="" />';
         $res .= '<input type="hidden" class="move_to_string1" value="'.$this->trans('Move to ...').'" />';
diff --git a/modules/core/site.css b/modules/core/site.css
index d87cd28a32..b06cc11dd5 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -12,8 +12,8 @@ html, body { max-width: 100%; min-height: 100%; background-color: #fff; }
 body { background: linear-gradient(180deg, #faf6f5, #faf6f5, #faf6f5, #faf6f5, #fff); font-size: 1em; height: 100%; color: #333; font-family: Arial; padding: 0px; margin: 0px; min-width: 700px; font-size: 100%; }
 table { width: 100%; border-spacing: 0px; }
 td { vertical-align: top; }
-.adv_controls .combined_sort, .message_list .combined_sort { font-size: 80%; margin-top: -2px; ; float: right; margin-right: 125px; }
-.adv_controls .combined_sort { margin-right: 20px; }
+/* .adv_controls .combined_sort, .message_list .combined_sort { font-size: 80%; margin-top: -2px; ; float: right; margin-right: 125px; } */
+/* .adv_controls .combined_sort { margin-right: 20px; } */
 .search_content .combined_sort { display: none; }
 .offline { display: none; cursor: pointer; position: absolute; right: 0px; top: 0px; z-index: 101; color: white; background-color: red; padding: 18px; padding-right: 25px; padding-left: 25px; font-weight: bold; }
 .subject div, .msg_date, .from, .source { overflow: hidden; color: #333; text-overflow: ellipsis; white-space: nowrap; }
@@ -35,7 +35,7 @@ td { vertical-align: top; }
 .subtitle { color: teal; padding-bottom: 5px; font-weight: normal; letter-spacing: 0px; font-size: 100%;  margin-left: 0px !important; }
 .title { font-weight: normal; padding: 0px; margin: 0px; margin-left: 20px; margin-bottom: 20px; letter-spacing: -1px; color: #999; }
 .date { display: none; position: absolute; top: 15px; right: 20px; color: #888; padding-right: 0px; padding-top: 6px;}
-.mailbox_list_title { display: inline; }
+
 /* .sys_messages { position: fixed; right: 20px; top: 15px; min-height: 30px; min-width: 300px; cursor: pointer; display: none; margin-top: 0px; padding: 15px; padding-bottom: 5px; white-space: nowrap; border: solid 1px #999; border-radius: 5px; filter: drop-shadow(4px 4px 4px #ccc); z-index: 101; } */
 .logged_out { display: block !important; }
 #theme_setting, #timezone_setting { max-width: 200px; }
@@ -87,7 +87,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .folder_list .update_message_list{ font-size: 80%; padding-top: 10px; float: right; }
 .src_name { white-space: nowrap; overflow: hidden; cursor: pointer; border-left: solid 1px #eee; padding-left: 25px; margin-top: 0px; margin-right: -15px; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; color: #777; padding-top: 10px; font-size: 125%; letter-spacing: -1px; padding-bottom: 10px; }
 .main_menu { padding-top: 20px; }
-.content_title { margin-top: 0px; color: #777; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; padding-bottom: 10px; padding-top: 20px; letter-spacing: -1px; font-size: 125%; padding-left: 27px;}
+.content_title { margin-top: 0px; color: #777; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; padding-bottom: 10px; padding-top: 20px; letter-spacing: -1px; font-size: 125%;}
 .header_subject .content_title { color: #555; }
 .header_subject th { white-space: normal !important; }
 .end_float { clear: both; }
@@ -116,15 +116,14 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .news_cell .msg_date { clear: both; }
 .msg_img { max-width: 100%; }
 .wait { }
-.msg_controls { position: relative; display: none; padding-left: 0px; margin-right: 20px; }
-.msg_controls_visible { display: inline; }
-.msg_controls a, .toggle_link { font-size: .6em; letter-spacing: 0px; color: #666; background-color: #fff; border: solid 1px #ede8e6; padding: 3px; width: auto; border-radius: 3px; vertical-align: 3px; display: inline-block !important; }
-.msg_controls a { margin-right: 3px; }
-.toggle_link { padding-left: 4px !important; padding-right: 4px !important; padding-top: 4px !important;}
-.refresh_list, .list_settings_link { opacity: .4; padding: 5px; padding-bottom: 0px; cursor: pointer; padding-right: 0px; vertical-align: -13px; }
+/* .msg_controls { position: relative; display: none; padding-left: 0px; margin-right: 20px; } */
+/* .msg_controls_visible { display: inline; } */
+/* .msg_controls a { font-size: .6em; letter-spacing: 0px; color: #666; background-color: #fff; border: solid 1px #ede8e6; padding: 3px; width: auto; border-radius: 3px; vertical-align: 3px; display: inline-block !important; }
+.msg_controls a { margin-right: 3px; } */
+/* .toggle_link { padding-left: 4px !important; padding-right: 4px !important; padding-top: 4px !important;} */
 .list_settings_dialog { display: none; padding: 10px; position: absolute; top: 0px; right: 0px; width: 600px; background-color: #efefef; border: solid 1px #ede8e6; }
-.list_controls { position: absolute; right: 0px; padding-right: 10px; top: 0px; padding-top: 10px; background-color: #fff; }
-.list_controls a { padding-right: 5px; }
+/* .list_controls { position: absolute; right: 0px; padding-right: 10px; top: 0px; padding-top: 10px; background-color: #fff; } */
+/* .list_controls a { padding-right: 5px; } */
 .list_settings_dialog table { width: 1%; white-space: nowrap; }
 .list_settings_dialog table th { font-size: 90%; font-weight: normal; text-align: left; }
 .folder_toggle { font-size: 0px; float: left; margin: 15px; margin-top: 19px; display: none; }
@@ -135,11 +134,11 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .plink, .nlink { color: #666; }
 .plink:hover, .nlink:hover { color: teal !important; }
 .limit { width: 50px; margin-left: 20px; }
-.settings_subtitle { font-size: 115%; color: #777 !important; letter-spacing: -1px; padding-bottom: 6px !important; padding-left: 30px !important; height: 25px !important; padding-top: 15px !important; }
+/* .settings_subtitle { font-size: 115%; color: #777 !important; letter-spacing: -1px; padding-bottom: 6px !important; padding-left: 30px !important; height: 25px !important; padding-top: 15px !important; } */
 /* .server_section img, .settings_subtitle img { opacity: .4; padding-right: 10px; vertical-align: -1px; } */
 /* .settings_subtitle, .server_section { cursor: pointer; max-height: 50px; margin-top: 0px; color: #777; padding-bottom: 10px; padding-top: 15px; letter-spacing: -1px; font-size: 115%; padding-left: 30px; border-bottom: solid 1px #ede8e6; } */
-.list_meta { float: right; margin-right: 20px; letter-spacing: 0px; display: inline; color: #666 !important; font-size: 70% !important; margin-top: 2px; font-style: normal; margin-left: 20px; }
-.list_meta b { color: #333 !important; font-weight: normal; padding-left: 5px; padding-right: 5px; vertical-align: 1px; }
+/* .list_meta { float: right; margin-right: 20px; letter-spacing: 0px; display: inline; color: #666 !important; font-size: 70% !important; margin-top: 2px; font-style: normal; margin-left: 20px; } */
+/* .list_meta b { color: #333 !important; font-weight: normal; padding-left: 5px; padding-right: 5px; vertical-align: 1px; } */
 .noscript { position: absolute; z-index: 100; right: 0px; left: 0px; top: 0px; bottom: 0px; background-color: #ede8e6; opacity: 1; padding-top: 100px; text-align: center; }
 .hide_folders { font-size: 0px; float: left; clear: none; margin-top: 10px; margin-left: 23px; }
 .hide_folders img { opacity: .4; }
@@ -147,7 +146,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .server_count { float: right; font-size: 90%; }
 .email_setting, .all_setting, .unread_setting, .flagged_setting, .general_setting, .junk_setting, .trash_setting, .drafts_setting { display: none; }
 /* .configured_server, .add_server { margin-top: 10px; color: #666; background-color: #fff; margin-bottom: 20px; padding: 10px; width: 200px; } */
-.message_list { min-height: 600px; background-color: #fff; height: 100%; padding-bottom: 20px; }
+/* .message_list { min-height: 600px; background-color: #fff; height: 100%; padding-bottom: 20px; } */
 /* .configured_server { float: left; margin-left: 25px; width: 230px; } */
 /* .add_server { margin-right: 25px; float: left; clear: left; margin-left: 25px; width: 230px; } */
 /* .configured_server input, .add_server input, .add_server select { margin-bottom: 10px; padding: 5px; margin-right: 5px; } */
@@ -161,9 +160,8 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .search_terms { padding-left: 5px; }
 .folder_list .search_terms { width: 80%; }
 .search_content { display: table; table-layout: fixed; width: 100%; min-height: 600px; background: #fff; height: 100%; margin-right: 20px; padding-bottom: 40px; }
-.save_perm_form, .save_details { max-width: 600px; margin-left: 30px; margin-top: 20px; padding-right: 20px; color: #666; }
-.save_subtitle { font-size: 110%; padding-top: 20px; }
-.unsaved_settings { margin-bottom: 30px; }
+/* .save_perm_form, .save_details { max-width: 600px; margin-left: 30px; margin-top: 20px; padding-right: 20px; color: #666; } */
+/* .save_subtitle { font-size: 110%; padding-top: 20px; } */
 .msg_text_inner p { padding: 5px; }
 .save_reminder { clear: both; float: right; margin-right: 25px; }
 .save_reminder img { opacity: .4; }
diff --git a/modules/core/site.js b/modules/core/site.js
index 52a6c924ba..9e863bedd8 100644
--- a/modules/core/site.js
+++ b/modules/core/site.js
@@ -663,10 +663,12 @@ function Message_List() {
 
     this.toggle_msg_controls = function() {
         if ($('input[type=checkbox]', $('.message_table')).filter(function() {return this.checked; }).length > 0) {
-            $('.msg_controls').addClass('msg_controls_visible');
+            $('.msg_controls').addClass('d-flex');
+            $('.msg_controls').removeClass('d-none');
         }
         else {
-            $('.msg_controls').removeClass('msg_controls_visible');
+            $('.msg_controls').removeClass('d-flex');
+            $('.msg_controls').addClass('d-none');
         }
     };
 
diff --git a/modules/feeds/modules.php b/modules/feeds/modules.php
index 8755b12af6..cf464dc9d5 100644
--- a/modules/feeds/modules.php
+++ b/modules/feeds/modules.php
@@ -561,7 +561,7 @@ protected function output() {
                                             <label for="new_feed_address" class="">'.$this->trans('Site address or feed URL').'</label>
                                         </div>
 
-                                        <input type="submit" class="btn btn-primary" value="'.$this->trans('Add').'" name="submit_feed" />
+                                        <input type="submit" class="btn btn-success" value="'.$this->trans('Add').'" name="submit_feed" />
                                     </form>
                                 </div>';
         }
diff --git a/modules/imap/functions.php b/modules/imap/functions.php
index c2adc185b6..d73eac2340 100644
--- a/modules/imap/functions.php
+++ b/modules/imap/functions.php
@@ -1386,7 +1386,7 @@ function snooze_formats() {
 function snooze_dropdown($output, $unsnooze = false) {
     $values = snooze_formats();
     $txt = '<div style="display: inline-block;">';
-    $txt .= '<a class="snooze_link hlink" id="snooze_message" href="#">'.$output->trans('Snooze').'</a>';
+    $txt .= '<a class="snooze_link hlink btn btn-sm btn-outline-success" id="snooze_message" href="#">'.$output->trans('Snooze').'</a>';
     $txt .= '<div class="snooze_dropdown" style="display:none;">';
     foreach ($values as $format) {
         $labels = get_snooze_date($format, true);
diff --git a/modules/imap/output_modules.php b/modules/imap/output_modules.php
index 6c4391a7b1..006529801b 100644
--- a/modules/imap/output_modules.php
+++ b/modules/imap/output_modules.php
@@ -35,12 +35,12 @@ protected function output() {
                     'to' => $this->trans('To'), 'subject' => $this->trans('Subject'), 'arrival' => $this->trans('Arrival Date'));
             }
 
-            $custom = '<form id="imap_filter_form" method="GET">';
+            $custom = '<form id="imap_filter_form" method="GET" class="d-flex align-content-center">';
             $custom .= '<input type="hidden" name="page" value="message_list" />';
             $custom .= '<input type="hidden" name="list_path" value="'.$this->html_safe($this->get('list_path')).'" />';
             $custom .= '<input type="search" placeholder="'.$this->trans('Search').
-                '" class="imap_keyword" name="keyword" value="'.$this->html_safe($keyword).'" />';
-            $custom .= '<select name="sort" class="imap_sort">';
+                '" class="imap_keyword form-control form-control-sm" name="keyword" value="'.$this->html_safe($keyword).'" />';
+            $custom .= '<select name="sort" class="imap_sort form-control form-control-sm">';
             foreach ($sorts as $name => $val) {
                 $custom .= '<option ';
                 if ($name == $sort) {
@@ -55,7 +55,7 @@ protected function output() {
             }
             $custom .= '</select>';
 
-            $custom .= '<select name="filter" class="imap_filter">';
+            $custom .= '<select name="filter" class="imap_filter form-control form-control-sm">';
             foreach ($opts as $name => $val) {
                 $custom .= '<option ';
                 if ($name == $filter) {
@@ -69,15 +69,13 @@ protected function output() {
                 $custom .= '<a class="remove_source" title="'.$this->trans('Remove this folder from combined pages').
                     '" href=""><img width="20" height="20" class="refresh_list" src="'.Hm_Image_Sources::$circle_x.
                     '" alt="'.$this->trans('Remove').'"/></a><a style="display: none;" class="add_source" title="'.
-                    $this->trans('Add this folder to combined pages').'" href=""><img class="refresh_list" width="20" height="20" alt="'.
-                    $this->trans('Add').'" src="'.Hm_Image_Sources::$circle_check.'" /></a>';
+                    $this->trans('Add this folder to combined pages').'" href=""><i class="bi bi-check-circle-fill refresh_list"></i></a>';
             }
             else {
                 $custom .= '<a style="display: none;" class="remove_source" title="'.$this->trans('Remove this folder from combined pages').
                     '" href=""><img width="20" height="20" class="refresh_list" src="'.Hm_Image_Sources::$circle_x.'" alt="'.
                     $this->trans('Remove').'"/></a><a class="add_source" title="'.$this->trans('Add this folder to combined pages').
-                    '" href=""><img class="refresh_list" width="20" height="20" alt="'.$this->trans('Add').'" src="'.
-                    Hm_Image_Sources::$circle_check.'" /></a>';
+                    '" href=""><i class="bi bi-check-circle-fill refresh_list"></i></a>';
             }
             $this->out('custom_list_controls', $custom);
         }
@@ -585,7 +583,7 @@ protected function output() {
                             '<input type="radio" class="form-check-input" name="tls" value="0" id="imap_notls">'.
                             '<label class="form-check-label" for="imap_notls">'.$this->trans('STARTTLS or unencrypted').'</label></div>'.
 
-                            '<input class="btn btn-primary px-5" type="submit" value="'.$this->trans('Add').'" name="submit_imap_server" />'.
+                            '<input class="btn btn-success px-5" type="submit" value="'.$this->trans('Add').'" name="submit_imap_server" />'.
                         '</form>
                     </div>';
 
@@ -791,8 +789,8 @@ protected function output() {
 class Hm_Output_move_copy_controls extends Hm_Output_Module {
     protected function output() {
         if ($this->get('move_copy_controls', false)) {
-            $res = '<span class="ctr_divider"></span> <a class="imap_move disabled_input" href="#" data-action="copy">'.$this->trans('Copy').'</a>';
-            $res .= '<a class="imap_move disabled_input" href="#" data-action="move">'.$this->trans('Move').'</a>';
+            $res = '<span class="ctr_divider"></span> <a class="imap_move disabled_input btn btn-sm btn-secondary" href="#" data-action="copy">'.$this->trans('Copy').'</a>';
+            $res .= '<a class="imap_move disabled_input btn btn-sm btn-secondary" href="#" data-action="move">'.$this->trans('Move').'</a>';
             $res .= '<div class="move_to_location"></div>';
             $res .= '<input type="hidden" class="move_to_type" value="" />';
             $res .= '<input type="hidden" class="move_to_string1" value="'.$this->trans('Move to ...').'" />';
diff --git a/modules/imap/site.css b/modules/imap/site.css
index 07b6f72f86..03acaebc9d 100644
--- a/modules/imap/site.css
+++ b/modules/imap/site.css
@@ -44,13 +44,13 @@
 .imap_server_setup { table-layout: fixed; width: 100%; display: table; background-color: #fff; }
 .checkbox_row { padding-right: 10px !important; }
 .checkbox_header img { padding-left: 3px; padding-right: 0px; }
-.toggle_link img { opacity: .6; vertical-align: -2px; }
+/* .toggle_link img { opacity: .6; vertical-align: -2px; } */
 .deleted a { text-decoration: line-through !important; color: #aaa !important; }
 .unread_controls { float: left; }
 .float_title { float: left; }
 .icon img { opacity: .5; vertical-align: -3px; padding-right: 5px; }
-.toggle_link img { vertical-align: 1px; opacity: .6 !important; }
-.toggle_link { padding: 2px; line-height: 10px; margin-top: 3px; margin-right: 12px !important; width: 8px !important; display: inline; opacity: 1 !important; margin-left: 3px; }
+/* .toggle_link img { vertical-align: 1px; opacity: .6 !important; } */
+/* .toggle_link { padding: 2px; line-height: 10px; margin-top: 3px; margin-right: 12px !important; width: 8px !important; display: inline; opacity: 1 !important; margin-left: 3px; } */
 .online { color: teal; }
 .sieve_extensions { font-size: 75%; white-space: normal; }
 .down { color: red; }
@@ -65,7 +65,7 @@
 .msg_move_to .move_to_location { font-size: 100%; left: auto; right: 0px; top: 33px; font-variant: normal; }
 .msg_move_to { width: auto !important; position: relative; display: inline-block; }
 .move_to_location .expand_link { float: left !important; width: auto !important; }
-.imap_keyword, .imap_sort, .imap_filter { font-size: 75%; float: left; margin-top: 8px; }
+/* .imap_keyword, .imap_sort, .imap_filter { font-size: 75%; float: left; margin-top: 8px; } */
 .imap_keyword { width: 120px; }
 .msg_part_icon { opacity: .4; padding-right: 5px; }
 .msg_part_placeholder { visibility: hidden; }
@@ -93,7 +93,7 @@
 
 .attached_image { margin-right: 20px; margin-bottom: 20px; height: 200px; }
 .attached_image_box { display: flex; flex-wrap: wrap; border-top: solid 1px #ddd; padding-top: 20px; padding-left: 20px; width: 100%; padding-bottom: 40px; }
-.list_meta { float: none; margin-left: 37%; }
+/* .list_meta { float: none; margin-left: 37%; } */
 .cypht-dropdown { display: none; position: absolute; margin-top: 15px; background-color: #fff; border: 1px solid #ddd; box-shadow: 3px 3px 3px #ddd; font-variant: none;     min-width: 250px; }
 .cypht-dropdown a { padding: 8px; padding-left: 15px !important; padding-right: 15px !important; white-space: nowrap; font-size: 1rem; display: block !important; margin-right: 0; border: 0; cursor: pointer; }
 .cypht-dropdown a:hover { background-color: #eee; }
diff --git a/modules/imap_folders/modules.php b/modules/imap_folders/modules.php
index 5eec59c4f5..b4047613e8 100644
--- a/modules/imap_folders/modules.php
+++ b/modules/imap_folders/modules.php
@@ -340,9 +340,9 @@ public function process() {
 class Hm_Output_folders_server_select extends Hm_Output_Module {
     protected function output() {
         $server_id = $this->get('folder_server', -1);
-        $res = '<div class="folders_page"><form method="get">';
+        $res = '<div class="folders_page mt-4 row mb-4"><div class="col-lg-5 col-sm-12"><form id="form_folder_imap" method="get">';
         $res .= '<input type="hidden" name="page" value="folders" />';
-        $res .= '<select id="imap_server_folder" name="imap_server_id">';
+        $res .= '<div class="form-floating"><select class="form-select" id="imap_server_folder" name="imap_server_id">';
         $res .= '<option ';
         if ($server_id == -1) {
             $res .= 'selected="selected" ';
@@ -356,7 +356,7 @@ protected function output() {
             $res .= 'value="'.$this->html_safe($id).'">';
             $res .= $this->html_safe($server['name']);
         }
-        $res .= '</select></form></div>';
+        $res .= '</select><label for="imap_server_folder">'.$this->trans('IMAP Server').'</label></div></form></div></div>';
         $res .= '<input type="hidden" id="server_error" value="'.$this->trans('You must select an IMAP server first').'" />';
         $res .= '<input type="hidden" id="folder_name_error" value="'.$this->trans('New folder name is required').'" />';
         $res .= '<input type="hidden" id="delete_folder_error" value="'.$this->trans('Folder to delete is required').'" />';
@@ -372,15 +372,24 @@ protected function output() {
 class Hm_Output_folders_delete_dialog extends Hm_Output_Module {
     protected function output() {
         if ($this->get('folder_server') !== NULL) {
-            $res = '<div data-target=".delete_dialog" class="settings_subtitle">'.$this->trans('Delete a Folder').'</div>';
-            $res .= '<div class="delete_dialog folder_dialog">';
-            $res .= '<div class="folder_row"><a href="#" class="select_delete_folder">';
-            $res .= $this->trans('Select Folder').'</a>: <span class="selected_delete"></span></div>';
-            $res .= '<ul class="folders delete_folder_select"><li class="delete_title"><a href="#" class="close">';
-            $res .= $this->trans('Cancel').'</a></li></ul>';
-            $res .= '<input type="hidden" value="" id="delete_source" />';
-            $res .= ' <input type="button" id="delete_folder" value="'.$this->trans('Delete').'" />';
-            $res .= '</div>';
+            $res = '<div class="row m-0 px-3 mt-3">';
+            $res .= '<div data-target=".delete_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                        <a href="#" class="pe-auto">'.$this->trans('Delete a Folder').'</a>
+                    </div>';
+            $res .= '<div class="delete_dialog folder_dialog col-lg-4 col-md-6 col-sm-12 py-1 px-0">
+                        <div class="folder_row">
+                            <a href="#" class="select_delete_folder">'.$this->trans('Select Folder').'</a>: 
+                            <span class="selected_delete"></span>
+                        </div>
+                        <ul class="folders delete_folder_select">
+                            <li class="delete_title">
+                                <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                            </li>
+                        </ul>
+                        <input type="hidden" value="" id="delete_source" />
+                        <input type="button" id="delete_folder" class="btn btn-danger" value="'.$this->trans('Delete').'">
+                     </div></div>';
+
             return $res;
         }
     }
@@ -392,23 +401,39 @@ protected function output() {
 class Hm_Output_folders_rename_dialog extends Hm_Output_Module {
     protected function output() {
         if ($this->get('folder_server') !== NULL) {
-            $res = '<div data-target=".rename_dialog" class="settings_subtitle">'.$this->trans('Rename a Folder').'</div>';
-            $res .= '<div class="rename_dialog folder_dialog">';
-            $res .= '<div class="folder_row"><a href="#" class="select_rename_folder">'.$this->trans('Select Folder');
-            $res .= '</a>: <span class="selected_rename"></span></div>';
-            $res .= '<ul class="folders rename_folder_select"><li class="rename_title"><a href="#" class="close">';
-            $res .= $this->trans('Cancel').'</a></li></ul>';
-            $res .= ' <input id="rename_value" type="text" value="" placeholder="'.$this->trans('New Folder Name').'" /><br />';
-
-            $res .= '<div class="folder_row"><a href="#" class="select_rename_parent_folder">'.$this->trans('Select Parent Folder (optional)');
-            $res .= '</a>: <span class="selected_rename_parent"></span></div>';
-            $res .= '<ul class="folders rename_parent_folder_select"><li class="rename_parent_title"><a href="#" class="close">';
-            $res .= $this->trans('Cancel').'</a></li></ul>';
-            $res .= '<input type="hidden" value="" id="rename_parent_source" />';
-
-            $res .= '<input type="hidden" value="" id="rename_source" />';
-            $res .= ' <input type="button" id="rename_folder" value="'.$this->trans('Rename').'" />';
-            $res .= '</div>';
+            $res = '<div class="row m-0 px-3 mt-3">
+                        <div data-target=".rename_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                            <a href="#" class="pe-auto">'.$this->trans('Rename a Folder').'</a>
+                        </div>
+                        <div class="rename_dialog folder_dialog col-lg-4 col-md-6 col-sm-12 py-3 px-0">
+                            <div class="folder_row">
+                                <a href="#" class="select_rename_folder">'.$this->trans('Select Folder').'</a>: 
+                                <span class="selected_rename"></span>
+                            </div>
+                            <div class="form-floating mb-3">
+                                <input id="rename_value" type="text" class="form-control" value="" placeholder="'.$this->trans('New Folder Name').'">
+                                <label for="rename_value">'.$this->trans('New Folder Name').'</label>
+                            </div>
+                            <ul class="folders rename_folder_select">
+                                <li class="rename_title">
+                                    <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                                </li>
+                            </ul>
+                            <div class="folder_row">
+                                <a href="#" class="select_rename_parent_folder">'.$this->trans('Select Parent Folder (optional)').'</a>: 
+                                <span class="selected_rename_parent"></span>
+                            </div>
+                            <ul class="folders rename_parent_folder_select">
+                                <li class="rename_parent_title">
+                                    <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                                </li>
+                            </ul>
+                            <input type="hidden" value="" id="rename_parent_source" />
+                            <input type="hidden" value="" id="rename_source" />
+                            <input type="button" id="rename_folder" class="btn btn-success" value="'.$this->trans('Rename').'">
+                        </div>
+                    </div>';
+
             return $res;
         }
     }
@@ -422,24 +447,38 @@ protected function output() {
         if ($this->get('folder_server') === NULL) {
             return;
         }
+
         $sent_folder = $this->get('sent_folder', $this->trans('Not set'));
         if (!$sent_folder) {
             $sent_folder = $this->trans('Not set');
         }
-        $res = '<div data-target=".sent_folder_dialog" class="settings_subtitle">'.$this->trans('Sent Folder');
-        $res .= ':<span id="sent_val">'.$sent_folder.'</span></div>';
-        $res .= '<div class="folder_dialog sent_folder_dialog">';
-        $res .= '<div class="folder_row">';
-        $res .= '<div class="sp_description">'.$this->trans('If set, a copy of outbound mail sent with a profile '.
-            'tied to this IMAP account, will be saved in this folder').'</div>';
-        $res .= '</div><div class="folder_row"><a href="#" class="select_sent_folder">';
-        $res .= $this->trans('Select Folder').'</a>: <span class="selected_sent"></span></div>';
-        $res .= '<ul class="folders sent_folder_select"><li class="sent_title"><a href="#" class="close">';
-        $res .= $this->trans('Cancel').'</a></li></ul>';
-        $res .= '<input type="hidden" value="" id="sent_source" />';
-        $res .= ' <input type="button" id="set_sent_folder" value="'.$this->trans('Update').'" /> ';
-        $res .= ' <input type="button" id="clear_sent_folder" value="'.$this->trans('Remove').'" /><br /><br />';
-        $res .= '</div>';
+
+        $res = '<div class="row m-0 px-3 mt-3">';
+        $res .= '<div data-target=".sent_folder_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                    <a href="#" class="pe-auto">'.$this->trans('Sent Folder').':<span id="sent_val">'.$sent_folder.'</span></a>
+                </div>';
+        $res .= '<div class="folder_dialog sent_folder_dialog col-lg-6 col-md-6 col-sm-12 py-3 px-0">
+                    <div class="folder_row">
+                        <div class="sp_description">'.$this->trans('If set, a copy of outbound mail sent with a profile tied to this IMAP account, will be saved in this folder').'</div>
+                    </div>
+                    <div class="folder_row">
+                        <a href="#" class="select_sent_folder">'.$this->trans('Select Folder').'</a>: 
+                        <span class="selected_sent"></span>
+                    </div>
+                    <ul class="folders sent_folder_select" style="z-index: 10">
+                        <li class="sent_title">
+                            <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                        </li>
+                    </ul>
+                    <input type="hidden" value="" id="sent_source" />
+                    <div class="btn-group mt-3" role="group" aria-label="Sent Folder Actions">
+                        <input type="button" id="set_sent_folder" class="btn btn-success" value="'.$this->trans('Update').'" /> 
+                        <input type="button" id="clear_sent_folder" class="btn btn-secondary" value="'.$this->trans('Remove').'" />
+                    </div>
+                    <br /><br />
+                </div>
+            </div>';
+
         return $res;
     }
 }
@@ -452,23 +491,38 @@ protected function output() {
         if ($this->get('folder_server') === NULL) {
             return;
         }
+
         $archive_folder = $this->get('archive_folder', $this->trans('Not set'));
         if (!$archive_folder) {
             $archive_folder = $this->trans('Not set');
         }
-        $res = '<div data-target=".archive_folder_dialog" class="settings_subtitle">'.$this->trans('Archive Folder');
-        $res .= ':<span id="archive_val">'.$archive_folder.'</span></div>';
-        $res .= '<div class="folder_dialog archive_folder_dialog">';
-        $res .= '<div class="folder_row">';
-        $res .= '<div class="sp_description">'.$this->trans('If set, archived messages for this account will be moved to this folder').'</div>';
-        $res .= '</div><div class="folder_row"><a href="#" class="select_archive_folder">';
-        $res .= $this->trans('Select Folder').'</a>: <span class="selected_archive"></span></div>';
-        $res .= '<ul class="folders archive_folder_select"><li class="archive_title"><a href="#" class="close">';
-        $res .= $this->trans('Cancel').'</a></li></ul>';
-        $res .= '<input type="hidden" value="" id="archive_source" />';
-        $res .= ' <input type="button" id="set_archive_folder" value="'.$this->trans('Update').'" /> ';
-        $res .= ' <input type="button" id="clear_archive_folder" value="'.$this->trans('Remove').'" /><br /><br />';
-        $res .= '</div>';
+
+        $res = '<div class="row m-0 px-3 mt-3">';
+        $res .= '<div data-target=".archive_folder_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                    <a href="#" class="pe-auto">'.$this->trans('Archive Folder').':<span id="archive_val">'.$archive_folder.'</span></a>
+                </div>';
+        $res .= '<div class="folder_dialog archive_folder_dialog col-lg-6 col-md-6 col-sm-12 py-3 px-0">
+                    <div class="folder_row">
+                        <div class="sp_description">'.$this->trans('If set, archived messages for this account will be moved to this folder').'</div>
+                    </div>
+                    <div class="folder_row">
+                        <a href="#" class="select_archive_folder">'.$this->trans('Select Folder').'</a>: 
+                        <span class="selected_archive"></span>
+                    </div>
+                    <ul class="folders archive_folder_select" style="z-index : 10">
+                        <li class="archive_title">
+                            <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                        </li>
+                    </ul>
+                    <input type="hidden" value="" id="archive_source" />
+                    <div class="btn-group mt-3" role="group" aria-label="Archive Folder Actions">
+                        <input type="button" id="set_archive_folder" class="btn btn-success" value="'.$this->trans('Update').'" /> 
+                        <input type="button" id="clear_archive_folder" class="btn btn-secondary" value="'.$this->trans('Remove').'" />
+                    </div>
+                    <br /><br />
+                </div>
+            </div>';
+
         return $res;
     }
 }
@@ -481,23 +535,38 @@ protected function output() {
         if ($this->get('folder_server') === NULL) {
             return;
         }
+
         $draft_folder = $this->get('draft_folder', $this->trans('Not set'));
         if (!$draft_folder) {
             $draft_folder = $this->trans('Not set');
         }
-        $res = '<div data-target=".draft_folder_dialog" class="settings_subtitle">'.$this->trans('Draft Folder');
-        $res .= ':<span id="draft_val">'.$draft_folder.'</span></div>';
-        $res .= '<div class="folder_dialog draft_folder_dialog">';
-        $res .= '<div class="folder_row">';
-        $res .= '<div class="sp_description">'.$this->trans('If set, drafts will be saved in this folder').'</div>';
-        $res .= '</div><div class="folder_row"><a href="#" class="select_draft_folder">';
-        $res .= $this->trans('Select Folder').'</a>: <span class="selected_draft"></span></div>';
-        $res .= '<ul class="folders draft_folder_select"><li class="draft_title"><a href="#" class="close">';
-        $res .= $this->trans('Cancel').'</a></li></ul>';
-        $res .= '<input type="hidden" value="" id="draft_source" />';
-        $res .= ' <input type="button" id="set_draft_folder" value="'.$this->trans('Update').'" /> ';
-        $res .= ' <input type="button" id="clear_draft_folder" value="'.$this->trans('Remove').'" /><br /><br />';
-        $res .= '</div>';
+
+        $res = '<div class="row m-0 px-3 mt-3">';
+        $res .= '<div data-target=".draft_folder_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                    <a href="#" class="pe-auto">'.$this->trans('Draft Folder').':<span id="draft_val">'.$draft_folder.'</span></a>
+                </div>';
+        $res .= '<div class="folder_dialog draft_folder_dialog col-lg-6 col-md-6 col-sm-12 py-3 px-0">
+                    <div class="folder_row">
+                        <div class="sp_description">'.$this->trans('If set, drafts will be saved in this folder').'</div>
+                    </div>
+                    <div class="folder_row">
+                        <a href="#" class="select_draft_folder">'.$this->trans('Select Folder').'</a>: 
+                        <span class="selected_draft"></span>
+                    </div>
+                    <ul class="folders draft_folder_select">
+                        <li class="draft_title">
+                            <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                        </li>
+                    </ul>
+                    <input type="hidden" value="" id="draft_source" />
+                    <div class="btn-group mt-3" role="group" aria-label="Draft Folder Actions">
+                        <input type="button" id="set_draft_folder" class="btn btn-success" value="'.$this->trans('Update').'" /> 
+                        <input type="button" id="clear_draft_folder" class="btn btn-secondary" value="'.$this->trans('Remove').'" />
+                    </div>
+                    <br /><br />
+                </div>
+            </div>';
+
         return $res;
     }
 }
@@ -510,24 +579,35 @@ protected function output() {
         if ($this->get('folder_server') === NULL) {
             return;
         }
+
         $trash_folder = $this->get('trash_folder', $this->trans('Not set'));
         if (!$trash_folder) {
             $trash_folder = $this->trans('Not set');
         }
-        $res = '<div data-target=".trash_folder_dialog" class="settings_subtitle">'.$this->trans('Trash Folder');
-        $res .= ':<span id="trash_val">'.$trash_folder.'</span></div>';
+
+        $res = '<div class="row m-0 px-3 mt-3">';
+        $res .= '<div data-target=".trash_folder_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                    <a href="#" class="pe-auto">'.$this->trans('Trash Folder').':<span id="trash_val">'.$trash_folder.'</span></a>
+                </div>';
         $res .= '<input type="hidden" id="not_set_string" value="'.$this->trans('Not set').'" />';
-        $res .= '<div class="folder_dialog trash_folder_dialog">';
-        $res .= '<div class="sp_description">'.$this->trans('If set, deleted messages for this account '.
-            'will be moved to this folder').'</div>';
-        $res .= '<div class="folder_row"><a href="#" class="select_trash_folder">';
-        $res .= $this->trans('Select Folder').'</a>: <span class="selected_trash"></span></div>';
-        $res .= '<ul class="folders trash_folder_select"><li class="trash_title"><a href="#" class="close">';
-        $res .= $this->trans('Cancel').'</a></li></ul>';
-        $res .= '<input type="hidden" value="" id="trash_source" />';
-        $res .= ' <input type="button" id="set_trash_folder" value="'.$this->trans('Update').'" /> ';
-        $res .= ' <input type="button" id="clear_trash_folder" value="'.$this->trans('Remove').'" /><br /><br />';
-        $res .= '</div>';
+        $res .= '<div class="folder_dialog trash_folder_dialog col-lg-6 col-md-6 col-sm-12 py-3 px-0">
+                    <div class="sp_description">'.$this->trans('If set, deleted messages for this account will be moved to this folder').'</div>
+                    <div class="folder_row">
+                        <a href="#" class="select_trash_folder">'.$this->trans('Select Folder').'</a>: 
+                        <span class="selected_trash"></span>
+                    </div>
+                    <ul class="folders trash_folder_select" style="z-index : 10">
+                        <li class="trash_title">
+                            <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                        </li>
+                    </ul>
+                    <input type="hidden" value="" id="trash_source" />
+                    <div class="btn-group mt-1" role="group" aria-label="Trash Folder Actions">
+                        <input type="button" id="set_trash_folder" class="btn btn-success" value="'.$this->trans('Update').'" /> 
+                        <input type="button" id="clear_trash_folder" class="btn btn-secondary" value="'.$this->trans('Remove').'" />
+                    </div>
+                </div></div>';
+
         return $res;
     }
 }
@@ -540,23 +620,38 @@ protected function output() {
         if ($this->get('folder_server') === NULL) {
             return;
         }
+
         $junk_folder = $this->get('junk_folder', $this->trans('Not set'));
         if (!$junk_folder) {
             $junk_folder = $this->trans('Not set');
         }
-        $res = '<div data-target=".junk_folder_dialog" class="settings_subtitle">'.$this->trans('Junk Folder');
-        $res .= ':<span id="junk_val">'.$junk_folder.'</span></div>';
+
+        $res = '<div class="row m-0 px-3 mt-3">';
+        $res .= '<div data-target=".junk_folder_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                    <a href="#" class="pe-auto">'.$this->trans('Junk Folder').':<span id="junk_val">'.$junk_folder.'</span></a>
+                </div>';
+
         $res .= '<input type="hidden" id="not_set_string" value="'.$this->trans('Not set').'" />';
-        $res .= '<div class="folder_dialog junk_folder_dialog">';
-        $res .= '<div class="sp_description">'.$this->trans('If set, spams will be saved in this folder').'</div>';
-        $res .= '<div class="folder_row"><a href="#" class="select_junk_folder">';
-        $res .= $this->trans('Select Folder').'</a>: <span class="selected_junk"></span></div>';
-        $res .= '<ul class="folders junk_folder_select"><li class="junk_title"><a href="#" class="close">';
-        $res .= $this->trans('Cancel').'</a></li></ul>';
-        $res .= '<input type="hidden" value="" id="junk_source" />';
-        $res .= ' <input type="button" id="set_junk_folder" value="'.$this->trans('Update').'" /> ';
-        $res .= ' <input type="button" id="clear_junk_folder" value="'.$this->trans('Remove').'" /><br /><br />';
-        $res .= '</div>';
+        $res .= '<div class="folder_dialog junk_folder_dialog col-lg-6 col-md-6 col-sm-12 py-3 px-0">
+                    <div class="sp_description">'.$this->trans('If set, spams will be saved in this folder').'</div>
+                    <div class="folder_row">
+                        <a href="#" class="select_junk_folder">'.$this->trans('Select Folder').'</a>: 
+                        <span class="selected_junk"></span>
+                    </div>
+                    <ul class="folders junk_folder_select" style="z-index: 10">
+                        <li class="junk_title">
+                            <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                        </li>
+                    </ul>
+                    <input type="hidden" value="" id="junk_source" />
+                    <div class="btn-group mt-3" role="group" aria-label="Junk Folder Actions">
+                        <input type="button" id="set_junk_folder" class="btn btn-success" value="'.$this->trans('Update').'" /> 
+                        <input type="button" id="clear_junk_folder" class="btn btn-secondary" value="'.$this->trans('Remove').'" />
+                    </div>
+                    <br /><br />
+                </div>
+            </div>';
+
         return $res;
     }
 }
@@ -567,16 +662,29 @@ protected function output() {
 class Hm_Output_folders_create_dialog extends Hm_Output_Module {
     protected function output() {
         if ($this->get('folder_server') !== NULL) {
-            $res = '<div data-target=".create_dialog" class="settings_subtitle">'.$this->trans('Create a New Folder').'</div>';
-            $res .= '<div class="create_dialog folder_dialog">';
-            $res .= '<input class="create_folder_name" id="create_value" type="text" value="" placeholder="';
-            $res .= $this->trans('New Folder Name').'" /><br /><div class="folder_row"><a href="#" class="select_parent_folder">';
-            $res .= $this->trans('Select Parent Folder (optional)').'</a>: <span class="selected_parent"></span></div>';
-            $res .= '<ul class="folders parent_folder_select"><li class="parent_title"><a href="#" class="close">';
-            $res .= $this->trans('Cancel').'</a></li></ul>';
-            $res .= '<input type="hidden" value="" id="create_parent" />';
-            $res .= ' <input type="button" id="create_folder" value="'.$this->trans('Create').'" />';
-            $res .= '</div>';
+            $res = '<div class="row m-0 px-3 mt-3">
+                        <div data-target=".create_dialog" class="settings_subtitle col-12 border-bottom px-0">
+                            <a href="#" class="pe-auto">'.$this->trans('Create a New Folder').'</a>
+                        </div>
+                        <div class="create_dialog folder_dialog col-lg-4 col-md-6 col-sm-12 py-3 px-0">
+                            <div class="form-floating mb-3">
+                                <input class="form-control create_folder_name" id="create_value" type="text" value="" placeholder="'.$this->trans('New Folder Name').'">
+                                <label for="create_value">'.$this->trans('New Folder Name').'</label>
+                            </div>
+                            <div class="folder_row">
+                                <a href="#" class="select_parent_folder">'.$this->trans('Select Parent Folder (optional)').'</a>: 
+                                <span class="selected_parent"></span>
+                            </div>
+                            <ul class="folders parent_folder_select">
+                                <li class="parent_title">
+                                    <a href="#" class="close">'.$this->trans('Cancel').'</a>
+                                </li>
+                            </ul>
+                            <input type="hidden" value="" id="create_parent" />
+                            <input type="button" id="create_folder" class="btn btn-success mt-3" value="'.$this->trans('Create').'">
+                        </div>
+                    </div>';
+
             return $res;
         }
     }
diff --git a/modules/imap_folders/site.css b/modules/imap_folders/site.css
index 736e72ef98..2ea2004d31 100644
--- a/modules/imap_folders/site.css
+++ b/modules/imap_folders/site.css
@@ -1,12 +1,11 @@
-.folders_page { margin: 20px; }
-.folder_dialog { margin-left: 40px; margin-top: 10px; margin-bottom: 30px; }
-.folder_dialog input { display: inline-block; margin-top: 15px; }
-.sent_folder_select, .draft_folder_select, .trash_folder_select, .folder_dialog, .delete_folder_select, .rename_folder_select, .rename_parent_folder_select, .parent_folder_select, .archive_folder_select { display: none; }
+/* .folder_dialog { margin-left: 40px; margin-top: 10px; margin-bottom: 30px; } */
+/* .folder_dialog input { display: inline-block; margin-top: 15px; } */
+.sent_folder_select, .draft_folder_select, .trash_folder_select, .folder_dialog, .delete_folder_select, .rename_folder_select, .rename_parent_folder_select, .parent_folder_select, .archive_folder_select, .junk_folder_select { display: none; }
 .draft_folder_select, .sent_folder_select, .trash_folder_select, .delete_folder_select, .rename_folder_select, .rename_parent_folder_select, .parent_folder_select, .archive_folder_select { width: 215px; position: absolute; background-color: #fff; padding: 15px; border: solid 1px #ede8e6; font-weight: normal; padding-left: 10px; min-width: 55px; padding-top: 10px; margin-left: 0px !important; margin-top: 0px; }
 .folder_row { margin-top: 15px; }
 .close { margin-left: 10%; font-size: 100%; color: teal !important; }
 .sp_folder_title { font-size: 110%; color: #777; }
-.sp_description { padding-bottom: 20px; }
+/* .sp_description { padding-bottom: 20px; } */
 #draft_val, #sent_val, #trash_val, #junk_val { padding-left: 20px; }
 .manage_folder_icon { vertical-align: -3px; opacity: .3 }
 .manage_folder_link { color: #999 !important; }
diff --git a/modules/imap_folders/site.js b/modules/imap_folders/site.js
index 64170437cd..7d33448a35 100644
--- a/modules/imap_folders/site.js
+++ b/modules/imap_folders/site.js
@@ -246,7 +246,7 @@ var folder_page_create = function() {
 $(function() {
     if (hm_page_name() == 'folders') {
         $('#imap_server_folder').on("change", function() {
-            $(this).parent().submit();
+            $(this).parent().parent().submit();
         });
         $('.settings_subtitle').on("click", function() { return Hm_Utils.toggle_page_section($(this).data('target')); });
     }
diff --git a/modules/nasa/modules.php b/modules/nasa/modules.php
index f6aa30d77b..af30c1e48a 100644
--- a/modules/nasa/modules.php
+++ b/modules/nasa/modules.php
@@ -141,7 +141,7 @@ protected function output() {
             $res .= 'style="display: none;"';
         }
         $res .= '><div>Connect to NASA APIs</div>';
-        $res .= '<div><input type="text" size="50" class="nasa_api_key form-control" placeholder="'.$this->trans('Enter your API key').'" />';
+        $res .= '<div class="col-lg-4 col-sm-12"><input type="text" size="50" class="nasa_api_key form-control" placeholder="'.$this->trans('Enter your API key').'" /><br/>';
         $res .= '<input type="button" class="nasa_api_connect btn btn-secondary" value="'.$this->trans('Connect').'" /></div></div>';
         $res .= '<div class="nasa_connect_inner_2" ';
         if (!$this->get('nasa_api_key')) {
diff --git a/modules/nux/modules.php b/modules/nux/modules.php
index 22bb663c59..3b9cb83569 100644
--- a/modules/nux/modules.php
+++ b/modules/nux/modules.php
@@ -291,7 +291,7 @@ protected function output() {
             '<input type="text" id="nux_account_name" class="form-control nux_account_name" placeholder="'.$this->trans('Account Name [optional]').'">'.
             '<label for="nux_account_name">'.$this->trans('Account name').'</label></div>'.
 
-            '<input type="button" class="nux_next_button btn btn-primary btn-md px-5" value="'.$this->trans('Next').'">'.
+            '<input type="button" class="nux_next_button btn btn-success btn-md px-5" value="'.$this->trans('Next').'">'.
             '</div></div></div><div class="nux_step_two px-4 pt-3"></div></div>';
     }
 }
@@ -479,7 +479,7 @@ function credentials_form($details, $mod) {
         $res .= '<label for="nux_password">'.$mod->trans('E-mail Password').'</label></div>';
     
         // Connect Button
-        $res .= '<input type="button" class="nux_submit px-5 btn btn-primary me-3" value="'.$mod->trans('Connect').'">';
+        $res .= '<input type="button" class="nux_submit px-5 btn btn-success me-3" value="'.$mod->trans('Connect').'">';
     
         // Reset Link
         $res .= '<a href="" class="reset_nux_form px-5 btn btn-secondary">Reset</a>';
diff --git a/modules/pop3/modules.php b/modules/pop3/modules.php
index 0969605f84..bceff97ab8 100644
--- a/modules/pop3/modules.php
+++ b/modules/pop3/modules.php
@@ -747,7 +747,7 @@ protected function output() {
             '<input required type="number" id="new_pop3_port" name="new_pop3_port" class="port_fld form-control" value="995" placeholder="'.$this->trans('Port').'"></td></tr>'.
             '<tr><td><input type="radio" name="tls" value="1" id="pop3_tls" checked="checked" class="form-check-input" /> <label for="pop3_tls">'.$this->trans('Use TLS').'</label>'.
             '<br /><input type="radio" name="tls" value="0" id="pop3_notls" class="form-check-input"><abel for="pop3_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
-            '</tr><tr><td><input class="btn btn-primary  btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_pop3_server" /></td></tr>'.
+            '</tr><tr><td><input class="btn btn-success  btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_pop3_server" /></td></tr>'.
             '</table></form>';
     }
 }
diff --git a/modules/smtp/modules.php b/modules/smtp/modules.php
index 5583028e11..49f1b7c53d 100644
--- a/modules/smtp/modules.php
+++ b/modules/smtp/modules.php
@@ -1273,7 +1273,7 @@ protected function output() {
                                 </div>
 
                                 <div class="">
-                                    <input class="btn btn-primary px-5" type="submit" value="'.$this->trans('Add').'" name="submit_smtp_server" />
+                                    <input class="btn btn-success px-5" type="submit" value="'.$this->trans('Add').'" name="submit_smtp_server" />
                                 </div>
                             </form>
                         </div>';

From 1e53053e0fdf320897597ddffd93182aa99317ef Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Tue, 12 Dec 2023 13:14:47 +0200
Subject: [PATCH 06/13] Style migration of the Profile component in bootstrap 5

---
 modules/core/site.css        |   2 +-
 modules/profiles/modules.php | 131 +++++++++++++++++++++--------------
 modules/profiles/site.css    |  11 ---
 3 files changed, 79 insertions(+), 65 deletions(-)

diff --git a/modules/core/site.css b/modules/core/site.css
index b06cc11dd5..23a44aefcf 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -222,7 +222,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .mobile .folder_list li { padding-top: 5px; padding-bottom: 5px; }
 .mobile .src_name { padding-top: 20px; padding-bottom: 20px; }
 .mobile .content_cell { padding-top: 60px; display: block; width: 100%; }
-.mobile .content_title { z-index: 100; top: 0px; background-color: #fff; position: fixed; padding-left: 45px; padding-top: 20px; margin-bottom: 5px; left: 0px; right: 0px; padding-bottom: 17px; display: flex; flex-flow: row wrap; max-height: 35rem;}
+.mobile .content_title { z-index: 100; top: 0px; background-color: #fff; position: fixed; padding-left: 45px !important; padding-top: 20px; margin-bottom: 5px; left: 0px; right: 0px; padding-bottom: 17px; display: flex; flex-flow: row wrap; max-height: 35rem;}
 .mobile .account_icon { width: 16px; height: 16px; vertical-align: -5px; }
 .mobile .folder_toggle { display: block; top: 0px; left: -3px; }
 .mobile .folder_toggle img { width: 24px; height: 32px; margin-top: -7px; }
diff --git a/modules/profiles/modules.php b/modules/profiles/modules.php
index c0f102b346..f323ae72e8 100644
--- a/modules/profiles/modules.php
+++ b/modules/profiles/modules.php
@@ -165,7 +165,7 @@ public function process() {
 class Hm_Output_profile_edit_form extends Hm_Output_Module {
     protected function output() {
         $new_id = $this->get('new_profile_id', -1);
-        $res = '<div class="profile_content"><div class="content_title">'.$this->trans('Profiles');
+        $res = '<div class="profile_content p-0"><div class="content_title px-3 d-flex justify-content-between"><span>'.$this->trans('Profiles').'</span>';
         $smtp_servers = $this->get('smtp_servers', array());
         $imap_servers = $this->get('imap_servers', array());
         if ($this->get('edit_profile')) {
@@ -256,15 +256,15 @@ protected function output() {
         $res = '';
         if (count($profiles) > 0) {
             $smtp_servers = $this->get('smtp_servers', array());
-            $res .= '<table class="profile_details" style="display: block;overflow-x: auto;white-space: nowrap;"><tr>'.
+            $res .= '<div class="p-3"><table class="table table-striped"><tr>'.
                 '<th>'.$this->trans('Display Name').'</th>'.
-                '<th class="profile_fld">'.$this->trans('IMAP Server').'</th>'.
-                '<th class="profile_fld">'.$this->trans('Username').'</th>'.
-                '<th class="profile_fld">'.$this->trans('E-mail Address').'</th>'.
-                '<th class="profile_fld">'.$this->trans('Reply-to').'</th>'.
-                '<th class="profile_fld">'.$this->trans('SMTP Server').'</th>'.
-                '<th class="profile_fld">'.$this->trans('Signature').'</th>'.
-                '<th class="profile_fld">'.$this->trans('Default').'</th>'.
+                '<th class="d-none d-sm-table-cell">'.$this->trans('IMAP Server').'</th>'.
+                '<th class="d-none d-sm-table-cell">'.$this->trans('Username').'</th>'.
+                '<th class="d-none d-sm-table-cell">'.$this->trans('E-mail Address').'</th>'.
+                '<th class="d-none d-sm-table-cell">'.$this->trans('Reply-to').'</th>'.
+                '<th class="d-none d-sm-table-cell">'.$this->trans('SMTP Server').'</th>'.
+                '<th class="d-none d-sm-table-cell">'.$this->trans('Signature').'</th>'.
+                '<th class="d-none d-sm-table-cell">'.$this->trans('Default').'</th>'.
                 '<th></th></tr>';
 
             foreach ($profiles as $id => $profile) {
@@ -274,21 +274,21 @@ protected function output() {
                     }
                 $res .= '<tr>'.
                     '<td>'.$this->html_safe($profile['name']).'</td>'.
-                    '<td class="profile_fld">'.$this->html_safe($profile['server']).'</td>'.
-                    '<td class="profile_fld">'.$this->html_safe($profile['user']).'</td>'.
-                    '<td class="profile_fld">'.$this->html_safe($profile['address']).'</td>'.
-                    '<td class="profile_fld">'.$this->html_safe($profile['replyto']).'</td>'.
-                    '<td class="profile_fld">'.$this->html_safe($smtp).'</td>'.
-                    '<td class="profile_fld">'.(strlen($profile['sig']) > 0 ? $this->trans('Yes') : $this->trans('No')).'</td>'.
-                    '<td class="profile_fld">'.($profile['default'] ? $this->trans('Yes') : $this->trans('No')).'</td>'.
-                    '<td><a href="?page=profiles&amp;profile_id='.$this->html_safe($id).'" title="'.$this->trans('Edit').'">'.
-                    '<img alt="'.$this->trans('Edit').'" width="16" height="16" src="'.Hm_Image_Sources::$cog.'" /></a></td>'.
+                    '<td class="d-none d-sm-table-cell">'.$this->html_safe($profile['server']).'</td>'.
+                    '<td class="d-none d-sm-table-cell">'.$this->html_safe($profile['user']).'</td>'.
+                    '<td class="d-none d-sm-table-cell">'.$this->html_safe($profile['address']).'</td>'.
+                    '<td class="d-none d-sm-table-cell">'.$this->html_safe($profile['replyto']).'</td>'.
+                    '<td class="d-none d-sm-table-cell">'.$this->html_safe($smtp).'</td>'.
+                    '<td class="d-none d-sm-table-cell">'.(strlen($profile['sig']) > 0 ? $this->trans('Yes') : $this->trans('No')).'</td>'.
+                    '<td class="d-none d-sm-table-cell">'.($profile['default'] ? $this->trans('Yes') : $this->trans('No')).'</td>'.
+                    '<td class="text-right"><a href="?page=profiles&amp;profile_id='.$this->html_safe($id).'" title="'.$this->trans('Edit').'">'.
+                    '<i class="bi bi-gear-fill"></i></a></td>'.
                     '</tr>';
             }
-            $res .= '</table>';
+            $res .= '</table></div>';
         }
         else {
-            $res .= '<div class="profiles_empty">'.$this->trans('No Profiles Found').'</div>';
+            $res .= '<div class="d-flex flex-column align-items-center justify-content-center p-5 mt-5"><i class="bi bi-folder2-open fs-4"></i><span>'.$this->trans('No Profiles Found').'</span></div>';
         }
         $res .= '</div>';
         return $res;
@@ -302,53 +302,78 @@ protected function output() {
 function profile_form($form_vals, $id, $smtp_servers, $imap_servers, $out_mod) {
     $res = '';
     if ($form_vals['name']) {
-        $res .= '<img class="path_delim" src="'.Hm_Image_Sources::$caret.'" alt="&gt;" width="8" height="8" />';
+        $res .= '<span>';
+        $res .= '<i class="bi bi-caret-right-fill"></i>';
         $res .= $out_mod->html_safe($form_vals['name']);
+        $res .= '</span>';
     }
     else {
-        $res .= '<img class="refresh_list add_profile" width="24" height="24" src="'.
-            Hm_Image_Sources::$plus.'" title="'.$out_mod->trans('Add a profile').'" alt="'.$out_mod->trans('Add a profile').'" />';
+        $res .= '<button class="refresh_list add_profile btn btn-light btn-sm d-flex" title="'.$out_mod->trans('Add a profile').'"><i class="bi bi-plus"></i><span class="d-none d-sm-table-cell">'.$out_mod->trans('Add a profile').'</span></button>';
     }
-    $res .= '</div><div class="edit_profile" '.($form_vals['name'] ? '' : 'style="display: none;"').'><form method="post" action="?page=profiles">';
+    $res .= '</div>';
+
+    $res .= '<div class="edit_profile row p-3" '.($form_vals['name'] ? '' : 'style="display: none;"').'><div class="col-12 col-lg-5">';
+
+    $res .= '<form method="post" action="?page=profiles">';
     $res .= '<input type="hidden" name="profile_id" value="'.$out_mod->html_safe($id).'" />';
     $res .= '<input type="hidden" name="hm_page_key" value="'.$out_mod->html_safe(Hm_Request_Key::generate()).'" />';
-    $res .= '<table><tr><th>'.$out_mod->trans('Display Name').' *</th><td><input type="text" required name="profile_name" value="'.$out_mod->html_safe($form_vals['name']).'" /></td></tr>';
-    $res .= '<tr><th>'.$out_mod->trans('E-mail Address').' *</th><td><input type="email" required name="profile_address" value="'.$out_mod->html_safe($form_vals['address']).'" /></td></tr>';
-    $res .= '<tr><th>'.$out_mod->trans('Reply-to').' *</th><td><input type="email" required name="profile_replyto" value="'.$out_mod->html_safe($form_vals['replyto']).'" /></td></tr>';
-    $res .= '<tr><th>'.$out_mod->trans('IMAP Server').' *</th><td><select required name="profile_imap">';
+
+    // Display Name
+    $res .= '<div class="form-floating mb-3">';
+    $res .= '<input type="text" required name="profile_name" class="form-control" value="'.$out_mod->html_safe($form_vals['name']).'" placeholder="'.$out_mod->trans('Display Name').' *">';
+    $res .= '<label>'.$out_mod->trans('Display Name').' *</label></div>';
+
+    // Email Address
+    $res .= '<div class="form-floating mb-3">';
+    $res .= '<input type="email" required name="profile_address" class="form-control" value="'.$out_mod->html_safe($form_vals['address']).'" placeholder="'.$out_mod->trans('E-mail Address').' *">';
+    $res .= '<label>'.$out_mod->trans('E-mail Address').' *</label></div>';
+
+    // Reply-to
+    $res .= '<div class="form-floating mb-3">';
+    $res .= '<input type="email" required name="profile_replyto" class="form-control" value="'.$out_mod->html_safe($form_vals['replyto']).'" placeholder="'.$out_mod->trans('Reply-to').' *">';
+    $res .= '<label>'.$out_mod->trans('Reply-to').' *</label></div>';
+
+    // IMAP Server
+    $res .= '<div class="form-floating mb-3">';
+    $res .= '<select required name="profile_imap" class="form-select">';
     foreach ($imap_servers as $id => $server) {
-        $res .= '<option ';
-        if ($server['user'] == $form_vals['user'] && $server['server'] == $form_vals['server']) {
-            $res .= 'selected="selected"';
-        }
-        $res .= 'value="'.$out_mod->html_safe($server['server'].'|'.$server['user']).'">'.$out_mod->html_safe($server['name']).'</option>';
+        $res .= '<option '.(($server['user'] == $form_vals['user'] && $server['server'] == $form_vals['server']) ? 'selected="selected"' : '').' value="'.$out_mod->html_safe($server['server'].'|'.$server['user']).'">'.$out_mod->html_safe($server['name']).'</option>';
     }
-    $res .= '</select></td></tr>';
-    $res .= '<tr><th>'.$out_mod->trans('SMTP Server').' *</th><td><select required name="profile_smtp">';
+    $res .= '</select>';
+    $res .= '<label>'.$out_mod->trans('IMAP Server').' *</label></div>';
+
+    // SMTP Server
+    $res .= '<div class="form-floating mb-3">';
+    $res .= '<select required name="profile_smtp" class="form-select">';
     foreach ($smtp_servers as $id => $server) {
-        $res .= '<option ';
-        if ($id == $form_vals['smtp_id']) {
-            $res .= 'selected="selected"';
-        }
-        $res .= 'value="'.$out_mod->html_safe($id).'">'.$out_mod->html_safe($server['name']).'</option>';
-    }
-    $res .= '</select></td></tr>';
-    $res .= '<tr><th>'.$out_mod->trans('Signature').'</th><td><textarea cols="80" rows="4" name="profile_sig">';
-    $res .= $out_mod->html_safe($form_vals['sig']).'</textarea></td></tr>';
-    $res .= '<tr><th>'.$out_mod->trans('Set as default').'</th><td><input type="checkbox" ';
-    if ($form_vals['default']) {
-        $res .= 'checked="checked"';
+        $res .= '<option '.(($id == $form_vals['smtp_id']) ? 'selected="selected"' : '').' value="'.$out_mod->html_safe($id).'">'.$out_mod->html_safe($server['name']).'</option>';
     }
-    $res .= 'name="profile_default" /></td></tr><tr><td></td><td>';
+    $res .= '</select>';
+    $res .= '<label>'.$out_mod->trans('SMTP Server').' *</label></div>';
+
+    // Signature
+    $res .= '<div class="form-floating mb-3">';
+    $res .= '<textarea cols="80" rows="4" name="profile_sig" class="form-control" style="min-height : 120px" placeholder="'.$out_mod->trans('Signature').'">'.$out_mod->html_safe($form_vals['sig']).'</textarea>';
+    $res .= '<label>'.$out_mod->trans('Signature').'</label></div>';
+
+    // Set as default
+    $res .= '<div class="form-check mb-3">';
+    $res .= '<input type="checkbox" class="form-check-input" '.($form_vals['default'] ? 'checked="checked"' : '').' name="profile_default">';
+    $res .= '<label class="form-check-label">'.$out_mod->trans('Set as default').'</label></div>';
+
+    // Submit buttons
+    $res .= '<div>';
     if ($form_vals['name']) {
-        $res .= '<input type="submit" class="profile_update" value="'.$out_mod->trans('Update').'" /> ';
-        $res .= '<input type="submit" name="profile_delete" value="'.$out_mod->trans('Delete').'" /> ';
-        $res .= '<a href="?page=profiles"><input type="button" value="'.$out_mod->trans('Cancel').'" /></a>';
+        $res .= '<input type="submit" class="btn btn-success profile_update" value="'.$out_mod->trans('Update').'" /> ';
+        $res .= '<input type="submit" class="btn btn-danger" name="profile_delete" value="'.$out_mod->trans('Delete').'" /> ';
+        $res .= '<a href="?page=profiles" class="btn btn-secondary">'.$out_mod->trans('Cancel').'</a>';
     }
     else {
-        $res .= '<input type="submit" class="submit_profile" value="'.$out_mod->trans('Create').'" />';
+        $res .= '<input type="submit" class="btn btn-success submit_profile" value="'.$out_mod->trans('Create').'" />';
     }
-    $res .= '</td></tr></table></form>';
+    $res .= '</div></form></div>';
+
     return $res;
+
 }}
 
diff --git a/modules/profiles/site.css b/modules/profiles/site.css
index 012fa50890..e69de29bb2 100644
--- a/modules/profiles/site.css
+++ b/modules/profiles/site.css
@@ -1,11 +0,0 @@
-.profile_details { padding-left: 30px; margin-top: 20px; }
-.profile_details th { color: #666; padding: 5px; padding-bottom: 2px; border-bottom: solid 1px #eee; font-weight: normal; text-align: left; }
-.profile_details td { padding: 10px; }
-.profile_details td img { opacity: .6; }
-.edit_profile table { width: 20%; padding: 20px; }
-.edit_profile table th { white-space: nowrap; font-weight: normal; text-align: left; vertical-align: top; padding-right: 10px; }
-.edit_profile table th, .edit_profile table td { padding-bottom: 10px; }
-/* .compose_sign { cursor: pointer; margin-left: 10px; float: right; margin-top: 10px; } */
-.profiles_empty { text-align: center; padding-top: 100px; color: #666; }
-.mobile .profile_fld { display: none; }
-.add_profile { position: absolute; top: 10px; right: 10px; }

From dabf3a7b945150aece5eda2795782766e7d965a7 Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Tue, 12 Dec 2023 16:11:25 +0200
Subject: [PATCH 07/13] Style migration of the Message highlighting component
 in bootstrap 5

---
 modules/highlights/modules.php | 100 ++++++++++++++++++++++++---------
 modules/highlights/site.css    |   9 ---
 modules/highlights/site.js     |   8 +--
 3 files changed, 76 insertions(+), 41 deletions(-)

diff --git a/modules/highlights/modules.php b/modules/highlights/modules.php
index 2c7bf538f6..4491c7affb 100644
--- a/modules/highlights/modules.php
+++ b/modules/highlights/modules.php
@@ -183,12 +183,12 @@ protected function output() {
             'Background' => 'background'
         );
         $res = '<div class="content_title">'.$this->trans('Message highlighting').'</div>';
-        $res .= '<div class="settings_subtitle">'.$this->trans('Existing rules').'</div>';
+        $res .= '<div class="settings_subtitle mt-3 mb-2"><b>'.$this->trans('Existing rules').'</b></div>';
         if (!$rules) {
             $res .= '<div class="empty_list">'.$this->trans('No rules').'</div>';
         }
         else {
-            $res .= '<table class="hl_rules">'.
+            $res .= '<div class="px-3"><table class="hl_rules table table-striped">'.
                 '<th>'.$this->trans('Type').'</th>'.
                 '<th>'.$this->trans('Target').'</th>'.
                 '<th>'.$this->trans('Color').'</th>'.
@@ -226,59 +226,103 @@ protected function output() {
                     '</tr>';
             }
         }
-        $res .= '</table><div class="settings_subtitle">'.$this->trans('Add a new rule').'</div>';
-        $res .= '<div class="add_hl_form"><form method="POST"><table>';
-        $res .= '<tr><td>'.$this->trans('Source type').'</td>';
-        $res .= '<td><select name="hl_source_type" required class="hl_source_type"><option selected="selected"></option>';
+        $res .= '</table></div>';
+        
+        $res .= '<div class="settings_subtitle mt-3"><b>'.$this->trans('Add a new rule').'</b></div>';
+        $res .= '<div class="col-12 col-lg-5 mt-2">';
+        $res .= '<form method="POST">';
+
+        // Source Type
+        $res .= '<div class="form-floating mb-3">';
+        $res .= '<select name="hl_source_type" required class="form-select hl_source_type">';
+        $res .= '<option selected="selected">'.$this->trans('Select source type').'</option>';
         foreach ($source_types as $name => $val) {
             $res .= '<option value="'.$this->html_safe($val).'">'.$this->trans($name).'</option>';
         }
-        $res .= '</select></td></tr>';
+        $res .= '</select>';
+        $res .= '<label>'.$this->trans('Source type').'</label></div>';
 
+        // IMAP Flags
         if ($sources['imap']) {
-            $res .= '<tr class="imap_row"><td>'.$this->trans('Flags').
-                '</td><td><select name="hl_imap_flags[]" size="4" multiple="multiple" class="imap_flags">';
+            $res .= '<div class="form-floating mb-3 imap_row d-none">';
+            $res .= '<select style="min-height: 8rem" name="hl_imap_flags[]" size="4" multiple="multiple" class="form-select imap_flags">';
             foreach ($email_types as $index => $value) {
                 $res .= '<option value="'.$this->html_safe($value).'">'.$this->trans($index).'</option>';
             }
-            $res .= '</select></td></tr>';
-            $res .= '<tr class="imap_row"><td>'.$this->trans('Accounts').
-                '</td><td><select name="hl_imap_sources[]" size="4" multiple="multiple" class="imap_source">';
+            $res .= '</select>';
+            $res .= '<label>'.$this->trans('Flags').'</label></div>';
+
+            // IMAP Accounts
+            $res .= '<div class="form-floating mb-3 imap_row d-none">';
+            $res .= '<select style="min-height: 8rem" name="hl_imap_sources[]" size="4" multiple="multiple" class="form-select imap_source">';
             foreach ($sources['imap'] as $index => $vals) {
                 $res .= '<option value="'.$this->html_safe($index).'">'.$this->trans($vals['name']).'</option>';
             }
-            $res .= '</select></td></tr>';
+            $res .= '</select>';
+            $res .= '<label>'.$this->trans('Accounts').'</label></div>';
         }
+
+        // Feeds
         if ($sources['feeds']) {
-            $res .= '<tr class="feeds_row"><td>'.$this->trans('Feeds').
-                '</td><td><select name="hl_feeds_sources[]" size="4" multiple="multiple" class="feeds_source">';
+            // Feeds Sources
+            $res .= '<div class="form-floating mb-3 feeds_row d-none">';
+            $res .= '<select style="min-height: 8rem" name="hl_feeds_sources[]" size="4" multiple="multiple" class="form-select feeds_source">';
             foreach ($sources['feeds'] as $index => $vals) {
                 $res .= '<option value="'.$this->html_safe($index).'">'.$this->trans($vals['name']).'</option>';
             }
-            $res .= '</select></td></tr>';
-            $res .= '<tr class="feeds_row"><td>'.$this->trans('Unseen').'</td><td><input name="hl_feeds_unseen" type="checkbox" value="true" /></td></tr>';
+            $res .= '</select>';
+            $res .= '<label>'.$this->trans('Feeds').'</label></div>';
+
+            // Unseen Feeds
+            $res .= '<div class="form-check mb-3 feeds_row d-none">';
+            $res .= '<input name="hl_feeds_unseen" type="checkbox" value="true" class="form-check-input" />';
+            $res .= '<label class="form-check-label">'.$this->trans('Unseen').'</label></div>';
         }
+
+        // GitHub
         if ($sources['github']) {
-            $res .= '<tr class="github_row"><td>'.$this->trans('Repos').
-                '</td><td><select name="hl_github_sources[]" size="4" multiple="multiple" class="github_source">';
+            // GitHub Repos
+            $res .= '<div class="form-floating mb-3 github_row d-none">';
+            $res .= '<select style="min-height: 8rem" name="hl_github_sources[]" size="4" multiple="multiple" class="form-select github_source">';
             foreach ($sources['github'] as $repo) {
                 $res .= '<option value="'.$this->html_safe($repo).'">'.$this->trans($repo).'</option>';
             }
-            $res .= '</select></td></tr>';
-            $res .= '<tr class="github_row"><td>'.$this->trans('Unseen').'</td><td><input name="hl_github_unseen" type="checkbox" value="true" /></td></tr>';
+            $res .= '</select>';
+            $res .= '<label>'.$this->trans('Repos').'</label></div>';
+
+            // Unseen GitHub
+            $res .= '<div class="form-check mb-3 github_row d-none">';
+            $res .= '<input name="hl_github_unseen" type="checkbox" value="true" class="form-check-input" />';
+            $res .= '<label class="form-check-label">'.$this->trans('Unseen').'</label></div>';
         }
-        $res .= '<tr><td>'.$this->trans('Highlight target').'</td>';
-        $res .= '<td><select name="hl_target">';
+
+        // Highlight Target
+        $res .= '<div class="form-floating mb-3">';
+        $res .= '<select name="hl_target" class="form-select">';
         foreach ($targets as $name => $val) {
             $res .= '<option value="'.$this->html_safe($val).'">'.$this->trans($name).'</option>';
         }
-        $res .= '</select></td></tr>';
-        $res .= '<tr><td>'.$this->trans('Highlight color').'</td><td><input name="hl_color" type="color" /></td></tr>';
-        $res .= '<tr><td>'.$this->trans('CSS override').'</td><td><input value="true" type="checkbox" name="hl_important" /></td></tr>';
-        $res .= '<tr><td></td><td class="submit_row"><input type="submit" value="'.$this->trans('Add').'" />';
+        $res .= '</select>';
+        $res .= '<label>'.$this->trans('Highlight target').'</label></div>';
+
+        // Highlight Color
+        $res .= '<div class="mb-3">';
+        $res .= '<label>'.$this->trans('Highlight color').'</label>';
+        $res .= '<input style="min-height: 3rem" name="hl_color" type="color" class="form-control p-1" /></div>';
+
+        // CSS Override
+        $res .= '<div class="form-check mb-3">';
+        $res .= '<input value="true" type="checkbox" name="hl_important" class="form-check-input" />';
+        $res .= '<label class="form-check-label">'.$this->trans('CSS override').'</label></div>';
+
+        // Submit Button
+        $res .= '<div class="submit_row">';
+        $res .= '<input type="submit" value="'.$this->trans('Add').'" class="btn btn-success px-5" />';
         $res .= '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />';
-        $res .= '</td></tr></table></form></div>';
+        $res .= '</div></form></div>';
+
         return $res;
+
     }
 }
 
diff --git a/modules/highlights/site.css b/modules/highlights/site.css
index 83732a0190..e69de29bb2 100644
--- a/modules/highlights/site.css
+++ b/modules/highlights/site.css
@@ -1,9 +0,0 @@
-.add_hl_form {padding-left: 30px; padding-top: 10px; max-width: 340px;}
-.add_hl_form td {padding: 10px;}
-.submit_row {padding-top: 20px;}
-.github_source, .imap_source, .feeds_source {max-width: 300px; min-width: 120px;}
-.imap_row, .github_row, .feeds_row {display: none;}
-.hl_rules {padding-left: 30px; padding-top: 20px; padding-bottom: 20px;}
-.hl_rules td {padding: 3px; padding-top: 7px; padding-bottom: 0px;}
-.hl_rules th {font-weight: normal; border-bottom: solid 1px #eee; text-align: left;}
-.rule_del {border: none; width: 16px; height: 16px; opacity: .5}
diff --git a/modules/highlights/site.js b/modules/highlights/site.js
index 7b30ceb24b..8d45918635 100644
--- a/modules/highlights/site.js
+++ b/modules/highlights/site.js
@@ -5,10 +5,10 @@ $(function() {
         return hm_delete_prompt();
     });
     $('.hl_source_type').on('change', function() {
-        $('.imap_row').hide();
-        $('.github_row').hide();
-        $('.feeds_row').hide();
+        $('.imap_row').addClass('d-none');
+        $('.github_row').addClass('d-none');
+        $('.feeds_row').addClass('d-none');
         var selected = $(this).val();
-        $('.'+selected+'_row').toggle();
+        $('.'+selected+'_row').removeClass('d-none');
     });
 });

From 5bf2aa6880e615298a5260c0feb287f63dd71d89 Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Tue, 12 Dec 2023 17:15:41 +0200
Subject: [PATCH 08/13] Style migration of Dev module in bootstrap 5

---
 modules/core/site.css            |  2 +-
 modules/developer/modules.php    | 51 ++++++++++++++++----------------
 modules/developer/site.css       |  8 -----
 modules/sievefilters/modules.php | 25 +++++++++-------
 modules/sievefilters/site.css    | 28 ++----------------
 5 files changed, 42 insertions(+), 72 deletions(-)

diff --git a/modules/core/site.css b/modules/core/site.css
index 23a44aefcf..b877deff38 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -432,4 +432,4 @@ div.unseen, .unseen .subject { font-weight: 700; }
 
 .mobile .cypht-modal-footer button {
     padding: 5px 10px;
-}
\ No newline at end of file
+}
diff --git a/modules/developer/modules.php b/modules/developer/modules.php
index d298f0eca0..9725ee66e5 100644
--- a/modules/developer/modules.php
+++ b/modules/developer/modules.php
@@ -91,15 +91,14 @@ class Hm_Output_dev_content extends Hm_Output_Module {
      * Dev resources
      */
     protected function output() {
-        return '<div class="dev_content"><div class="content_title">'.$this->trans('Developer Documentation').'</div>'.
-            '<div class="long_text">'.
-            'There is not a lot of documentation yet, but there are a few resources available online. First is the module overview page at our website intended for developers interested in creating module sets.'.
-            '<br /><br />&nbsp;&nbsp;&nbsp;<a href="http://cypht.org/modules.html" target="_blank" rel="noopener">http://cypht.org/modules.html</a>'.
-            '<br /><br />Code Documentation for Cypht is auto-generated using <a href="http://www.apigen.org/" target="_blank" rel="noopener">Apigen</a> and while '.
-            'not yet complete, has a lot of useful information'.
-            '<br /><br />&nbsp;&nbsp;&nbsp;<a href="http://cypht.org/docs/code_docs/index.html" target="_blank" rel="noopener">http://cypht.org/docs/code_docs/index.html</a>'.
-            '<br /><br />Finally there is a "hello world" module with lots of comments included in the project download and browsable at github'.
-            '<br /><br />&nbsp;&nbsp;&nbsp;<a href="https://github.com/cypht-org/cypht/tree/master/modules/hello_world" target="_blank" rel="noopener">https://github.com/cypht-org/cypht/tree/master/modules/hello_world</a>'.
+        return '<div class="dev_content p-0"><div class="content_title px-3">'.$this->trans('Developer Documentation').'</div>'.
+            '<div class="p-3">'.
+            '<p class="mb-2">There is not a lot of documentation yet, but there are a few resources available online. First is the module overview page at our website intended for developers interested in creating module sets.</p>'.
+            '<a class="ms-5" href="http://cypht.org/modules.html">http://cypht.org/modules.html</a>'.
+            '<p class="mt-4 mb-2">Code Documentation for Cypht is auto-generated using <a href="http://www.apigen.org/">Apigen</a> and while not yet complete, has a lot of useful information</p>'.
+            '<a class="ms-5" href="http://cypht.org/docs/code_docs/index.html">http://cypht.org/docs/code_docs/index.html</a>'.
+            '<p class="mt-4 mb-2">Finally there is a "hello world" module with lots of comments included in the project download and browsable at github</p>'.
+            '<a class="ms-5" href="https://github.com/cypht-org/cypht/tree/master/modules/hello_world">https://github.com/cypht-org/cypht/tree/master/modules/hello_world</a>'.
             '</div></div>';
     }
 }
@@ -113,7 +112,7 @@ class Hm_Output_info_heading extends Hm_Output_Module {
      * Leaves an open div
      */
     protected function output() {
-        return '<div class="info_content"><div class="content_title">'.$this->trans('Info').'</div>';
+        return '<div class="info_content px-0"><div class="content_title p-3">'.$this->trans('Info').'</div>';
     }
 }
 
@@ -171,16 +170,16 @@ class Hm_Output_server_information extends Hm_Output_Module {
     protected function output() {
         $server_info = $this->get('server_info', array());
         if (!empty($server_info)) {
-            return '<div class="server_info"><table class="info">'.
-                '<tr><th>Server Name</th><td>'.$server_info['HTTP_HOST'].'</td></tr>'.
-                '<tr><th>Server Scheme</th><td>'.$server_info['REQUEST_SCHEME'].'</td></tr>'.
-                '<tr><th>Server Address</th><td>'.$server_info['SERVER_ADDR'].'</td></tr>'.
-                '<tr><th>Client Address</th><td>'.$server_info['REMOTE_ADDR'].'</td></tr>'.
-                '<tr><th>PHP version</th><td>'.$server_info['phpversion'].'</td></tr>'.
-                '<tr><th>Zend version</th><td>'.$server_info['zend_version'].'</td></tr>'.
-                '<tr><th>SAPI</th><td>'.$server_info['sapi'].'</td></tr>'.
-                '<tr><th>Enabled Modules</th><td>'.str_replace(',', ', ', implode(',', $this->get('router_module_list'))).'</td></tr>'.
-                '<tr><th>Git version</th><td>'.$server_info['branch_name'].' at revision <a href="'.$server_info['commit_url'].'" target="_blank" rel="noopener">'.$server_info['commit_hash'].'</a> ('.$server_info['commit_date'].')</td></tr>'.
+            return '<div class="server_info p-3"><table class="info table table-borderless">'.
+                '<tr><th class="text-secondary fw-light text-nowrap">Server Name</th><td>'.$server_info['HTTP_HOST'].'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">Server Scheme</th><td>'.$server_info['REQUEST_SCHEME'].'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">Server Address</th><td>'.$server_info['SERVER_ADDR'].'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">Client Address</th><td>'.$server_info['REMOTE_ADDR'].'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">PHP version</th><td>'.$server_info['phpversion'].'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">Zend version</th><td>'.$server_info['zend_version'].'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">SAPI</th><td>'.$server_info['sapi'].'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">Enabled Modules</th><td>'.str_replace(',', ', ', implode(',', $this->get('router_module_list'))).'</td></tr>'.
+                '<tr><th class="text-secondary fw-light text-nowrap">Git version</th><td>'.$server_info['branch_name'].' at revision <a href="'.$server_info['commit_url'].'">'.$server_info['commit_hash'].'</a> ('.$server_info['commit_date'].')</td></tr>'.
                 '</table></div>';
         }
         return '';
@@ -196,7 +195,7 @@ class Hm_Output_config_map extends Hm_Output_Module {
      * Show pages, module assignments, and input filters
      */
     protected function output() {
-    $res = '<div class="content_title">'.$this->trans('Configuration Map').'</div><table class="config_map">';
+    $res = '<div class="content_title px-3">'.$this->trans('Configuration Map').'</div><table class="config_map">';
     $handlers = array();
     $outputs = array();
     $ajax = array();
@@ -207,7 +206,7 @@ protected function output() {
         ksort($handlers);
         $outputs = $server_info['output'];
     }
-    $res .= '<tr><td colspan="3"><div class="settings_subtitle">Pages</div></td></tr>';
+    $res .= '<tr><td colspan="3"><div class="settings_subtitle mt-3">Pages</div></td></tr>';
     foreach ($handlers as $page => $mods) {
         if (substr($page, 0, 4) == 'ajax') {
             continue;
@@ -226,7 +225,7 @@ protected function output() {
             }
         }
     }
-    $res .= '<tr><td colspan="3"><div class="settings_subtitle">AJAX Requests</div></td></tr>';
+    $res .= '<tr><td colspan="3"><div class="settings_subtitle mt-3">AJAX Requests</div></td></tr>';
     foreach ($handlers as $page => $mods) {
         if (substr($page, 0, 4) != 'ajax') {
             continue;
@@ -259,8 +258,8 @@ class Hm_Output_server_status_start extends Hm_Output_Module {
      * Modules populate this table to run a status check from the info page
      */
     protected function output() {
-        $res = '<div class="content_title">Status</div><table><thead><tr><th>'.$this->trans('Type').'</th><th>'.$this->trans('Name').'</th><th>'.
-                $this->trans('Status').'</th><th>'.
+        $res = '<div class="content_title px-3">'.$this->trans('Status').'</div><div class="p-3"><table class="table table-borderless"><thead><tr><th class="text-secondary fw-light">'.$this->trans('Type').'</th><th class="text-secondary fw-light">'.$this->trans('Name').'</th><th class="text-secondary fw-light">'.
+                $this->trans('Status').'</th><th class="text-secondary fw-light">'.
                 $this->trans('Sieve server capabilities').'</th></tr></thead><tbody>';
         return $res;
     }
@@ -275,7 +274,7 @@ class Hm_Output_server_status_end extends Hm_Output_Module {
      * Close the table opened in Hm_Output_server_status_start
      */
     protected function output() {
-        return '</tbody></table></div>';
+        return '</tbody></table></div></div>';
     }
 }
 
diff --git a/modules/developer/site.css b/modules/developer/site.css
index 9ad233ea96..1733179755 100644
--- a/modules/developer/site.css
+++ b/modules/developer/site.css
@@ -1,11 +1,3 @@
-.long_text { max-width: 600px; margin-left: 30px; margin-top: 20px; max-width: 60%; color: #666; }
-.info_content, .server_summary { width: 100%; background-color: #fff; }
-.info_content table, .server_summary table { table-layout: fixed; width: 100%; padding: 20px; padding-bottom: 40px; padding-left: 30px; }
-.info_content table th, .server_summary table th { font-style: normal; padding: 5px; padding-left: 10px; text-align: left; color: #999; font-size: 75%; font-weight: normal; }
-.info_content table td, .server_summary table td { white-space: nowrap; padding: 5px; overflow: hidden; text-overflow: ellipsis; }
-.config_map, .server_info table { table-layout: initial; width: auto; }
-.server_info table td { white-space: normal; vertical-align: top; }
-.server_info table th { white-space: nowrap; vertical-align: top; }
 .hmod_val, .omod_val, .hmod, .omod { color: #666; display: none; padding: 4px; padding-left: 60px; }
 .config_map_page { color: #666; font-size: 110%; cursor: pointer; padding-top: 20px; padding-left: 40px; }
 .config_map { margin-left: 40px; min-width: 400px; }
diff --git a/modules/sievefilters/modules.php b/modules/sievefilters/modules.php
index b565955cbb..915c44718c 100644
--- a/modules/sievefilters/modules.php
+++ b/modules/sievefilters/modules.php
@@ -1212,8 +1212,9 @@ protected function output() {
 class Hm_Output_sievefilters_settings_start extends Hm_Output_Module {
     protected function output() {
         $socked_connected = $this->get('socket_connected', false);
-        $res = '<div class="sievefilters_settings"><div class="content_title">'.$this->trans('Filters').'</div>';
+        $res = '<div class="sievefilters_settings p-0"><div class="content_title px-3">'.$this->trans('Filters').'</div>';
         $res .= '<script type="text/css" src="'.WEB_ROOT.'modules/sievefilters/assets/tingle.min.css"></script>';
+        $res .= '<div class="p-3">';
         return $res;
     }
 }
@@ -1224,7 +1225,7 @@ protected function output() {
 class Hm_Output_blocklist_settings_start extends Hm_Output_Module {
     protected function output() {
         $socked_connected = $this->get('socket_connected', false);
-        $res = '<div class="sievefilters_settings"><div class="content_title">'.$this->trans('Block List').'</div>';
+        $res = '<div class="sievefilters_settings p-0"><div class="content_title px-3">'.$this->trans('Block List').'</div>';
         $res .= '<script type="text/css" src="'.WEB_ROOT.'modules/sievefilters/assets/tingle.min.css"></script>';
         return $res;
     }
@@ -1294,6 +1295,7 @@ protected function output() {
         $mailboxes = $this->get('imap_accounts', array());
         $res = get_classic_filter_modal_content();
         $res .= get_script_modal_content();
+        $res .= '<div class="p-3">';
         foreach($mailboxes as $idx => $mailbox) {
             $behaviours = $this->get('sieve_block_default_behaviour');
             $reject_messages = $this->get('sieve_block_default_reject_message');
@@ -1316,9 +1318,9 @@ protected function output() {
             $blocked_senders = get_blocked_senders_array($mailbox, $this->get('site_config'), $this->get('user_config'));
             $num_blocked = $blocked_senders ? sizeof($blocked_senders) : 0;
             $res .= '<div class="sievefilters_accounts_item">';
-            $res .= '<div class="sievefilters_accounts_title settings_subtitle">' . $mailbox['name'];
+            $res .= '<div class="sievefilters_accounts_title settings_subtitle py-2 border-bottom cursor-pointer d-flex justify-content-between">' . $mailbox['name'];
             $res .= '<span class="filters_count"><span id="filter_num_'.$idx.'">'.$num_blocked.'</span> '.$this->trans('blocked'). '</span></div>';
-            $res .= '<div class="sievefilters_accounts filter_block" style="display: none;"><div class="filter_subblock">';
+            $res .= '<div class="sievefilters_accounts filter_block px-5 py-3" style="display: none;"><div class="filter_subblock">';
             $res .=  $default_behaviour_html;
             $res .= '<table class="filter_details"><tbody>';
             $res .= '<tr><th style="width: 20px;">Sender</th><th style="width: 40%;">Behavior</th><th style="width: 15%;">Actions</th></tr>';
@@ -1327,6 +1329,7 @@ protected function output() {
             $res .= '</div></div></div>';
         }
         $res .= block_filter_dropdown($this, false, 'edit_blocked_behavior', 'Edit');
+        $res .= '</div></div>';
         return $res;
     }
 }
@@ -1347,12 +1350,12 @@ protected function output() {
             $sieve_supported++;
             $num_filters = sizeof(get_mailbox_filters($mailbox, $this->get('site_config'), $this->get('user_config'), false));
             $res .= '<div class="sievefilters_accounts_item">';
-            $res .= '<div class="sievefilters_accounts_title settings_subtitle">' . $mailbox['name'];
+            $res .= '<div class="sievefilters_accounts_title settings_subtitle py-2 d-flex justify-content-between border-bottom cursor-pointer">' . $mailbox['name'];
             $res .= '<span class="filters_count">' . sprintf($this->trans('%s filters'), $num_filters) . '</span></div>';
-            $res .= '<div class="sievefilters_accounts filter_block" style="display: none;"><div class="filter_subblock">';
-            $res .= '<button class="add_filter" account="'.$mailbox['name'].'">Add Filter</button> <button  account="'.$mailbox['name'].'" class="add_script">Add Script</button>';
-            $res .= '<table class="filter_details"><tbody>';
-            $res .= '<tr><th style="width: 80px;">Priority</th><th>Name</th><th style="width: 15%;">Actions</th></tr>';
+            $res .= '<div class="sievefilters_accounts filter_block p-3" style="display: none;"><div class="filter_subblock">';
+            $res .= '<button class="add_filter btn btn-success" account="'.$mailbox['name'].'">Add Filter</button> <button  account="'.$mailbox['name'].'" class="add_script btn btn-light border">Add Script</button>';
+            $res .= '<table class="filter_details table my-3"><tbody>';
+            $res .= '<tr><th class="text-secondary fw-light" style="width: 80px;">Priority</th><th class="text-secondary fw-light">Name</th><th class="text-secondary fw-light" style="width: 15%;">Actions</th></tr>';
             $res .= get_mailbox_filters($mailbox, $this->get('site_config'), $this->get('user_config'), true);
             $res .= '</tbody></table>';
             $res .= '<div style="height: 40px; margin-bottom: 10px; display: none;">
@@ -1590,10 +1593,10 @@ function get_mailbox_filters($mailbox, $site_config, $user_config, $html=false)
                 <td>' . str_replace('_', ' ', implode('-', array_slice($exp_name, 0, count($exp_name) - 2))) . '</td>
                 <td>
                     <a href="#" script_name_parsed="'.$parsed_name.'"  priority="'.$exp_name[sizeof($exp_name) - 2].'" imap_account="'.$mailbox['name'].'" script_name="'.$script_name.'"  class="edit_'.$base_class.'">
-                        <img width="16" height="16" src="' . Hm_Image_Sources::$edit . '" />
+                        <i class="bi bi-pencil-fill"></i>
                     </a>
                     <a href="#" script_name_parsed="'.$parsed_name.'" priority="'.$exp_name[sizeof($exp_name) - 2].'" imap_account="'.$mailbox['name'].'" style="padding-left: 5px;" script_name="'.$script_name.'" class="delete_'.$base_class.'">
-                        <img width="16" height="16" src="' . Hm_Image_Sources::close('#d80f0f') . '" />
+                        <i class="bi bi-trash3 text-danger"></i>
                     </a>
                 </td>
             </tr>
diff --git a/modules/sievefilters/site.css b/modules/sievefilters/site.css
index b309b3ce57..2da52e8561 100644
--- a/modules/sievefilters/site.css
+++ b/modules/sievefilters/site.css
@@ -1,21 +1,3 @@
-.filter_details {
-    margin-top: 20px;
-}
-
-.filter_details th {
-    color: #666;
-    padding: 5px;
-    padding-bottom: 5px;
-    padding-bottom: 2px;
-    border-bottom: solid 1px #eee;
-    font-weight: normal;
-    text-align: left;
-}
-
-.filter_details td {
-    padding: 10px;
-}
-
 .tingle-modal * {
     box-sizing: border-box
 }
@@ -258,22 +240,16 @@
     }
 }
 
-.filters_count,
-.key_count {
-    float: right;
-    margin-right: 120px;
-    font-size: 90%;
-}
 
 .filter_subblock {
     margin-bottom: 40px;
 }
 
-.filter_block {
+/* .filter_block {
     margin-bottom: 30px;
     margin-left: 40px;
     padding-top: 20px;
-}
+} */
 
 .unblock_button {
     width: 16px;

From 9b562f13068e8e922142ccf3f075927e5f4707fd Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Wed, 13 Dec 2023 16:39:14 +0200
Subject: [PATCH 09/13] Change sidebar icons to Bootstrap Icon

---
 composer.lock                           |  56 +++++------
 modules/account/modules.php             |   2 +-
 modules/calendar/hm-calendar.php        |   2 +-
 modules/calendar/modules.php            |  10 +-
 modules/calendar/site.css               |  16 ---
 modules/carddav_contacts/modules.php    |   2 +-
 modules/contacts/modules.php            |  35 +++----
 modules/contacts/site.css               |  18 ----
 modules/core/message_list_functions.php |  12 +--
 modules/core/output_modules.php         | 126 ++++++++++++------------
 modules/core/site.css                   |  41 ++------
 modules/developer/modules.php           |   4 +-
 modules/dynamic_login/modules.php       |   2 +-
 modules/dynamic_login/site.css          |   1 -
 modules/feeds/modules.php               |  20 ++--
 modules/feeds/site.css                  |   6 --
 modules/highlights/modules.php          |   2 +-
 modules/history/modules.php             |   2 +-
 modules/idle_timer/modules.php          |   2 +-
 modules/imap/functions.php              |   2 +-
 modules/imap/output_modules.php         |  51 +++++-----
 modules/imap/site.css                   |   6 +-
 modules/imap_folders/modules.php        |   2 +-
 modules/inline_message/modules.php      |   6 +-
 modules/keyboard_shortcuts/modules.php  |  37 +++----
 modules/keyboard_shortcuts/site.css     |   8 +-
 modules/ldap_contacts/modules.php       |   2 +-
 modules/local_contacts/modules.php      |   7 +-
 modules/profiles/modules.php            |   2 +-
 modules/sievefilters/modules.php        |  14 +--
 modules/sievefilters/site.css           |   6 --
 modules/smtp/modules.php                |  14 +--
 modules/themes/modules.php              |   2 +-
 33 files changed, 220 insertions(+), 298 deletions(-)

diff --git a/composer.lock b/composer.lock
index aed126068f..9c204ba806 100755
--- a/composer.lock
+++ b/composer.lock
@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "9f54029a1093949265d1994e83c8b3c4",
+    "content-hash": "f0317cf08c00727723e842c7c83a2187",
     "packages": [
         {
             "name": "bacon/bacon-qr-code",
@@ -1606,16 +1606,16 @@
         },
         {
             "name": "twbs/bootstrap-icons",
-            "version": "v1.11.1",
+            "version": "v1.11.2",
             "source": {
                 "type": "git",
                 "url": "https://github.com/twbs/icons.git",
-                "reference": "8d7bc695fb407627378cb184976b348e6a128d59"
+                "reference": "108565f11f099f177b31929e3eafc2c8d497fcd1"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/twbs/icons/zipball/8d7bc695fb407627378cb184976b348e6a128d59",
-                "reference": "8d7bc695fb407627378cb184976b348e6a128d59",
+                "url": "https://api.github.com/repos/twbs/icons/zipball/108565f11f099f177b31929e3eafc2c8d497fcd1",
+                "reference": "108565f11f099f177b31929e3eafc2c8d497fcd1",
                 "shasum": ""
             },
             "type": "library",
@@ -1639,9 +1639,9 @@
             ],
             "support": {
                 "issues": "https://github.com/twbs/icons/issues",
-                "source": "https://github.com/twbs/icons/tree/v1.11.1"
+                "source": "https://github.com/twbs/icons/tree/v1.11.2"
             },
-            "time": "2023-09-17T14:09:28+00:00"
+            "time": "2023-11-21T20:06:00+00:00"
         },
         {
             "name": "webklex/composer-info",
@@ -2203,23 +2203,23 @@
         },
         {
             "name": "phpunit/php-code-coverage",
-            "version": "9.2.29",
+            "version": "9.2.30",
             "source": {
                 "type": "git",
                 "url": "https://github.com/sebastianbergmann/php-code-coverage.git",
-                "reference": "6a3a87ac2bbe33b25042753df8195ba4aa534c76"
+                "reference": "ca2bd87d2f9215904682a9cb9bb37dda98e76089"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/sebastianbergmann/php-code-coverage/zipball/6a3a87ac2bbe33b25042753df8195ba4aa534c76",
-                "reference": "6a3a87ac2bbe33b25042753df8195ba4aa534c76",
+                "url": "https://api.github.com/repos/sebastianbergmann/php-code-coverage/zipball/ca2bd87d2f9215904682a9cb9bb37dda98e76089",
+                "reference": "ca2bd87d2f9215904682a9cb9bb37dda98e76089",
                 "shasum": ""
             },
             "require": {
                 "ext-dom": "*",
                 "ext-libxml": "*",
                 "ext-xmlwriter": "*",
-                "nikic/php-parser": "^4.15",
+                "nikic/php-parser": "^4.18 || ^5.0",
                 "php": ">=7.3",
                 "phpunit/php-file-iterator": "^3.0.3",
                 "phpunit/php-text-template": "^2.0.2",
@@ -2269,7 +2269,7 @@
             "support": {
                 "issues": "https://github.com/sebastianbergmann/php-code-coverage/issues",
                 "security": "https://github.com/sebastianbergmann/php-code-coverage/security/policy",
-                "source": "https://github.com/sebastianbergmann/php-code-coverage/tree/9.2.29"
+                "source": "https://github.com/sebastianbergmann/php-code-coverage/tree/9.2.30"
             },
             "funding": [
                 {
@@ -2277,7 +2277,7 @@
                     "type": "github"
                 }
             ],
-            "time": "2023-09-19T04:57:46+00:00"
+            "time": "2023-12-22T06:47:57+00:00"
         },
         {
             "name": "phpunit/php-file-iterator",
@@ -2866,20 +2866,20 @@
         },
         {
             "name": "sebastian/complexity",
-            "version": "2.0.2",
+            "version": "2.0.3",
             "source": {
                 "type": "git",
                 "url": "https://github.com/sebastianbergmann/complexity.git",
-                "reference": "739b35e53379900cc9ac327b2147867b8b6efd88"
+                "reference": "25f207c40d62b8b7aa32f5ab026c53561964053a"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/sebastianbergmann/complexity/zipball/739b35e53379900cc9ac327b2147867b8b6efd88",
-                "reference": "739b35e53379900cc9ac327b2147867b8b6efd88",
+                "url": "https://api.github.com/repos/sebastianbergmann/complexity/zipball/25f207c40d62b8b7aa32f5ab026c53561964053a",
+                "reference": "25f207c40d62b8b7aa32f5ab026c53561964053a",
                 "shasum": ""
             },
             "require": {
-                "nikic/php-parser": "^4.7",
+                "nikic/php-parser": "^4.18 || ^5.0",
                 "php": ">=7.3"
             },
             "require-dev": {
@@ -2911,7 +2911,7 @@
             "homepage": "https://github.com/sebastianbergmann/complexity",
             "support": {
                 "issues": "https://github.com/sebastianbergmann/complexity/issues",
-                "source": "https://github.com/sebastianbergmann/complexity/tree/2.0.2"
+                "source": "https://github.com/sebastianbergmann/complexity/tree/2.0.3"
             },
             "funding": [
                 {
@@ -2919,7 +2919,7 @@
                     "type": "github"
                 }
             ],
-            "time": "2020-10-26T15:52:27+00:00"
+            "time": "2023-12-22T06:19:30+00:00"
         },
         {
             "name": "sebastian/diff",
@@ -3193,20 +3193,20 @@
         },
         {
             "name": "sebastian/lines-of-code",
-            "version": "1.0.3",
+            "version": "1.0.4",
             "source": {
                 "type": "git",
                 "url": "https://github.com/sebastianbergmann/lines-of-code.git",
-                "reference": "c1c2e997aa3146983ed888ad08b15470a2e22ecc"
+                "reference": "e1e4a170560925c26d424b6a03aed157e7dcc5c5"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/sebastianbergmann/lines-of-code/zipball/c1c2e997aa3146983ed888ad08b15470a2e22ecc",
-                "reference": "c1c2e997aa3146983ed888ad08b15470a2e22ecc",
+                "url": "https://api.github.com/repos/sebastianbergmann/lines-of-code/zipball/e1e4a170560925c26d424b6a03aed157e7dcc5c5",
+                "reference": "e1e4a170560925c26d424b6a03aed157e7dcc5c5",
                 "shasum": ""
             },
             "require": {
-                "nikic/php-parser": "^4.6",
+                "nikic/php-parser": "^4.18 || ^5.0",
                 "php": ">=7.3"
             },
             "require-dev": {
@@ -3238,7 +3238,7 @@
             "homepage": "https://github.com/sebastianbergmann/lines-of-code",
             "support": {
                 "issues": "https://github.com/sebastianbergmann/lines-of-code/issues",
-                "source": "https://github.com/sebastianbergmann/lines-of-code/tree/1.0.3"
+                "source": "https://github.com/sebastianbergmann/lines-of-code/tree/1.0.4"
             },
             "funding": [
                 {
@@ -3246,7 +3246,7 @@
                     "type": "github"
                 }
             ],
-            "time": "2020-11-28T06:42:11+00:00"
+            "time": "2023-12-22T06:20:34+00:00"
         },
         {
             "name": "sebastian/object-enumerator",
diff --git a/modules/account/modules.php b/modules/account/modules.php
index f0e2a961f9..9f765f13e5 100644
--- a/modules/account/modules.php
+++ b/modules/account/modules.php
@@ -208,7 +208,7 @@ protected function output() {
         if ($this->get('internal_users')) {
             $res = '<li class="menu_change_password"><a class="unread_link" href="?page=change_password">';
             if (!$this->get('hide_folder_icons')) {
-                $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$key).'" alt="" width="16" height="16" /> ';
+                $res .= '<i class="bi bi-key-fill fs-5 me-2"></i>';
             }
             $res .= $this->trans('Password').'</a></li>';
             $this->concat('formatted_folder_list', $res);
diff --git a/modules/calendar/hm-calendar.php b/modules/calendar/hm-calendar.php
index ec273263fc..9d51681bdd 100644
--- a/modules/calendar/hm-calendar.php
+++ b/modules/calendar/hm-calendar.php
@@ -69,7 +69,7 @@ private function output_event($day) {
                 $res .= '<div class="cal_event text-secondary">'.
                     $this->output_event_details($event).
                     $this->output_mod->html_safe(date('H:i', $event['ts'])).
-                    ' <a class="cal_title">'.$this->output_mod->html_safe($event['title']).
+                    ' <a class="cal_title cursor-pointer">'.$this->output_mod->html_safe($event['title']).
                     '</a></div>';
             }
             return $res;
diff --git a/modules/calendar/modules.php b/modules/calendar/modules.php
index 2b07e924ae..7d7f2d659e 100644
--- a/modules/calendar/modules.php
+++ b/modules/calendar/modules.php
@@ -119,7 +119,7 @@ public function process() {
 class Hm_Output_vcalendar_add_output extends Hm_Output_Module {
     protected function output() {
         if ($this->get('imap_calendar_struct')) {
-            $link = '<a class="add_vcal" href="">Add to calendar</a>';
+            $link = '<a class="add_vcal float-end mt-2 pe-4" href="">Add to calendar</a>';
             $this->concat('msg_headers', $link);
         }
     }
@@ -132,7 +132,7 @@ class Hm_Output_calendar_page_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_calendar"><a class="unread_link" href="?page=calendar">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$calendar).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-calendar-week-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Calendar').'</a></li>';
         if ($this->format == 'HTML5') {
@@ -156,7 +156,7 @@ protected function output() {
         );
         if ($this->get('cal_action') == 'add') {
             $res = '<div class="calendar p-0">
-                        <div class="content_title">'.$this->trans('Add an Event').'</div>
+                        <div class="content_title px-3">'.$this->trans('Add an Event').'</div>
                         <div class="px-4 mt-5">
                             <form method="post">
                                 <input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />
@@ -231,8 +231,8 @@ protected function output() {
             $events = $cal_events->in_date_range($bounds[0], $bounds[1]);
             $out = new Hm_Cal_Output($this, $events);
             $out = $out->output($data, $date, $view);
-            return '<div class="calendar p-0"><div class="content_title d-flex justify-content-between">'.$this->trans('Calendar').
-                '<a href="?page=calendar&amp;action=add" title="'.$this->trans('Add Event').'" class="btn btn-light btn-sm me-4">'.
+            return '<div class="calendar p-0"><div class="content_title d-flex justify-content-between px-3">'.$this->trans('Calendar').
+                '<a href="?page=calendar&amp;action=add" title="'.$this->trans('Add Event').'" class="btn btn-light btn-sm">'.
                 '<i class="bi bi-plus-circle me-2"></i> '.$this->trans('Add Event').'</a></div>'.
                 $out.'</div>';
         }
diff --git a/modules/calendar/site.css b/modules/calendar/site.css
index d9d595c176..ddf9820da3 100644
--- a/modules/calendar/site.css
+++ b/modules/calendar/site.css
@@ -1,22 +1,6 @@
-/* .calendar { width: 100%; } */
-/* .event_form { margin-left: 40px; } */
-/* .calendar_week th, .calendar_month th { font-weight: normal; padding-top: 10px; border-bottom: solid 1px #eee; padding-bottom: 10px; border-right: solid 1px #eee; } */
 .mobile .calendar_month th { max-width: 30px; overflow: hidden; }
 .calendar_month td { width: 14%; height: 120px; text-align: left; padding: 10px; border-bottom: solid 1px #eee; vertical-align: top; border-right: solid 1px #eee; }
-/* .calendar_week, .calendar_month { padding-bottom: 50px; width: 100%; } */
-/* .calendar_week .today, .calendar_month .today { background-color: #f5f5f5; } */
 .calendar_week .offmonth, .calendar_month .offmonth { color: #ccc; }
-/* .month_label { font-size: 120%; padding: 20px; margin-left: 10px; color: #999; } */
 .calendar_week td { width: 14%; height: 600px; text-align: left; padding: 10px; border-bottom: solid 1px #eee; vertical-align: top; border-right: solid 1px #eee; }
-.calendar .event_form { margin-top: 20px; width: 20%; }
-.calendar .event_form td { padding-top: 5px; }
-/* .cal_label { text-align: left; padding-right: 20px; } */
-/* .event_submit { padding-top: 15px !important; } */
-/* .cal_event { position: relative; margin-top: 5px; color: #666; } */
 .event_details { cursor: pointer; z-index: 100; display: none; position: absolute; width: 300px; border: solid 1px #ddd; background-color: #fff; padding: 10px; }
 .event_details td { padding: 5px; border: none;  height: auto; }
-.cal_title { cursor: pointer; }
-/* .event_title { border-bottom: solid 1px #eee; font-size: 120%; margin-bottom: 10px; } */
-/* .event_detail { padding: 10px; padding-bottom: 15px; } */
-/* .event_repeat { font-size: 90%; font-style: italic; text-align: right; } */
-.add_vcal { padding-right: 35px; float: right; margin-top: 10px; }
diff --git a/modules/carddav_contacts/modules.php b/modules/carddav_contacts/modules.php
index 9cb232cf60..f79d059b17 100644
--- a/modules/carddav_contacts/modules.php
+++ b/modules/carddav_contacts/modules.php
@@ -313,7 +313,7 @@ protected function output() {
             if (array_key_exists('phone_number', $current)) {
                 $phone = $current['phone_number'];
             }
-            $form_class = 'contact_update_form';
+            $form_class = 'contact_update_form mt-3';
             $title = sprintf($this->trans('Update Carddav - %s'), $this->html_safe($current['source']));
             $button = '<input type="hidden" name="contact_id" value="'.$this->html_safe($current['id']).'" />'.
                 '<input class="edit_contact_submit" type="submit" name="edit_contact" value="'.$this->trans('Update').'" />';
diff --git a/modules/contacts/modules.php b/modules/contacts/modules.php
index ab0d6db1ae..30f98cb3d1 100644
--- a/modules/contacts/modules.php
+++ b/modules/contacts/modules.php
@@ -91,7 +91,7 @@ class Hm_Output_contacts_page_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_contacts"><a class="unread_link" href="?page=contacts">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$people).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-people-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Contacts').'</a></li>';
         if ($this->format == 'HTML5') {
@@ -106,7 +106,7 @@ protected function output() {
  */
 class Hm_Output_contacts_content_start extends Hm_Output_Module {
     protected function output() {
-        return '<div class="contacts_content"><div class="content_title">'.$this->trans('Contacts').'</div>';
+        return '<div class="contacts_content px-0"><div class="content_title px-3">'.$this->trans('Contacts').'</div>';
     }
 }
 
@@ -128,19 +128,19 @@ protected function output() {
         $headers = $this->get('msg_headers');
         $backends = $this->get('contact_edit', array());
         if (!empty($addresses) && count($backends) > 0) {
-            $res = '<div class="add_contact_row"><a href="#" onclick="$(\'.add_contact_controls\').toggle(); return false;">'.
-                '<img width="20" height="20" src="'.Hm_Image_Sources::$people.'" alt="'.$this->trans('Add').'" title="'.
-                $this->html_safe('Add Contact').'" /></a><span class="add_contact_controls"><select id="add_contact">';
+            $res = '<div class="add_contact_row position-absolute top-0 end-0 z-3 p-2 d-flex align-content-center gap-3"><a href="#" title="'.
+            $this->html_safe('Add Contact').'" onclick="$(\'.add_contact_controls\').toggle(); return false;">'.
+                '<i class="bi bi-person-fill-add fs-3" ></i></a><div class="add_contact_controls"><div class="row g-1 mt-1"><div class="col"><select id="add_contact" class="form-select form-select-sm">';
             foreach ($addresses as $vals) {
                 $res .= '<option value="'.$this->html_safe($vals['name']).' '.$this->html_safe($vals['email']).
                     '">'.$this->html_safe($vals['name']).' &lt;'.$this->html_safe($vals['email']).'&gt;</option>';
             }
-            $res .= '</select> <select id="contact_source">';
+            $res .= '</select></div> <div class="col"><select id="contact_source" class="form-select form-select-sm">';
             foreach ($backends as $val) {
                 $res .= '<option value="'.$this->html_safe($val).'">'.$this->html_safe($val).'</option>';
             }
-            $res .= '</select> <input onclick="return add_contact_from_message_view()" class="add_contact_button" '.
-                'type="button" value="'.$this->trans('Add').'"></span></div>';
+            $res .= '</select></div> <div class="col"><input onclick="return add_contact_from_message_view()" class="add_contact_button w-100 btn btn-success btn-sm" '.
+                'type="button" value="'.$this->trans('Add Contact').'"></div></div></div></div>';
             $headers = $headers.$res;
         }
         $this->out('msg_headers', $headers, false);
@@ -158,7 +158,7 @@ protected function output() {
         }
         $per_page = 25;
         $current_page = $this->get('contact_page', 1);
-        $res = '<div class="px-4"><table class="contact_list table">';
+        $res = '<div class="px-3 mt-3"><table class="contact_list table">';
         $res .= '<tr><td colspan="7" class="contact_list_title"><div class="server_title">'.$this->trans('Contacts').'</div></td></tr>';
         $contacts = $this->get('contact_store');
         $editable = $this->get('contact_edit', array());
@@ -173,28 +173,25 @@ protected function output() {
                 $res .= '<tr class="contact_row_'.$this->html_safe($id).'">';
                 $res .= '<td><a data-id="contact_'.$this->html_safe($id).'_detail" '.
                     '" class="show_contact" title="'.$this->trans('Details').'">'.
-                    '<img alt="'.$this->trans('Send To').'" width="16" height="16" src="'.Hm_Image_Sources::$person.'" /></a> '.
+                    '<i class="bi bi-person-fill"></i> '.
                     '</d><td>'.$this->html_safe($contact->value('type')).'<td><span class="contact_src">'.
                     ($contact->value('source') == 'local' ? '' : $this->html_safe($contact->value('source'))).'</span>'.
                     '</td><td>'.$this->html_safe($name).'</td>'.
                     '<td><div class="contact_fld">'.$this->html_safe($contact->value('email_address')).'</div></td>'.
                     '<td class="contact_fld"><a href="tel:'.$this->html_safe($contact->value('phone_number')).'">'.
                     $this->html_safe($contact->value('phone_number')).'</a></td>'.
-                    '<td class="text-end">';
+                    '<td class="text-end" style="width : 100px">';
                 if (in_array($contact->value('type').':'.$contact->value('source'), $editable, true)) {
                     $res .= '<a data-id="'.$this->html_safe($id).'" data-type="'.$this->html_safe($contact->value('type')).'" data-source="'.$this->html_safe($contact->value('source')).
-                        '" class="delete_contact" title="'.$this->trans('Delete').'"><img alt="'.$this->trans('Delete').
-                        '" width="16" height="16" src="'.Hm_Image_Sources::$circle_x.'" /></a>'.
+                        '" class="delete_contact cursor-pointer" title="'.$this->trans('Delete').'"><i class="bi bi-trash3 text-danger ms-2"></i></a>'.
                         '<a href="?page=contacts&amp;contact_id='.$this->html_safe($id).'&amp;contact_source='.
                         $this->html_safe($contact->value('source')).'&amp;contact_type='.
                         $this->html_safe($contact->value('type')).'&amp;contact_page='.$current_page.
-                        '" class="edit_contact" title="'.$this->trans('Edit').'"><img alt="'.$this->trans('Edit').
-                        '" width="16" height="16" src="'.Hm_Image_Sources::$cog.'" /></a>';
+                        '" class="edit_contact cursor-pointer" title="'.$this->trans('Edit').'"><i class="bi bi-gear ms-2"></i></a>';
                 }
                 $res .= '<a href="?page=compose&amp;contact_id='.$this->html_safe($id).
-                    '" class="send_to_contact" title="'.$this->trans('Send To').'">'.
-                    '<img alt="'.$this->trans('Send To').'" width="16" height="16" src="'.
-                    Hm_Image_Sources::$doc.'" /></a>';
+                    '" class="send_to_contact cursor-pointer" title="'.$this->trans('Send To').'">'.
+                    '<i class="bi bi-file-earmark-text ms-2"></i></a>';
 
                 $res .= '</td></tr>';
                 $res .= '<tr><td id="contact_'.$this->html_safe($id).'_detail" class="contact_detail_row" colspan="6">';
@@ -247,7 +244,7 @@ protected function output() {
  */
 if (!hm_exists('build_contact_detail')) {
 function build_contact_detail($output_mod, $contact, $id) {
-    $res = '<div class="contact_detail" /><table><thead></thead><tbody>';
+    $res = '<div class="contact_detail m-3" /><table class="w-auto"><thead></thead><tbody>';
     $all_fields = false;
     $contacts = $contact->export();
     ksort($contacts);
diff --git a/modules/contacts/site.css b/modules/contacts/site.css
index a8aedbea25..beb241826b 100644
--- a/modules/contacts/site.css
+++ b/modules/contacts/site.css
@@ -1,13 +1,3 @@
-/* .add_contact_form input { margin: 5px; margin-left: 0px; background-color: aqua; } */
-/* .add_contact_form { padding-top: 10px; display: block; } */
-/* .contact_list { margin-left: 35px; margin-right: 10px; margin-top: 20px; width: 50%; } */
-/* .contact_list td { white-space: nowrap; padding-right: 20px; padding-bottom: 5px; vertical-align: -5px; padding-top: 5px; border-bottom: solid 1px #ddd; } */
-.gmail_contacts { margin-top: 50px; }
-/* .contact_list_title { padding-top: 0px !important; padding-bottom: 10px; } */
-.show_contact img, .edit_contact img, .send_to_contact img, .delete_contact img { opacity: .5; margin-left: 10px; cursor: pointer; }
-/* .contact_controls { text-align: right; } */
-.add_contact_row { position: absolute; top: 22px; right: 10px; font-size: 90%; z-index: 100}
-.add_contact_row img { opacity: .4; margin-right: 10px; }
 .add_contact_controls { display: none; }
 .contact_suggestion { display: block; }
 .close_autocomplete { float: right; }
@@ -15,15 +5,7 @@
 .contact_pages { text-align: center; border-bottom: none !important; }
 .no_contact_sources { text-align: center; color: #999; font-size: 110%; margin-top: 60px; }
 .add_contact { margin-bottom: 30px; margin-top: 10px; color: #666; margin-right: 25px; float: left; clear: left; margin-left: 25px; width: 300px; }
-/* .add_contact input, .add_contact select { margin-bottom: 10px; padding: 5px; margin-right: 5px; } */
-/* .add_contact .server_title { cursor: pointer; } */
 .contact_form { margin-top: 10px; display: none; }
-.add_contact .menu_caret { opacity: .7; }
-.contact_update_form { margin-top: 10px; }
-.contact_update_form, .contact_form { white-space: nowrap; }
-.contact_detail { margin: 20px; margin-bottom: 30px; }
-.contact_detail_row table { width: auto; }
-.contact_detail td { border: none; }
 .contact_detail_row { border: none; display: none;}
 .display_name, .email_address, .phone_number { font-weight: bold; }
 .show_contact { margin-right: 15px; }
diff --git a/modules/core/message_list_functions.php b/modules/core/message_list_functions.php
index 0338452c52..f1cda526ec 100644
--- a/modules/core/message_list_functions.php
+++ b/modules/core/message_list_functions.php
@@ -386,7 +386,7 @@ function message_since_dropdown($since, $name, $output_mod) {
         '-1 year' => 'Last year',
         '-5 years' => 'Last 5 years'
     );
-    $res = '<select name="'.$name.'" id="'.$name.'" class="message_list_since">';
+    $res = '<select name="'.$name.'" id="'.$name.'" class="message_list_since form-select form-select-sm w-auto">';
     $reset = '';
     foreach ($times as $val => $label) {
         $res .= '<option';
@@ -606,8 +606,8 @@ function build_page_links($page_size, $current_page, $total, $path, $filter=fals
     if ($ceil > $max_pages) {
         $floor -= ($ceil - $max_pages);
     }
-    $prev = '<a class="disabled_link"><img src="'.Hm_Image_Sources::$caret_left.'" alt="&larr;" /></a>';
-    $next = '<a class="disabled_link"><img src="'.Hm_Image_Sources::$caret_right.'" alt="&rarr;" /></a>';
+    $prev = '<a class="disabled_link"><i class="bi bi-caret-left-fill"></i></a>';
+    $next = '<a class="disabled_link"><i class="bi bi-caret-right-fill"></i></a>';
 
     if ($floor > 1 ) {
         $first = '<a href="?page=message_list&amp;list_path='.urlencode($path).'&amp;list_page=1'.$keyword_str.$filter_str.$sort_str.'">1</a> ... ';
@@ -616,10 +616,10 @@ function build_page_links($page_size, $current_page, $total, $path, $filter=fals
         $last = ' ... <a href="?page=message_list&amp;list_path='.urlencode($path).'&amp;list_page='.$max_pages.$keyword_str.$filter_str.$sort_str.'">'.$max_pages.'</a>';
     }
     if ($current_page > 1) {
-        $prev = '<a href="?page=message_list&amp;list_path='.urlencode($path).'&amp;list_page='.($current_page - 1).$keyword_str.$filter_str.$sort_str.'"><img src="'.Hm_Image_Sources::$caret_left.'" alt="&larr;" /></a>';
+        $prev = '<a href="?page=message_list&amp;list_path='.urlencode($path).'&amp;list_page='.($current_page - 1).$keyword_str.$filter_str.$sort_str.'"><i class="bi bi-caret-left-fill"></i></a>';
     }
     if ($max_pages > 1 && $current_page < $max_pages) {
-        $next = '<a href="?page=message_list&amp;list_path='.urlencode($path).'&amp;list_page='.($current_page + 1).$keyword_str.$filter_str.$sort_str.'"><img src="'.Hm_Image_Sources::$caret_right.'" alt="&rarr;" /></a>';
+        $next = '<a href="?page=message_list&amp;list_path='.urlencode($path).'&amp;list_page='.($current_page + 1).$keyword_str.$filter_str.$sort_str.'"><i class="bi bi-caret-right-fill"></i></a>';
     }
     for ($i=1;$i<=$max_pages;$i++) {
         if ($i < $floor || $i > $ceil) {
@@ -627,7 +627,7 @@ function build_page_links($page_size, $current_page, $total, $path, $filter=fals
         }
         $links .= ' <a ';
         if ($i == $current_page) {
-            $links .= 'class="current_page" ';
+            $links .= 'class="current_page fw-bolder" ';
         }
         $links .= 'href="?page=message_list&amp;list_path='.urlencode($path).'&amp;list_page='.$i.$keyword_str.$filter_str.$sort_str.'">'.$i.'</a>';
     }
diff --git a/modules/core/output_modules.php b/modules/core/output_modules.php
index 5144065bbc..0c11c5c454 100644
--- a/modules/core/output_modules.php
+++ b/modules/core/output_modules.php
@@ -672,9 +672,9 @@ class Hm_Output_start_settings_form extends Hm_Output_Module {
      * Opens a div, form and table
      */
     protected function output() {
-        return '<div class="user_settings"><div class="content_title">'.$this->trans('Site Settings').'</div>'.
+        return '<div class="user_settings px-0"><div class="content_title px-3">'.$this->trans('Site Settings').'</div>'.
             '<form method="POST"><input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<table class="settings_table"><colgroup>'.
+            '<div class="px-3"><table class="settings_table table table-borderless"><colgroup>'.
             '<col class="label_col"><col class="setting_col"></colgroup>';
     }
 }
@@ -701,7 +701,7 @@ protected function output() {
         }
         $res = '<tr class="general_setting"><td><label for="start_page">'.
             $this->trans('First page after login').'</label></td>'.
-            '<td><select id="start_page" name="start_page">';
+            '<td><select class="form-select form-select-sm w-auto" id="start_page" name="start_page">';
         foreach ($options as $label => $val) {
             $res .= '<option ';
             if ($start_page == $val) {
@@ -738,7 +738,7 @@ protected function output() {
         }
         $res = '<tr class="general_setting"><td><label for="default_sort_order">'.
             $this->trans('Default message sort order').'</label></td>'.
-            '<td><select id="default_sort_order" name="default_sort_order">';
+            '<td><select class="form-select form-select-sm w-auto" id="default_sort_order" name="default_sort_order">';
         foreach ($options as $val => $label) {
             $res .= '<option ';
             if ($default_sort_order == $val) {
@@ -775,7 +775,7 @@ protected function output() {
         }
         $res = '<tr class="general_setting"><td><label for="list_style">'.
             $this->trans('Message list style').'</label></td>'.
-            '<td><select id="list_style" name="list_style">';
+            '<td><select class="form-select form-select-sm w-auto" id="list_style" name="list_style">';
         foreach ($options as $val => $label) {
             $res .= '<option ';
             if ($list_style == $val) {
@@ -805,8 +805,8 @@ protected function output() {
             $checked = '';
             $reset = '';
         }
-        return '<tr class="general_setting"><td><label for="mailto_handler">'.$this->trans('Allow handling of mailto links').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' value="1" id="mailto_handler" name="mailto_handler" />'.$reset.'</td></tr>';
+        return '<tr class="general_setting"><td><label class="form-check-label" for="mailto_handler">'.$this->trans('Allow handling of mailto links').'</label></td>'.
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' value="1" id="mailto_handler" name="mailto_handler" />'.$reset.'</td></tr>';
     }
 }
 
@@ -824,8 +824,8 @@ protected function output() {
             $checked = '';
             $reset = '';
         }
-        return '<tr class="general_setting"><td><label for="no_folder_icons">'.$this->trans('Hide folder list icons').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' value="1" id="no_folder_icons" name="no_folder_icons" />'.$reset.'</td></tr>';
+        return '<tr class="general_setting"><td><label class="form-check-label" for="no_folder_icons">'.$this->trans('Hide folder list icons').'</label></td>'.
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' value="1" id="no_folder_icons" name="no_folder_icons" />'.$reset.'</td></tr>';
     }
 }
 
@@ -843,8 +843,8 @@ protected function output() {
             $checked = '';
             $reset = '';
         }
-        return '<tr class="general_setting"><td><label for="no_password_save">'.$this->trans('Don\'t save account passwords between logins').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' value="1" id="no_password_save" name="no_password_save" />'.$reset.'</td></tr>';
+        return '<tr class="general_setting"><td><label class="form-check-label" for="no_password_save">'.$this->trans('Don\'t save account passwords between logins').'</label></td>'.
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' value="1" id="no_password_save" name="no_password_save" />'.$reset.'</td></tr>';
     }
 }
 
@@ -862,8 +862,8 @@ protected function output() {
             $checked = '';
             $reset = '';
         }
-        return '<tr class="general_setting"><td><label for="disable_delete_prompt">'.$this->trans('Disable prompts when deleting').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' value="1" id="disable_delete_prompt" name="disable_delete_prompt" />'.$reset.'</td></tr>';
+        return '<tr class="general_setting"><td><label class="form-check-label" for="disable_delete_prompt">'.$this->trans('Disable prompts when deleting').'</label></td>'.
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' value="1" id="disable_delete_prompt" name="disable_delete_prompt" />'.$reset.'</td></tr>';
     }
 }
 
@@ -876,8 +876,8 @@ class Hm_Output_start_flagged_settings extends Hm_Output_Module {
      * Settings in this section control the flagged messages view
      */
     protected function output() {
-        return '<tr><td data-target=".flagged_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$star.'" width="16" height="16" />'.
+        return '<tr><td data-target=".flagged_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-flag-fill fs-5 me-2"></i>'.
             $this->trans('Flagged').'</td></tr>';
     }
 }
@@ -894,8 +894,8 @@ protected function output() {
         if ($this->get('single_server_mode')) {
             return '';
         }
-        return '<tr><td data-target=".all_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$box.'" width="16" height="16" />'.
+        return '<tr><td data-target=".all_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-box2-fill fs-5 me-2"></i>'.
             $this->trans('Everything').'</td></tr>';
     }
 }
@@ -909,8 +909,8 @@ class Hm_Output_start_unread_settings extends Hm_Output_Module {
      * Settings in this section control the Unread view
      */
     protected function output() {
-        return '<tr><td data-target=".unread_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$env_closed.'" width="16" height="16" />'.
+        return '<tr><td data-target=".unread_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-envelope-fill fs-5 me-2"></i>'.
             $this->trans('Unread').'</td></tr>';
     }
 }
@@ -931,8 +931,8 @@ protected function output() {
         if ($this->get('single_server_mode')) {
             return '';
         }
-        return '<tr><td data-target=".email_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$env_closed.'" width="16" height="16" />'.
+        return '<tr><td data-target=".email_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-envelope-fill fs-5 me-2"></i>'.
             $this->trans('All Email').'</td></tr>';
     }
 }
@@ -946,8 +946,8 @@ class Hm_Output_start_general_settings extends Hm_Output_Module {
      * General settings like langauge and timezone will go here
      */
     protected function output() {
-        return '<tr><td data-target=".general_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$cog.'" width="16" height="16" />'.
+        return '<tr><td data-target=".general_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-gear-wide-connected fs-5 me-2"></i>'.
             $this->trans('General').'</td></tr>';
     }
 }
@@ -972,7 +972,7 @@ protected function output() {
         }
         return '<tr class="unread_setting"><td><label for="unread_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="unread_per_source" name="unread_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="unread_per_source" name="unread_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1016,7 +1016,7 @@ protected function output() {
         }
         return '<tr class="flagged_setting"><td><label for="flagged_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="flagged_per_source" name="flagged_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="flagged_per_source" name="flagged_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1063,7 +1063,7 @@ protected function output() {
         }
         return '<tr class="email_setting"><td><label for="all_email_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="all_email_per_source" name="all_email_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="all_email_per_source" name="all_email_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1087,7 +1087,7 @@ protected function output() {
         }
         return '<tr class="all_setting"><td><label for="all_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="all_per_source" name="all_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="all_per_source" name="all_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1153,7 +1153,7 @@ protected function output() {
         $mylang = $this->get('language', '');
         $res = '<tr class="general_setting"><td><label for="language">'.
             $this->trans('Language').'</label></td>'.
-            '<td><select id="language" name="language">';
+            '<td><select id="language" class="form-select form-select-sm w-auto" name="language">';
         foreach ($translated as $id => $lang) {
             $res .= '<option ';
             if ($id == $mylang) {
@@ -1188,7 +1188,7 @@ protected function output() {
             $myzone = false;
         }
         $res = '<tr class="general_setting"><td><label for="timezone">'.
-            $this->trans('Timezone').'</label></td><td><select id="timezone" name="timezone">';
+            $this->trans('Timezone').'</label></td><td><select class="w-auto form-select form-select-sm" id="timezone" name="timezone">';
         foreach ($zones as $zone) {
             $res .= '<option ';
             if ($zone == $myzone) {
@@ -1217,9 +1217,9 @@ protected function output() {
             $checked = ' checked="checked"';
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="show_list_icons">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="show_list_icons">'.
             $this->trans('Show icons in message lists').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="show_list_icons" name="show_list_icons" value="1" />'.$reset.'</td></tr>';
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' id="show_list_icons" name="show_list_icons" value="1" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1233,10 +1233,10 @@ class Hm_Output_end_settings_form extends Hm_Output_Module {
      */
     protected function output() {
         return '<tr><td class="submit_cell" colspan="2">'.
-            '<input class="save_settings" type="submit" name="save_settings" value="'.$this->trans('Save').'" />'.
-            '</td></tr></table></form>'.
-            '<form method="POST"><input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<input class="reset_factory_button" type="submit" name="reset_factory" value="'.$this->trans('Restore Defaults').'" /></form>'.
+            '<input class="save_settings btn btn-success" type="submit" name="save_settings" value="'.$this->trans('Save').'" />'.
+            '</td></tr></table></div></form>'.
+            '<div class="px-3 d-flex justify-content-end"><form method="POST"><input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
+            '<input class="reset_factory_button btn btn-light border" type="submit" name="reset_factory" value="'.$this->trans('Restore Defaults').'" /></form></div>'.
             '</div>';
     }
 }
@@ -1315,33 +1315,33 @@ protected function output() {
         if (!$single) {
             $res .= '<li class="menu_combined_inbox"><a class="unread_link" href="?page=message_list&amp;list_path=combined_inbox">';
             if (!$this->get('hide_folder_icons')) {
-                $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$box).'" alt="" width="16" height="16" /> ';
+                $res .= '<i class="bi bi-box2-fill fs-5 me-2"></i>';
             }
             $res .= $this->trans('Everything').'</a><span class="combined_inbox_count"></span></li>';
         }
-        $res .= '<li class="menu_unread"><a class="unread_link" href="?page=message_list&amp;list_path=unread">';
+        $res .= '<li class="menu_unread d-flex align-items-center"><a class="unread_link d-flex align-items-center" href="?page=message_list&amp;list_path=unread">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$env_closed).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-envelope-fill fs-5 me-2"></i>';
         }
-        $res .= $this->trans('Unread').'</a><span class="total_unread_count badge bg-secondary"></span></li>';
+        $res .= $this->trans('Unread').'</a><span class="total_unread_count badge bg-secondary ms-2 px-1"></span></li>';
         $res .= '<li class="menu_flagged"><a class="unread_link" href="?page=message_list&amp;list_path=flagged">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$star).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-flag-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Flagged').'</a> <span class="flagged_count"></span></li>';
         $res .= '<li class="menu_junk"><a class="unread_link" href="?page=message_list&amp;list_path=junk">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$junk).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-envelope-x-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Junk').'</a></li>';
         $res .= '<li class="menu_trash"><a class="unread_link" href="?page=message_list&amp;list_path=trash">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$trash).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-trash3-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Trash').'</a></li>';
         $res .= '<li class="menu_drafts"><a class="unread_link" href="?page=message_list&amp;list_path=drafts">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$draft).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-pencil-square fs-5 me-2"></i>';
         }
         $res .= $this->trans('Drafts').'</a></li>';
 
@@ -1360,7 +1360,7 @@ class Hm_Output_logout_menu_item extends Hm_Output_Module {
     protected function output() {
         $res =  '<li class="menu_logout"><a class="unread_link logout_link" href="#">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$power).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-power fs-5 me-2"></i>';
         }
         $res .= $this->trans('Logout').'</a></li>';
 
@@ -1416,7 +1416,7 @@ protected function output() {
             if ($name == 'Email' && !$single) {
                 $res .= '<li class="menu_email"><a class="unread_link" href="?page=message_list&amp;list_path=email">';
                 if (!$this->get('hide_folder_icons')) {
-                    $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$globe).'" alt="" width="16" height="16" /> ';
+                    $res .= '<i class="bi bi-globe-americas fs-5 me-2"></i>';
                 }
                 $res .= $this->trans('All').'</a> <span class="unread_mail_count"></span></li>';
             }
@@ -1443,7 +1443,7 @@ protected function output() {
             '</div><ul style="display: none;" class="settings folders">';
         $res .= '<li class="menu_home"><a class="unread_link" href="?page=home">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$home).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-house-door-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Home').'</a></li>';
         if ($this->format == 'HTML5') {
@@ -1506,7 +1506,7 @@ class Hm_Output_settings_servers_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_servers"><a class="unread_link" href="?page=servers">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$monitor).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-pc-display-horizontal fs-5 me-2"></i>';
         }
         $res .= $this->trans('Servers').'</a></li>';
         $this->concat('formatted_folder_list', $res);
@@ -1524,7 +1524,7 @@ class Hm_Output_settings_site_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_settings"><a class="unread_link" href="?page=settings">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$cog).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-gear-wide-connected fs-5 me-2"></i>';
         }
         $res .= $this->trans('Site').'</a></li>';
         $this->concat('formatted_folder_list', $res);
@@ -1545,7 +1545,7 @@ protected function output() {
         }
         $res = '<li class="menu_save"><a class="unread_link" href="?page=save">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$save).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-download fs-5 me-2"></i>';
         }
         $res .= $this->trans('Save').'</a></li>';
         $this->concat('formatted_folder_list', $res);
@@ -1610,7 +1610,7 @@ class Hm_Output_content_section_start extends Hm_Output_Module {
      * Opens a main tag for the primary content section
      */
     protected function output() {
-        return '<main class="container-fluid content_cell"><div class="offline">'.$this->trans('Offline').'</div><div class="row m-0">';
+        return '<main class="container-fluid content_cell"><div class="offline">'.$this->trans('Offline').'</div><div class="row m-0 position-relative">';
     }
 }
 
@@ -1746,7 +1746,7 @@ protected function output() {
                 $header_flds[] = '<th></th>';
             }
         }
-        $res = '<table class="message_table">';
+        $res = '<div class="p-3"><table class="message_table table pt-5">';
         if (!$this->get('no_message_list_headers')) {
             if (!empty($col_flds)) {
                 $res .= '<colgroup>'.implode('', $col_flds).'</colgroup>';
@@ -1864,7 +1864,7 @@ class Hm_Output_message_list_end extends Hm_Output_Module {
      * Close the table opened in Hm_Output_message_list_start
      */
     protected function output() {
-        $res = '</tbody></table><div class="page_links"></div></div>';
+        $res = '</tbody></table></div><div class="mb-5 page_links d-flex justify-content-center gap-3 align-content-center"></div></div>';
         return $res;
     }
 }
@@ -1896,8 +1896,8 @@ class Hm_Output_start_junk_settings extends Hm_Output_Module {
      * Settings in this section control the flagged messages view
      */
     protected function output() {
-        return '<tr><td data-target=".junk_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$junk.'" width="16" height="16" />'.
+        return '<tr><td data-target=".junk_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-envelope-x-fill fs-5 me-2"></i>'.
             $this->trans('Junk').'</td></tr>';
     }
 }
@@ -1922,7 +1922,7 @@ protected function output() {
         }
         return '<tr class="junk_setting"><td><label for="junk_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="junk_per_source" name="junk_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="junk_per_source" name="junk_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1955,8 +1955,8 @@ class Hm_Output_start_trash_settings extends Hm_Output_Module {
      * Settings in this section control the flagged messages view
      */
     protected function output() {
-        return '<tr><td data-target=".trash_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$trash.'" width="16" height="16" />'.
+        return '<tr><td data-target=".trash_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-trash3-fill fs-5 me-2"></i>'.
             $this->trans('Trash').'</td></tr>';
     }
 }
@@ -1981,7 +1981,7 @@ protected function output() {
         }
         return '<tr class="trash_setting"><td><label for="trash_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="trash_per_source" name="trash_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="trash_per_source" name="trash_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -2014,8 +2014,8 @@ class Hm_Output_start_drafts_settings extends Hm_Output_Module {
      * Settings in this section control the flagged messages view
      */
     protected function output() {
-        return '<tr><td data-target=".drafts_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$draft.'" width="16" height="16" />'.
+        return '<tr><td data-target=".drafts_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-pencil-square fs-5 me-2"></i>'.
             $this->trans('Drafts').'</td></tr>';
     }
 }
@@ -2040,7 +2040,7 @@ protected function output() {
         }
         return '<tr class="drafts_setting"><td><label for="drafts_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="drafts_per_source" name="drafts_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="drafts_per_source" name="drafts_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -2077,8 +2077,8 @@ protected function output() {
             $checked = ' checked="checked"';
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox" src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="warn_for_unsaved_changes">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="warn_for_unsaved_changes">'.
             $this->trans('Warn for unsaved changes').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="warn_for_unsaved_changes" name="warn_for_unsaved_changes" value="1" />'.$reset.'</td></tr>';
+            '<td><input type="checkbox" '.$checked.' id="warn_for_unsaved_changes" name="warn_for_unsaved_changes" class="form-check-input" value="1" />'.$reset.'</td></tr>';
     }
 }
diff --git a/modules/core/site.css b/modules/core/site.css
index b877deff38..6c7c7fd7e3 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -41,9 +41,7 @@ td { vertical-align: top; }
 #theme_setting, #timezone_setting { max-width: 200px; }
 .s_pre { color: #666}
 .message_table > thead > tr > th { display: none; }
-.message_table > tbody > tr > td { cursor: pointer; padding: 5px; padding-left: 10px; padding-top: 5px; padding-bottom: 3px; color: #333; border-bottom: solid 1px #ede8e6; }
-.message_table { table-layout: fixed; width: 100%; padding: 20px; padding-top: 15px; padding-bottom: 40px; padding-left: 20px; }
-.message_table > tbody > tr > th:hover { color: #000; }
+/* .message_table > tbody > tr > td { cursor: pointer; padding: 5px; padding-left: 10px; padding-top: 5px; padding-bottom: 3px; color: #333; border-bottom: solid 1px #ede8e6; } */
 .logout_form { white-space: nowrap; padding: 0px; margin: 0px; }
 .logout_form a { font-weight: bold; color: #666; }
 .logged_in { padding-left: 10px; float: right; padding-right: 10px; }
@@ -54,9 +52,9 @@ td { vertical-align: top; }
 .logout { cursor: pointer; background: #fff; font-size: 100%; }
 .server_content, .profile_content, .user_settings { display: table; table-layout: fixed; width: 100%; min-height: 500px; background: #fff; height: 100%; margin-right: 20px; padding-bottom: 40px; }
 .user_settings table { table-layout: fixed; width: 100%; }
-.user_settings table td { height: 34px; vertical-align: middle; padding: 5px; padding-left: 37px; padding-top: 10px; color: #666; }
+/* .user_settings table td { height: 34px; vertical-align: middle; padding: 5px; padding-left: 37px; padding-top: 10px; color: #666; } */
 /* .settings_table .save_settings { cursor: pointer; color: #666; font-size: 125%; padding: 10px !important; float: left !important; } */
-.reset_factory_button { cursor: pointer; color: #666; font-size: 100%; padding: 10px !important; float: right !important; margin-right: 20px;}
+.reset_factory_button { margin-top: -65px;}
 .disabled_link { color: #bbb; }
 /* .save_settings_password { float: left; margin-left: 0px; padding: 4px; } */
 .disabled_input, input:disabled { color: #aaa !important; background-color: #ddd; }
@@ -71,7 +69,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .inner_list a { padding-right: 5px; }
 .folders { margin-top: 10px; margin-bottom: 20px; margin-left: 20px !important;}
 .inner_list { margin-bottom: 10px; } 
-.folders a, .unread_link { color: #555; text-decoration: none; line-height: 1.25em; }
+/* .folders a, .unread_link { color: #555; text-decoration: none; line-height: 1.25em; } */
 .folder_list { background-color: #fff; margin-right: 20px; padding-right: 15px; padding-bottom: 40px; min-width: 200px; padding-top: 0px; }
 
 .folders, .inner_list { list-style-type: none; padding: 0px; margin-left: 10px; padding-right: 0px; }
@@ -83,7 +81,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .path_delim { opacity: .4; padding-left: 5px; vertical-align: 1px; padding-right: 3px; }
 .not_found { font-size: 150%; color: #999; padding: 50px; height: 100%; border-left: solid 1px #ddd; background-color: #fff; }
 .no_servers { text-align: center; padding: 50px; margin: auto; padding-bottom: 100px; }
-.selected_menu, .selected_menu a { color: teal !important; line-height: 1.25em;}
+.selected_menu, .selected_menu a { color: teal !important; line-height: 1.25em; font-weight: bolder !important;}
 .folder_list .update_message_list{ font-size: 80%; padding-top: 10px; float: right; }
 .src_name { white-space: nowrap; overflow: hidden; cursor: pointer; border-left: solid 1px #eee; padding-left: 25px; margin-top: 0px; margin-right: -15px; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; color: #777; padding-top: 10px; font-size: 125%; letter-spacing: -1px; padding-bottom: 10px; }
 .main_menu { padding-top: 20px; }
@@ -100,9 +98,6 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .confirm_logout { display: none; background-color: #eee; padding: 20px; position: absolute; left: 0px; top: 0px; border: solid 1px #ede8e6; z-index: 100; }
 /* .confirm_text {  padding-left: 10px; padding-bottom: 10px; } */
 .folder_list .update_unread { float: right; margin-top: 20px; }
-.page_links a { text-decoration: none; color: #111; }
-.page_links a img { opacity: .6; width: 16px; height: 16px; vertical-align: -2px; }
-.page_links { text-align: center; padding-top: 20px; }
 .checkbox_cell { width: 20px; padding-right: 10px !important; }
 .menu_caret { padding: 7px; float: right; margin-right: 10px; opacity: .15; }
 .news_cell { border: none !important; padding-bottom: 10px !important; padding-top: 10px !important; }
@@ -115,15 +110,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .news_cell .source {float: left; padding-right: 10px; font-size: 100% !important;}
 .news_cell .msg_date { clear: both; }
 .msg_img { max-width: 100%; }
-.wait { }
-/* .msg_controls { position: relative; display: none; padding-left: 0px; margin-right: 20px; } */
-/* .msg_controls_visible { display: inline; } */
-/* .msg_controls a { font-size: .6em; letter-spacing: 0px; color: #666; background-color: #fff; border: solid 1px #ede8e6; padding: 3px; width: auto; border-radius: 3px; vertical-align: 3px; display: inline-block !important; }
-.msg_controls a { margin-right: 3px; } */
-/* .toggle_link { padding-left: 4px !important; padding-right: 4px !important; padding-top: 4px !important;} */
 .list_settings_dialog { display: none; padding: 10px; position: absolute; top: 0px; right: 0px; width: 600px; background-color: #efefef; border: solid 1px #ede8e6; }
-/* .list_controls { position: absolute; right: 0px; padding-right: 10px; top: 0px; padding-top: 10px; background-color: #fff; } */
-/* .list_controls a { padding-right: 5px; } */
 .list_settings_dialog table { width: 1%; white-space: nowrap; }
 .list_settings_dialog table th { font-size: 90%; font-weight: normal; text-align: left; }
 .folder_toggle { font-size: 0px; float: left; margin: 15px; margin-top: 19px; display: none; }
@@ -134,22 +121,12 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .plink, .nlink { color: #666; }
 .plink:hover, .nlink:hover { color: teal !important; }
 .limit { width: 50px; margin-left: 20px; }
-/* .settings_subtitle { font-size: 115%; color: #777 !important; letter-spacing: -1px; padding-bottom: 6px !important; padding-left: 30px !important; height: 25px !important; padding-top: 15px !important; } */
-/* .server_section img, .settings_subtitle img { opacity: .4; padding-right: 10px; vertical-align: -1px; } */
-/* .settings_subtitle, .server_section { cursor: pointer; max-height: 50px; margin-top: 0px; color: #777; padding-bottom: 10px; padding-top: 15px; letter-spacing: -1px; font-size: 115%; padding-left: 30px; border-bottom: solid 1px #ede8e6; } */
-/* .list_meta { float: right; margin-right: 20px; letter-spacing: 0px; display: inline; color: #666 !important; font-size: 70% !important; margin-top: 2px; font-style: normal; margin-left: 20px; } */
-/* .list_meta b { color: #333 !important; font-weight: normal; padding-left: 5px; padding-right: 5px; vertical-align: 1px; } */
 .noscript { position: absolute; z-index: 100; right: 0px; left: 0px; top: 0px; bottom: 0px; background-color: #ede8e6; opacity: 1; padding-top: 100px; text-align: center; }
 .hide_folders { font-size: 0px; float: left; clear: none; margin-top: 10px; margin-left: 23px; }
 .hide_folders img { opacity: .4; }
 .section_caret { opacity: .15; vertical-align: 4px; padding-right: 10px; }
 .server_count { float: right; font-size: 90%; }
 .email_setting, .all_setting, .unread_setting, .flagged_setting, .general_setting, .junk_setting, .trash_setting, .drafts_setting { display: none; }
-/* .configured_server, .add_server { margin-top: 10px; color: #666; background-color: #fff; margin-bottom: 20px; padding: 10px; width: 200px; } */
-/* .message_list { min-height: 600px; background-color: #fff; height: 100%; padding-bottom: 20px; } */
-/* .configured_server { float: left; margin-left: 25px; width: 230px; } */
-/* .add_server { margin-right: 25px; float: left; clear: left; margin-left: 25px; width: 230px; } */
-/* .configured_server input, .add_server input, .add_server select { margin-bottom: 10px; padding: 5px; margin-right: 5px; } */
 .list_sources, .update_search_label_field { z-index: 100; border-left: solid 1px #ede8e6; border-bottom: solid 1px #ede8e6; position: absolute; right: 0px; top: 54px; background-color: #fafafa; font-size: 85%; padding: 30px; padding-top: 10px; display: none;}
 .list_src, .old_search_terms_label, .search_terms_label { color: #666; margin-bottom: 10px; }
 .old_search_terms_label, .search_terms_label { display: block; width: 100%; }
@@ -160,8 +137,6 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .search_terms { padding-left: 5px; }
 .folder_list .search_terms { width: 80%; }
 .search_content { display: table; table-layout: fixed; width: 100%; min-height: 600px; background: #fff; height: 100%; margin-right: 20px; padding-bottom: 40px; }
-/* .save_perm_form, .save_details { max-width: 600px; margin-left: 30px; margin-top: 20px; padding-right: 20px; color: #666; } */
-/* .save_subtitle { font-size: 110%; padding-top: 20px; } */
 .msg_text_inner p { padding: 5px; }
 .save_reminder { clear: both; float: right; margin-right: 25px; }
 .save_reminder img { opacity: .4; }
@@ -176,7 +151,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .home_password_dialogs { min-height: 400px; max-width: 480px; padding: 20px; margin: 20px; margin-right: 0px; float: left; border: solid 1px #eee; }
 .home_password_dialogs .pw_input { width: 120px; }
 .nux_title { font-size: 120%; margin-bottom: 20px; }
-.total_unread_count, .unread_count { background-color: #ccc; font-size: 90%; margin-left: 10px; padding: 0px; padding-bottom: 1px; border-radius: 4px 4px 4px 4px; vertical-align: 2px; font-weight: bold; color: #fff; }
+/* .total_unread_count, .unread_count { background-color: #ccc; font-size: 90%; margin-left: 10px; padding: 0px; padding-bottom: 1px; border-radius: 4px 4px 4px 4px; vertical-align: 2px; font-weight: bold; color: #fff; } */
 .debug_title { color: teal; position: fixed; background-color: #f5f5f5; bottom: 0px; right: 0px; padding: 20px; padding-left: 20px; }
 .long_session { float: left; }
 .long_session input { padding: 0px; float: none; }
@@ -227,7 +202,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .mobile .folder_toggle { display: block; top: 0px; left: -3px; }
 .mobile .folder_toggle img { width: 24px; height: 32px; margin-top: -7px; }
 .mobile .folder_toggle { position: fixed; z-index: 101; }
-.mobile .message_table { padding-left: 5px !important; margin-top: 30px !important; }
+.mobile .message_table { padding-left: 5px !important; margin-top: 70px !important; }
 .mobile .list_settings_link, .mobile .refresh_list { width: 24px; height: 24px; vertical-align: -13px; }
 .mobile .refresh_list { margin-right: 5px; }
 .mobile .update_message_list { margin-right: 20px; }
@@ -265,8 +240,6 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .mobile .imap_filter { display: none; }
 .mobile .list_controls { color: #777; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); height: 48px; padding-left: 5px; padding-right: 5px; }
 .mobile .list_controls img { margin-top: 10px }
-.mobile .page_links { font-size: 150%; }
-.mobile .page_links a img { width: 24px; height: 24px; }
 .mobile .toggle_link { padding: 4px 6px !important; line-height: normal !important; margin-left: -3px !important; margin-top: -4px; position: relative; }
 .mobile .toggle_link img { vertical-align: -3px !important; width: 16px; height: 16px; margin-left: -3px !important}
 .mobile .compose_form { padding: 0px !important; padding-left: 5px !important; width: 92% !important; }
diff --git a/modules/developer/modules.php b/modules/developer/modules.php
index 9725ee66e5..f6bd154248 100644
--- a/modules/developer/modules.php
+++ b/modules/developer/modules.php
@@ -127,7 +127,7 @@ class Hm_Output_developer_doc_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_dev"><a class="unread_link" href="?page=dev">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$bug).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-bug-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Dev').'</a></li>';
         if ($this->format == 'HTML5') {
@@ -149,7 +149,7 @@ class Hm_Output_info_page_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_info"><a class="unread_link" href="?page=info">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$info).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-info-circle fs-5 me-2"></i>';
         }
         $res .= $this->trans('Info').'</a></li>';
         if ($this->format == 'HTML5') {
diff --git a/modules/dynamic_login/modules.php b/modules/dynamic_login/modules.php
index 9cc1aac952..abe9bb328e 100644
--- a/modules/dynamic_login/modules.php
+++ b/modules/dynamic_login/modules.php
@@ -105,7 +105,7 @@ protected function output() {
                 $res .= '<input type="hidden" value="other" name="email_provider" />';
             }
             else {
-                $res .= '<select class="dynamic_service_select" required name="email_provider"><option value="">'.
+                $res .= '<select class="dynamic_service_select form-select m-3 w-auto" required name="email_provider"><option value="">'.
                     $this->trans('E-mail Provider').'</option>'.Nux_Quick_Services::option_list(false, $this).
                     '<option value="other">'.$this->trans('Other').'</option></select><br />';
             }
diff --git a/modules/dynamic_login/site.css b/modules/dynamic_login/site.css
index d4edef074a..e69de29bb2 100644
--- a/modules/dynamic_login/site.css
+++ b/modules/dynamic_login/site.css
@@ -1 +0,0 @@
-.dynamic_service_select { margin-top: 10px; margin-bottom: 10px; width: 160px !important; margin-left: 20px; }
diff --git a/modules/feeds/modules.php b/modules/feeds/modules.php
index cf464dc9d5..387620141c 100644
--- a/modules/feeds/modules.php
+++ b/modules/feeds/modules.php
@@ -543,10 +543,10 @@ protected function output() {
                             <div class="server_count">'.$count.'</div>
                         </div>
 
-                        <div class="feeds_section px-4 pt-3">
+                        <div class="feeds_section px-4 pt-3 me-0">
                             <div class="row">
                                 <div class="col-12 col-lg-4 mb-4">
-                                    <form class="add_server" method="POST">
+                                    <form class="add_server me-0" method="POST">
                                         <input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />
 
                                         <div class="subtitle mt-4">'.$this->trans('Add an RSS/ATOM Feed').'</div>
@@ -794,21 +794,21 @@ protected function output() {
         if (is_array($folders) && !empty($folders)) {
             $res .= '<li class="menu_feeds"><a class="unread_link" href="?page=message_list&amp;list_path=feeds">';
             if (!$this->get('hide_folder_icons')) {
-                $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$rss_alt).'" alt="" width="16" height="16" /> ';
+                $res .= '<i class="bi bi-rss-fill fs-5 me-2"></i>';
             }
             $res .= $this->trans('All').'</a> <span class="unread_feed_count"></span></li>';
             foreach ($this->get('feed_folders') as $id => $folder) {
                 $res .= '<li class="feeds_'.$this->html_safe($id).'">'.
                     '<a data-id="feeds_'.$this->html_safe($id).'" href="?page=message_list&list_path=feeds_'.$this->html_safe($id).'">';
                 if (!$this->get('hide_folder_icons')) {
-                    $res .= '<img class="account_icon" alt="'.$this->trans('Load Feed').'" src="'.Hm_Image_Sources::$rss.'" width="16" height="16" /> ';
+                    $res .= '<i class="bi bi-rss fs-5 me-2"></i>';
                 }
                 $res .= $this->html_safe($folder).'</a></li>';
             }
         }
         $res .= '<li class="feeds_add_new"><a href="?page=servers#feeds_section">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$plus).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-plus-square fs-5 me-2"></i>';
         }
         $res .= $this->trans('Add a feed').'</a></li>';
         if ($res) {
@@ -846,8 +846,8 @@ protected function output() {
             $checked = '';
             $reset = '';
         }
-        return '<tr class="unread_setting"><td><label for="unread_exclude_feeds">'.$this->trans('Exclude unread feed items').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' value="1" id="unread_exclude_feeds" name="unread_exclude_feeds" />'.$reset.'</td></tr>';
+        return '<tr class="unread_setting"><td><label class="form-check-label" for="unread_exclude_feeds">'.$this->trans('Exclude unread feed items').'</label></td>'.
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' value="1" id="unread_exclude_feeds" name="unread_exclude_feeds" />'.$reset.'</td></tr>';
     }
 }
 
@@ -871,8 +871,8 @@ protected function output() {
  */
 class Hm_Output_start_feed_settings extends Hm_Output_Module {
     protected function output() {
-        return '<tr><td colspan="2" data-target=".feeds_setting" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$rss.'" width="16" height="16" />'.$this->trans('Feed Settings').'</td></tr>';
+        return '<tr><td colspan="2" data-target=".feeds_setting" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-rss-fill fs-5 me-2"></i>'.$this->trans('Feed Settings').'</td></tr>';
     }
 }
 
@@ -906,7 +906,7 @@ protected function output() {
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
         return '<tr class="feeds_setting"><td><label for="feed_limit">'.$this->trans('Max feed items to display').'</label></td>'.
-            '<td><input type="text" id="feed_limit" name="feed_limit" size="2" value="'.$this->html_safe($limit).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" id="feed_limit" name="feed_limit" size="2" value="'.$this->html_safe($limit).'" />'.$reset.'</td></tr>';
     }
 }
 
diff --git a/modules/feeds/site.css b/modules/feeds/site.css
index 03362f165c..e69de29bb2 100644
--- a/modules/feeds/site.css
+++ b/modules/feeds/site.css
@@ -1,6 +0,0 @@
-/* .feeds_section { display: none; } */
-/* .feed_server_setup .content_title { cursor: pointer; } */
-/* .feeds_setting { display: none; } */
-/* .feeds_section .configured_server, .feeds_section .add_server { height: 140px; } */
-.feeds_section .add_server { margin-right: 0px; }
-.feeds .source a { color: #666; }
diff --git a/modules/highlights/modules.php b/modules/highlights/modules.php
index 4491c7affb..329dbc7666 100644
--- a/modules/highlights/modules.php
+++ b/modules/highlights/modules.php
@@ -333,7 +333,7 @@ class Hm_Output_highlight_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_highlights"><a class="unread_link" href="?page=highlights">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$tags).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-highlighter fs-5 me-2"></i>';
         }
         $res .= $this->trans('Highlights').'</a></li>';
         if ($this->format == 'HTML5') {
diff --git a/modules/history/modules.php b/modules/history/modules.php
index 07ad0dbac8..e10393f82d 100644
--- a/modules/history/modules.php
+++ b/modules/history/modules.php
@@ -181,7 +181,7 @@ class Hm_Output_history_page_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_history"><a class="unread_link" href="?page=history">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$history).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-clock-history fs-5 me-2"></i>';
         }
         $res .= $this->trans('History').'</a></li>';
         if ($this->format == 'HTML5') {
diff --git a/modules/idle_timer/modules.php b/modules/idle_timer/modules.php
index 4520a8351b..3148ad742d 100644
--- a/modules/idle_timer/modules.php
+++ b/modules/idle_timer/modules.php
@@ -101,7 +101,7 @@ protected function output() {
             $idle_time = 1;
         }
         $res = '<tr class="general_setting"><td><label for="idle_time">'.$this->trans('Allowed idle time until logout').'</label></td>'.
-            '<td><select id="idle_time" name="idle_time">';
+            '<td><select class="form-select form-select-sm w-auto" id="idle_time" name="idle_time">';
         foreach ($options as $val => $label) {
             $res .= '<option ';
             if ($idle_time == $val) {
diff --git a/modules/imap/functions.php b/modules/imap/functions.php
index d73eac2340..03d858723b 100644
--- a/modules/imap/functions.php
+++ b/modules/imap/functions.php
@@ -121,7 +121,7 @@ function format_imap_folder_section($folders, $id, $output_mod) {
             $results .= '<a href="#" class="imap_folder_link expand_link" data-target="imap_'.intval($id).'_'.$output_mod->html_safe($folder_name).'">+</a>';
         }
         else {
-            $results .= ' <img class="folder_icon" src="'.Hm_Image_Sources::$folder.'" alt="" width="16" height="16" />';
+            $results .= '<i class="bi bi-folder2-open"></i> ';
         }
         if (!$folder['noselect']) {
             if (strlen($output_mod->html_safe($folder['basename']))>15) {
diff --git a/modules/imap/output_modules.php b/modules/imap/output_modules.php
index 006529801b..8cd3d041bb 100644
--- a/modules/imap/output_modules.php
+++ b/modules/imap/output_modules.php
@@ -534,9 +534,10 @@ protected function output() {
         if ($this->get('sieve_filters_enabled')) {
             $sieve_extra = '<tr class="sieve_config" style="display: none;"><td><div class="subtitle">'.$this->trans('Sieve Configuration').'</div></td></tr>'.
                 '<tr class="sieve_config" style="display: none;"><td colspan="2"><label class="screen_reader" for="new_imap_port">'.$this->trans('Sieve Host').'</label>'.
-                '<input type="text" id="sieve_config_host" name="sieve_config_host" class="txt_fld" placeholder="'.$this->trans('localhost:4190').'"></td></tr>';
-            $sieve_extra2 = '<tr><td colspan="2"><input type="checkbox" id="enable_sieve_filter" name="enable_sieve_filter" class="" value="0">'.
-                '<label for="enable_sieve_filter">'.$this->trans('Enable Sieve Filters').'</label></td></tr>';
+                '<input class="form-control" type="text" id="sieve_config_host" name="sieve_config_host" class="txt_fld" placeholder="'.$this->trans('localhost:4190').'"></td></tr>';
+            
+                $sieve_extra2 = '<tr><td colspan="2"><div class="form-check mb-3 mt-2"><input type="checkbox" id="enable_sieve_filter" name="enable_sieve_filter" class="form-check-input" value="0">'.
+                '<label for="enable_sieve_filter" class="form-check-label"> '.$this->trans('Enable Sieve Filters').'</label></div></td></tr>';
         }
 
         return '<div class="imap_server_setup"><div data-target=".imap_section" class="server_section border-bottom cursor-pointer px-1 py-2 mt-4">'.
@@ -545,7 +546,7 @@ protected function output() {
             '<div class="server_count">'.$count.'</div></div>
             <div class="imap_section px-4 pt-3">
                 <div class="row">
-                    <div class="col-12 col-lg-4">
+                    <div class="col-12 col-lg-4 mb-4">
                         <form class="add_server" method="POST">'.
                             '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
                             '<div class="subtitle">'.$this->trans('Add an IMAP Server').'</div>'.
@@ -568,7 +569,7 @@ protected function output() {
                             $sieve_extra.
 
                             // Checkbox for Hide From Combined Pages
-                            '<div class="form-check mb-3">'.
+                            '<div class="form-check mb-3 mt-2">'.
                             '<input type="checkbox" id="new_imap_hidden" name="new_imap_hidden" class="form-check-input" value="1">'.
                             '<label for="new_imap_hidden" class="form-check-label">'.$this->trans('Hide From Combined Pages').'</label></div>'.
 
@@ -842,7 +843,7 @@ protected function output() {
             foreach ($this->get('imap_folders', array()) as $id => $folder) {
                 $res .= '<li class="imap_'.intval($id).'_"><a href="#" class="imap_folder_link" data-target="imap_'.intval($id).'_">';
                 if (!$this->get('hide_folder_icons')) {
-                    $res .= '<img class="account_icon" alt="'.$this->trans('Toggle folder').'" src="'.Hm_Image_Sources::$folder.'" width="16" height="16" /> ';
+                    $res .= '<i class="bi bi-folder fs-5 me-2"></i>';
                 }
                 $res .= $this->html_safe($folder).'</a></li>';
             }
@@ -1001,8 +1002,8 @@ class Hm_Output_start_sent_settings extends Hm_Output_Module {
      * Settings in this section control the Sent E-mail view.
      */
     protected function output() {
-        return '<tr><td data-target=".sent_setting" colspan="2" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$env_closed.'" width="16" height="16" />'.
+        return '<tr><td data-target=".sent_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-envelope-fill fs-5 me-2"></i>'.
             $this->trans('Sent').'</td></tr>';
     }
 }
@@ -1061,9 +1062,9 @@ protected function output() {
         if (array_key_exists('unread_on_open', $settings) && $settings['unread_on_open']) {
             $checked = ' checked="checked"';
         }
-        return '<tr class="general_setting"><td><label for="unread_on_open">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="unread_on_open">'.
             $this->trans('Don\'t flag a message as read on open').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="unread_on_open" name="unread_on_open" value="1" /></td></tr>';
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' id="unread_on_open" name="unread_on_open" value="1" /></td></tr>';
     }
 }
 
@@ -1081,9 +1082,9 @@ protected function output() {
         } else {
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="simple_msg_parts">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="simple_msg_parts">'.
             $this->trans('Show simple message part structure when reading a message').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="simple_msg_parts" name="simple_msg_parts" value="1" />'.$reset.'</td></tr>';
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' id="simple_msg_parts" name="simple_msg_parts" value="1" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1101,9 +1102,9 @@ protected function output() {
         } else {
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox" src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        $res = '<tr class="general_setting"><td><label for="pagination_links">'.
+        $res = '<tr class="general_setting"><td><label class="form-check-label" for="pagination_links">'.
             $this->trans('Show next & previous emails when reading a message').'</label></td>'.
-            '<td><input type="checkbox"'.$checked.' id="pagination_links" name="pagination_links" value="1" />'.$reset.'</td></tr>';
+            '<td><input class="form-check-input" type="checkbox"'.$checked.' id="pagination_links" name="pagination_links" value="1" />'.$reset.'</td></tr>';
         return $res;
     }
 }
@@ -1138,7 +1139,7 @@ protected function output() {
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
         return '<tr class="general_setting"><td><label for="imap_per_page">'.
-            $this->trans('Messages per page for IMAP folder views').'</label></td><td><input type="text" id="imap_per_page" '.
+            $this->trans('Messages per page for IMAP folder views').'</label></td><td><input class="form-control form-control-sm w-auto" type="text" id="imap_per_page" '.
             'name="imap_per_page" value="'.$this->html_safe($per_page).'" />'.$reset.'</td></tr>';
     }
 }
@@ -1159,7 +1160,7 @@ protected function output() {
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" default-value="'.DEFAULT_MAX_GOOGLE_CONTACTS_NUMBER.'" src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
         return '<tr class="general_setting"><td><label for="max_google_contacts_number">'.
-            $this->trans('Max google contacts number').'</label></td><td><input type="number" id="max_google_contacts_number" '.
+            $this->trans('Max google contacts number').'</label></td><td><input class="form-control form-control-sm w-auto" type="number" id="max_google_contacts_number" '.
             'name="max_google_contacts_number" value="'.$this->html_safe($max_google_contacts_number).'" />'.$reset.'</td></tr>';
     }
 }
@@ -1177,9 +1178,9 @@ protected function output() {
             $checked = ' checked="checked"';
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="msg_part_icons">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="msg_part_icons">'.
             $this->trans('Show message part icons when reading a message').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="msg_part_icons" name="msg_part_icons" value="1" />'.$reset.'</td></tr>';
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' id="msg_part_icons" name="msg_part_icons" value="1" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1196,9 +1197,9 @@ protected function output() {
             $checked = ' checked="checked"';
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="text_only">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="text_only">'.
             $this->trans('Prefer text over HTML when reading messages').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="text_only" name="text_only" value="1" />'.$reset.'</td></tr>';
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' id="text_only" name="text_only" value="1" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1219,7 +1220,7 @@ protected function output() {
         }
         return '<tr class="sent_setting"><td><label for="sent_per_source">'.
             $this->trans('Max messages per source').'</label></td>'.
-            '<td><input type="text" size="2" id="sent_per_source" name="sent_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
+            '<td><input class="form-control form-control-sm w-auto" type="text" size="2" id="sent_per_source" name="sent_per_source" value="'.$this->html_safe($sources).'" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1236,9 +1237,9 @@ protected function output() {
             $checked = ' checked="checked"';
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="original_folder">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="original_folder">'.
             $this->trans('Archive to the original folder').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="original_folder" name="original_folder" value="1" />'.$reset.'</td></tr>';
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' id="original_folder" name="original_folder" value="1" />'.$reset.'</td></tr>';
     }
 }
 
@@ -1254,9 +1255,9 @@ protected function output() {
             $checked = ' checked="checked"';
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="review_sent_email">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="review_sent_email">'.
             $this->trans('Review sent message').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.' id="review_sent_email" name="review_sent_email" value="1" />'.$reset.'</td></tr>';
+            '<td><input class="form-check-input" type="checkbox" '.$checked.' id="review_sent_email" name="review_sent_email" value="1" />'.$reset.'</td></tr>';
     }
 }
 
diff --git a/modules/imap/site.css b/modules/imap/site.css
index 03acaebc9d..c22d2cdbc6 100644
--- a/modules/imap/site.css
+++ b/modules/imap/site.css
@@ -13,7 +13,7 @@
 .server_subtitle { margin-bottom: 20px; color: #666; overflow: hidden; text-overflow: ellipsis}
 .msg_text { min-height: 600px; background-color: #fff; height: 100%; }
 .msg_text_inner { min-height: 300px; font-family: monospace; width: 90%; padding: 30px; padding-left: 40px; }
-.msg_headers { max-width: 100%; border-bottom: solid 1px #ddd; color: #777; padding: 0px; padding-bottom: 10px; padding-top: 10px; }
+/* .msg_headers { max-width: 100%; border-bottom: solid 1px #ddd; color: #777; padding: 0px; padding-bottom: 10px; padding-top: 10px; } */
 .imap_envelope { max-width: 100%; color: #777; padding: 0px; padding-bottom: 20px; padding-top: 0px; margin-top: -10px; }
 .imap_envelope th, .msg_headers th { vertical-align: top; padding: 3px; padding-top: 5px; padding-left: 35px; font-weight: normal; text-align: left; white-space: nowrap; padding-right: 13px; }
 .imap_envelope th { padding-left: 0px; }
@@ -23,7 +23,6 @@
 .header_links { padding-top: 10px !important; }
 .header_links a { float: none !important; padding-left: 3px !important; padding-right: 3px !important; }
 .overlay {position: fixed; height: 100%; width: 100%; z-index: 100; background-color: #ccc; opacity: .7; }
-.current_page { font-weight: bold; }
 .account_row { cursor: pointer; }
 .expand_link { display: block; width: 16px; height: 16px; float: left; margin-right: 0px; margin-left: 0px; font-size: 16px; text-align: left; }
 .header_subject th { font-size: 1.3em; padding-top: 10px; }
@@ -98,8 +97,7 @@
 .cypht-dropdown a { padding: 8px; padding-left: 15px !important; padding-right: 15px !important; white-space: nowrap; font-size: 1rem; display: block !important; margin-right: 0; border: 0; cursor: pointer; }
 .cypht-dropdown a:hover { background-color: #eee; }
 #block_sender_form { padding: 15px; display: block; }
-#block_sender_form label, #block_sender_form select, #block_sender_form textarea, #block_sender_form button { display: block; margin: 3px 0; width: 100%; }
-#block_sender_form button { color: #fff; background-color: brown; cursor: pointer; }
+#block_sender_form label, #block_sender_form select, #block_sender_form textarea { display: block; margin: 3px 0; width: 100%; }
 #block_sender_form label { text-transform: capitalize; }
 
 .snooze_date_picker, .snooze_helper { color: #333; text-transform: capitalize; }
diff --git a/modules/imap_folders/modules.php b/modules/imap_folders/modules.php
index b4047613e8..7abdc726b3 100644
--- a/modules/imap_folders/modules.php
+++ b/modules/imap_folders/modules.php
@@ -708,7 +708,7 @@ protected function output() {
         if ($this->get('imap_support')) {
             $res = '<li class="menu_folders"><a class="unread_link" href="?page=folders">';
             if (!$this->get('hide_folder_icons')) {
-                $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$folder).'" alt="" width="16" height="16" /> ';
+                $res .= '<i class="bi bi-folder-fill fs-5 me-2"></i>';
             }
             $res .= $this->trans('Folders').'</a></li>';
             if ($this->format == 'HTML5') {
diff --git a/modules/inline_message/modules.php b/modules/inline_message/modules.php
index 02cd95cb22..38a303c6fe 100644
--- a/modules/inline_message/modules.php
+++ b/modules/inline_message/modules.php
@@ -66,11 +66,11 @@ protected function output() {
         if (array_key_exists('inline_message', $settings)) {
             $inline = $settings['inline_message'];
         }
-        $res = '<tr class="general_setting"><td>'.$this->trans('Show messages inline').'</td><td><input value="1" type="checkbox" name="inline_message"';
+        $res = '<tr class="general_setting"><td><label class="form-check-label" for="inline_message">'.$this->trans('Show messages inline').'</label></td><td><input value="1" type="checkbox" class="form-check-input" name="inline_message" id="inline_message"';
         $reset = '';
         if ($inline) {
             $res .= ' checked="checked"';
-            $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
+            $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><i class="bi bi-arrow-counterclockwise fs-6 cursor-pointer refresh_list reset_default_value_checkbox"></i></span>';
         }
         $res .= '>'.$reset.'</td></tr>';
         return $res;
@@ -88,7 +88,7 @@ protected function output() {
         if (array_key_exists('inline_message_style', $settings)) {
             $selected = $settings['inline_message_style'];
         }
-        $res = '<tr class="general_setting"><td>'.$this->trans('Inline Message Style').'</td><td><select name="inline_message_style">';
+        $res = '<tr class="general_setting"><td>'.$this->trans('Inline Message Style').'</td><td><select class="form-select form-select-sm w-auto" name="inline_message_style">';
         $res .= '<option ';
         if ($selected == 'right') {
             $res .= 'selected="selected" ';
diff --git a/modules/keyboard_shortcuts/modules.php b/modules/keyboard_shortcuts/modules.php
index a0a43c1c3e..70cc401775 100644
--- a/modules/keyboard_shortcuts/modules.php
+++ b/modules/keyboard_shortcuts/modules.php
@@ -99,15 +99,15 @@ protected function output() {
         $settings = $this->get('user_settings');
         if (array_key_exists('enable_keyboard_shortcuts', $settings) && $settings['enable_keyboard_shortcuts']) {
             $checked = ' checked="checked"';
-            $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
+            $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><i class="bi bi-arrow-counterclockwise fs-6 cursor-pointer refresh_list reset_default_value_checkbox"></i></span>';
         }
         else {
             $checked = '';
             $reset='';
         }
-        return '<tr class="general_setting"><td><label for="enable_keyboard_shortcuts">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="enable_keyboard_shortcuts">'.
             $this->trans('Enable keyboard shortcuts').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.
+            '<td><input class="form-check-input" type="checkbox" '.$checked.
             ' value="1" id="enable_keyboard_shortcuts" name="enable_keyboard_shortcuts" />'.$reset.'</td></tr>';
     }
 }
@@ -117,7 +117,7 @@ protected function output() {
  */
 class Hm_Output_start_shortcuts_page extends Hm_Output_Module {
     protected function output() {
-        return '<div class="shortcut_content"><div class="content_title">'.$this->trans('Shortcuts').'</div>';
+        return '<div class="shortcut_content px-0"><div class="content_title px-3">'.$this->trans('Shortcuts').'</div>';
     }
 }
 
@@ -132,15 +132,15 @@ protected function output() {
         }
         $codes = keycodes();
         $meta = array('none', 'shift', 'control', 'alt', 'meta');
-        $res = '<div class="settings_subtitle">'.$this->trans('Edit Shortcut').'</div>';
-        $res .= '<div class="edit_shortcut_form"><form method="POST" action="?page=shortcuts&edit_id='.$this->html_safe($details['id']).'">';
+        $res = '<div class="settings_subtitle p-3">'.$this->trans('Edit Shortcut').'</div>';
+        $res .= '<div class="edit_shortcut_form px-5"><form method="POST" action="?page=shortcuts&edit_id='.$this->html_safe($details['id']).'">';
         $res .= '<input type="hidden" name="shortcut_id" value="'.$this->html_safe($details['id']).'" />';
         $res .= '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />';
         $res .= '<table>';
         $res .= '<tr><th colspan="2">'.$this->trans(ucfirst($details['group'])).' : '.
             $this->trans($details['label']).'</th></tr>';
         $res .= '<tr><td>'.$this->trans('Modifier Key(s)').'</td>';
-        $res .= '<td><select required multiple size="5" name="shortcut_meta[]">';
+        $res .= '<td><select class="form-select form-select-sm" required multiple size="5" name="shortcut_meta[]">';
         foreach ($meta as $v) {
             $res .= '<option ';
             if (in_array($v, $details['control_chars'], true)) {
@@ -153,7 +153,7 @@ protected function output() {
         }
         $res .= '</select></td></tr>';
         $res .= '<tr><td>'.$this->trans('Character').'</td>';
-        $res .= '<td><select required " name="shortcut_key">';
+        $res .= '<td><select class="form-select form-select-sm" required " name="shortcut_key">';
         foreach ($codes as $name => $val) {
             $res .= '<option ';
             if ($val == $details['char']) {
@@ -162,9 +162,11 @@ protected function output() {
             $res .= 'value="'.$this->html_safe($val).'">'.$this->html_safe($name).'</option>';
         }
         $res .= '</select></td></tr>';
-        $res .= '<tr><td colspan="2"><input type="submit" value="'.
-            $this->trans('Update').'" /> <input type="button" value="'.
-            $this->trans('Cancel').'" class="reset_shortcut" /></td></tr>';
+        $res .= '<tr><td colspan="2">
+                        <input type="submit" class="btn btn-success" value="'.$this->trans('Update').'" /> 
+                        <input type="button" class="btn btn-light border reset_shortcut" value="'.$this->trans('Cancel').'" />
+                </td></tr>';
+        
         $res .= '</table></form></div>';
         return $res;
     }
@@ -177,11 +179,11 @@ class Hm_Output_shortcuts_content extends Hm_Output_Module {
     protected function output() {
         $shortcuts = $this->get('keyboard_shortcut_data');
         $res = '<table class="shortcut_table">';
-        $res .= '<tr><td colspan="3" class="settings_subtitle">'.$this->trans('General').'</th></tr>';
+        $res .= '<tr><td colspan="3" class="settings_subtitle px-3">'.$this->trans('General').'</th></tr>';
         $res .= format_shortcut_section($shortcuts, 'general', $this);
-        $res .= '<tr><td colspan="3" class="settings_subtitle">'.$this->trans('Message List').'</td></tr>';
+        $res .= '<tr><td colspan="3" class="settings_subtitle px-3">'.$this->trans('Message List').'</td></tr>';
         $res .= format_shortcut_section($shortcuts, 'message_list', $this);
-        $res .= '<tr><td colspan="3" class="settings_subtitle">'.$this->trans('Message View').'</td></tr>';
+        $res .= '<tr><td colspan="3" class="settings_subtitle px-3">'.$this->trans('Message View').'</td></tr>';
         $res .= format_shortcut_section($shortcuts, 'message', $this);
         $res .= '</table>';
         $res .= '</div>';
@@ -208,7 +210,7 @@ protected function output() {
         if ($this->get('shortcuts_enabled')) {
             $res = '<li class="menu_shortcuts"><a class="unread_link" href="?page=shortcuts">';
             if (!$this->get('hide_folder_icons')) {
-                $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$code).'" alt="" width="16" height="16" /> ';
+                $res .= '<i class="bi bi-code-slash fs-5 me-2"></i>';
             }
             $res .= $this->trans('Shortcuts').'</a></li>';
             if ($this->format == 'HTML5') {
@@ -234,10 +236,9 @@ function format_shortcut_section($data, $type, $output_mod) {
             }
             $char = array_search($vals['char'], $codes);
             $res .= sprintf('<tr><th class="keys">%s %s</th><th>%s</th>'.
-                '<td><a href="?page=shortcuts&edit_id=%s"><img width="16" height="16" alt="'.
-                $output_mod->trans('Update').'" class="kbd_config" src="%s" /><a></td></tr>',
+                '<td><a href="?page=shortcuts&edit_id=%s"><i class="kbd_config cursor-pointer bi bi-gear-wide-connected text-secondary fs-5"></i><a></td></tr>',
                 $output_mod->html_safe($c_keys), $output_mod->html_safe($char),
-                $output_mod->trans($vals['label']), $index, Hm_Image_Sources::$cog);
+                $output_mod->trans($vals['label']), $index);
         }
     }
     return $res;
diff --git a/modules/keyboard_shortcuts/site.css b/modules/keyboard_shortcuts/site.css
index 64178136b6..1c1a02bb89 100644
--- a/modules/keyboard_shortcuts/site.css
+++ b/modules/keyboard_shortcuts/site.css
@@ -1,10 +1,10 @@
-.shortcut_content { width: 100%; padding-bottom: 30px; }
-.shortcut_content .edit_shortcut_form { width: 1%; margin: 20px; margin-left: 40px; }
+/* .shortcut_content { width: 100%; padding-bottom: 30px; }
+.shortcut_content .edit_shortcut_form { width: 1%; margin: 20px; margin-left: 40px; } */
 .edit_shortcut_form table th, .edit_shortcut_form table td { padding-bottom: 10px; padding-right: 20px; text-align: left; font-weight: normal; white-space: nowrap; }
-.edit_shortcut_form select { overflow-y: auto; }
+/* .edit_shortcut_form select { overflow-y: auto; } */
 .edit_shortcut_form table th { font-size: 115%; padding-bottom: 20px; }
 .shortcut_table { width: 50%; }
-.kbd_config { cursor: pointer; opacity: .4; }
+/* .kbd_config { cursor: pointer; opacity: .4; } */
 .shortcut_table th { padding-left: 40px; font-weight: normal; padding-top: 6px; padding-bottom: 3px; text-align: left; }
 .shortcut_table td { padding-top: 5px; }
 .shortcut_table .settings_subtitle { cursor: auto; }
diff --git a/modules/ldap_contacts/modules.php b/modules/ldap_contacts/modules.php
index 7ca14aa7b1..837bc56a7c 100644
--- a/modules/ldap_contacts/modules.php
+++ b/modules/ldap_contacts/modules.php
@@ -457,7 +457,7 @@ protected function output() {
         $current = $this->get('current_ldap_contact');
         $current_source = false;
         if ($current) {
-            $form_class = 'contact_update_form';
+            $form_class = 'contact_update_form mt-3';
             $current_source = $current['source'];
             $title = sprintf($this->trans('Update LDAP - %s'), $this->html_safe($current_source));
         }
diff --git a/modules/local_contacts/modules.php b/modules/local_contacts/modules.php
index 00c0b1e3c0..2c9b9bdd74 100644
--- a/modules/local_contacts/modules.php
+++ b/modules/local_contacts/modules.php
@@ -150,14 +150,13 @@ protected function output() {
             if (array_key_exists('phone_number', $current)) {
                 $phone = $current['phone_number'];
             }
-            $form_class = 'contact_update_form';
+            $form_class = 'contact_update_form mt-3';
             $title = $this->trans('Update Local');
             $button = '<input type="hidden" name="contact_id" value="'.$this->html_safe($current['id']).'" />'.
                 '<input class="btn btn-success edit_contact_submit" type="submit" name="edit_contact" value="'.$this->trans('Update').'" />';
         }
-        return '<div class="add_contact"><form class="" method="POST">'.
-            '<div class="server_title mt-2 btn btn-light"><i class="bi bi-person-add me-2"></i>'.$title.
-            '<img alt="" class="menu_caret" src="'.Hm_Image_Sources::$chevron.'" width="8" height="8" /></div>'.
+        return '<div class="add_contact kokokoko"><form class="" method="POST">'.
+            '<button class="server_title mt-2 btn btn-light"><i class="bi bi-person-add me-2"></i>'.$title.'</button>'.
             '<div class="'.$form_class.'">'.
             '<input type="hidden" name="contact_source" value="local" />'.
             '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
diff --git a/modules/profiles/modules.php b/modules/profiles/modules.php
index f323ae72e8..119c25b7b0 100644
--- a/modules/profiles/modules.php
+++ b/modules/profiles/modules.php
@@ -190,7 +190,7 @@ class Hm_Output_profile_page_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_profiles"><a class="unread_link" href="?page=profiles">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$person).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-person-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Profiles').'</a></li>';
         if ($this->format == 'HTML5') {
diff --git a/modules/sievefilters/modules.php b/modules/sievefilters/modules.php
index 915c44718c..b960abb5a2 100644
--- a/modules/sievefilters/modules.php
+++ b/modules/sievefilters/modules.php
@@ -1191,12 +1191,12 @@ protected function output() {
         }
         $res = '<li class="menu_filters"><a class="unread_link" href="?page=sieve_filters">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$book).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-journal-bookmark-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Filters').'</a></li>';
         $res .= '<li class="menu_block_list"><a class="unread_link" href="?page=block_list">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$circle_x).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-x-circle-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Block List').'</a></li>';
         if ($this->format == 'HTML5') {
@@ -1413,9 +1413,9 @@ protected function output() {
             $checked = '';
             $reset = '<span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="'.Hm_Image_Sources::$refresh.'" /></span>';
         }
-        return '<tr class="general_setting"><td><label for="enable_sieve_filter">'.
+        return '<tr class="general_setting"><td><label class="form-check-label" for="enable_sieve_filter">'.
             $this->trans('Enable sieve filter').'</label></td>'.
-            '<td><input type="checkbox" '.$checked.
+            '<td><input class="form-check-input" type="checkbox" '.$checked.
             ' value="1" id="enable_sieve_filter" name="enable_sieve_filter" />'.$reset.'</td></tr>';
     }
 }
@@ -1757,18 +1757,18 @@ function block_filter_dropdown($mod, $with_scope = true, $submit_id = 'block_sen
         .'<form id="block_sender_form">';
         if ($with_scope) {
             $ret .= '<div><label>'.$mod->trans('Who Is Blocked').'</label>'
-            .'<select name="scope">'
+            .'<select name="scope" class="form-select form-select-sm">'
             .'<option value="sender">'.$mod->trans('This Sender').'</option>'
             .'<option value="domain">'.$mod->trans('Whole domain').'</option></select></div>';
         }
         $ret .= '<div><label>'.$mod->trans('Action').'</label>'
-        .'<select name="block_action" id="block_action">'
+        .'<select class="form-select form-select-sm" name="block_action" id="block_action">'
         .'<option value="default">'.$mod->trans('Default action').'</option>'
         .'<option value="discard">'.$mod->trans('Discard').'</option>'
         .'<option value="blocked">'.$mod->trans('Move To Blocked Folder').'</option>'
         .'<option value="reject_default">'.$mod->trans('Reject With Default Message').'</option>'
         .'<option value="reject_with_message">'.$mod->trans('Reject With Specific Message').'</option>'
-        .'</select></div><div><button type="submit" id="'.$submit_id.'">'.$mod->trans($submit_title).'</button></div></form>'
+        .'</select></div><div><button class="btn btn-danger btn-sm mt-2" type="submit" id="'.$submit_id.'">'.$mod->trans($submit_title).'</button></div></form>'
         .'</div></div>';
         return $ret;
     }
diff --git a/modules/sievefilters/site.css b/modules/sievefilters/site.css
index 2da52e8561..3e895d5ed8 100644
--- a/modules/sievefilters/site.css
+++ b/modules/sievefilters/site.css
@@ -415,12 +415,6 @@ table.filter_actions_modal_table th {
     width: 100%;
 }
 
-#block_sender_form button {
-    color: #fff;
-    background-color: brown;
-    cursor: pointer;
-}
-
 #block_sender_form button:disabled {
     background-color: rgb(231, 121, 121);
     cursor: text;
diff --git a/modules/smtp/modules.php b/modules/smtp/modules.php
index 49f1b7c53d..91a7bbc362 100644
--- a/modules/smtp/modules.php
+++ b/modules/smtp/modules.php
@@ -889,7 +889,7 @@ protected function output() {
         }
         return '<tr class="general_setting"><td><label>'.
             $this->trans('Attachment Chunks').'</label></td>'.
-            '<td><small>('.$num_chunks.' Chunks) '.$size_in_kbs.' KB</small> <button id="clear_chunks_button" >Clear Chunks</button></td></tr>';
+            '<td><small>('.$num_chunks.' Chunks) '.$size_in_kbs.' KB</small> <button id="clear_chunks_button" class="btn btn-light btn-sm border">Clear Chunks</button></td></tr>';
     }
 }
 
@@ -921,7 +921,7 @@ class Hm_Output_sent_folder_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_sent"><a class="unread_link" href="?page=message_list&amp;list_path=sent">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$sent).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-send-check-fill fs-5 me-2"></i>';
         }
         $res .= $this->trans('Sent').'</a></li>';
         $this->concat('formatted_folder_list', $res);
@@ -933,7 +933,7 @@ protected function output() {
  */
 class Hm_Output_compose_form_start extends Hm_Output_Module {
     protected function output() {
-        return'<div class="compose_page p-0"><div class="content_title">'.$this->trans('Compose').'</div>'.
+        return'<div class="compose_page p-0"><div class="content_title px-3">'.$this->trans('Compose').'</div>'.
             '<div class="container"><div class="row justify-content-md-center">'.
             '<div class="col col-lg-8">'.
             '<form class="compose_form p-4" method="post" action="?page=compose" data-reminder="' . $this->get('enable_attachment_reminder', 0) . '">';
@@ -1244,7 +1244,7 @@ protected function output() {
                     </div>
                     <div class="smtp_section px-4 pt-3">
                         <div class="row">
-                        <div class="col-12 col-lg-4">
+                        <div class="col-12 col-lg-4 mb-4">
                             <form class="" method="POST">
                                 <input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />
                                 <div class="subtitle">'.$this->trans('Add an SMTP Server').'</div>
@@ -1292,7 +1292,7 @@ protected function output() {
         if (array_key_exists('smtp_compose_type', $settings)) {
             $selected = $settings['smtp_compose_type'];
         }
-        $res = '<tr class="general_setting"><td>'.$this->trans('Outbound mail format').'</td><td><select name="smtp_compose_type">';
+        $res = '<tr class="general_setting"><td>'.$this->trans('Outbound mail format').'</td><td><select class="form-select form-select-sm w-auto" name="smtp_compose_type">';
         $res .= '<option ';
         if ($selected == 0) {
             $res .= 'selected="selected" ';
@@ -1323,7 +1323,7 @@ protected function output() {
         if (array_key_exists('smtp_auto_bcc', $settings)) {
             $auto = $settings['smtp_auto_bcc'];
         }
-        $res = '<tr class="general_setting"><td>'.$this->trans('Always BCC sending address').'</td><td><input value="1" type="checkbox" name="smtp_auto_bcc"';
+        $res = '<tr class="general_setting"><td><label class="form-check-label" for="smtp_auto_bcc">'.$this->trans('Always BCC sending address').'</label></td><td><input class="form-check-input" value="1" type="checkbox" name="smtp_auto_bcc" id="smtp_auto_bcc"';
         $reset = '';
         if ($auto) {
             $res .= ' checked="checked"';
@@ -1415,7 +1415,7 @@ class Hm_Output_compose_page_link extends Hm_Output_Module {
     protected function output() {
         $res = '<li class="menu_compose"><a class="unread_link" href="?page=compose">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$doc).'" alt="" width="16" height="16" /> ';
+            $res .= '<i class="bi bi-file-earmark-text fs-5 me-2"></i>';
         }
         $res .= $this->trans('Compose').'</a></li>';
 
diff --git a/modules/themes/modules.php b/modules/themes/modules.php
index 46b053d3c5..d67f3de127 100644
--- a/modules/themes/modules.php
+++ b/modules/themes/modules.php
@@ -80,7 +80,7 @@ protected function output() {
         $current = $this->get('theme', '');
         $res = '<tr class="general_setting"><td><label for="theme_setting">'.
             $this->trans('Theme').'</label></td>'.
-            '<td><select id="theme_setting" name="theme_setting">';
+            '<td><select class="form-select form-select-sm" id="theme_setting" name="theme_setting">';
         $reset = '';
         foreach ($this->get('themes', array()) as $name => $label) {
             $res .= '<option ';

From f8831ab33e63e24f58ac111dc2c93df8d000ab76 Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Tue, 9 Jan 2024 00:18:00 +0200
Subject: [PATCH 10/13] Work on the search and advanced search module

---
 composer.lock                           |   32 +-
 modules/advanced_search/modules.php     |  110 +--
 modules/advanced_search/site.css        |   10 -
 modules/advanced_search/site.js         |   29 +-
 modules/core/message_list_functions.php |    2 +-
 modules/core/output_modules.php         |   34 +-
 modules/core/site.css                   |   41 +-
 modules/pop3/modules.php                | 1129 -----------------------
 modules/saved_searches/modules.php      |    3 +-
 modules/saved_searches/site.css         |    2 +-
 10 files changed, 131 insertions(+), 1261 deletions(-)
 delete mode 100644 modules/pop3/modules.php

diff --git a/composer.lock b/composer.lock
index 9c204ba806..71fbd74c51 100755
--- a/composer.lock
+++ b/composer.lock
@@ -1606,16 +1606,16 @@
         },
         {
             "name": "twbs/bootstrap-icons",
-            "version": "v1.11.2",
+            "version": "v1.11.3",
             "source": {
                 "type": "git",
                 "url": "https://github.com/twbs/icons.git",
-                "reference": "108565f11f099f177b31929e3eafc2c8d497fcd1"
+                "reference": "8d88686c03c3768a2d82ba4f20c3c4e1b100fa29"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/twbs/icons/zipball/108565f11f099f177b31929e3eafc2c8d497fcd1",
-                "reference": "108565f11f099f177b31929e3eafc2c8d497fcd1",
+                "url": "https://api.github.com/repos/twbs/icons/zipball/8d88686c03c3768a2d82ba4f20c3c4e1b100fa29",
+                "reference": "8d88686c03c3768a2d82ba4f20c3c4e1b100fa29",
                 "shasum": ""
             },
             "type": "library",
@@ -1639,9 +1639,9 @@
             ],
             "support": {
                 "issues": "https://github.com/twbs/icons/issues",
-                "source": "https://github.com/twbs/icons/tree/v1.11.2"
+                "source": "https://github.com/twbs/icons/tree/v1.11.3"
             },
-            "time": "2023-11-21T20:06:00+00:00"
+            "time": "2024-01-03T15:44:45+00:00"
         },
         {
             "name": "webklex/composer-info",
@@ -2036,25 +2036,27 @@
         },
         {
             "name": "nikic/php-parser",
-            "version": "v4.18.0",
+            "version": "v5.0.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/nikic/PHP-Parser.git",
-                "reference": "1bcbb2179f97633e98bbbc87044ee2611c7d7999"
+                "reference": "4a21235f7e56e713259a6f76bf4b5ea08502b9dc"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/nikic/PHP-Parser/zipball/1bcbb2179f97633e98bbbc87044ee2611c7d7999",
-                "reference": "1bcbb2179f97633e98bbbc87044ee2611c7d7999",
+                "url": "https://api.github.com/repos/nikic/PHP-Parser/zipball/4a21235f7e56e713259a6f76bf4b5ea08502b9dc",
+                "reference": "4a21235f7e56e713259a6f76bf4b5ea08502b9dc",
                 "shasum": ""
             },
             "require": {
+                "ext-ctype": "*",
+                "ext-json": "*",
                 "ext-tokenizer": "*",
-                "php": ">=7.0"
+                "php": ">=7.4"
             },
             "require-dev": {
                 "ircmaxell/php-yacc": "^0.0.7",
-                "phpunit/phpunit": "^6.5 || ^7.0 || ^8.0 || ^9.0"
+                "phpunit/phpunit": "^7.0 || ^8.0 || ^9.0"
             },
             "bin": [
                 "bin/php-parse"
@@ -2062,7 +2064,7 @@
             "type": "library",
             "extra": {
                 "branch-alias": {
-                    "dev-master": "4.9-dev"
+                    "dev-master": "5.0-dev"
                 }
             },
             "autoload": {
@@ -2086,9 +2088,9 @@
             ],
             "support": {
                 "issues": "https://github.com/nikic/PHP-Parser/issues",
-                "source": "https://github.com/nikic/PHP-Parser/tree/v4.18.0"
+                "source": "https://github.com/nikic/PHP-Parser/tree/v5.0.0"
             },
-            "time": "2023-12-10T21:03:43+00:00"
+            "time": "2024-01-07T17:17:35+00:00"
         },
         {
             "name": "phar-io/manifest",
diff --git a/modules/advanced_search/modules.php b/modules/advanced_search/modules.php
index e256253ade..84d4416a58 100644
--- a/modules/advanced_search/modules.php
+++ b/modules/advanced_search/modules.php
@@ -188,12 +188,10 @@ protected function output() {
  */
 class Hm_Output_advanced_search_content_start extends Hm_Output_Module {
     protected function output() {
-        return '<div class="search_content"><div class="content_title">'.
-            '<img width="16" height="16" src="'.Hm_Image_Sources::$plus.'" '.
-            'alt="'.$this->trans('Expand all').'" class="adv_expand_all">'.
-            '<img width="16" height="16" src="'.Hm_Image_Sources::$minus.'" '.
-            'alt="'.$this->trans('Expand all').'" class="adv_collapse_all">'.
-            $this->trans('Advanced Search').'</div>';
+        return '<div class="search_content px-0"><div class="content_title d-flex align-items-center px-3">'.
+            '<i class="bi bi-caret-down-fill adv_expand_all cursor-pointer"></i>'.
+            '<i class="bi bi-caret-up adv_collapse_all cursor-pointer"></i>'.
+            '<lable class="ms-2">'.$this->trans('Advanced Search').'</label></div>';
     }
 }
 
@@ -223,37 +221,34 @@ protected function output() {
             $this->targets().
             $this->times().
             $this->other().
-            '<div class="submit_section"><input type="button" id="adv_search" value="'.$this->trans('Search').'" />'.
-            ' <input type="button" class="adv_reset" value="'.$this->trans('Reset').'" />';
+            '<div class="submit_section px-5"><input type="button" class="btn btn-success" id="adv_search" value="'.$this->trans('Search').'" />'.
+            ' <input class="btn btn-light border" type="button" class="adv_reset" value="'.$this->trans('Reset').'" />';
     }
 
     protected function targets() {
-        return '<div data-target=".targets_section" class="settings_subtitle"><img width="16" height="16" alt="'.
-            $this->trans('targets').'" src="'.Hm_Image_Sources::$doc.'" />'.$this->trans('Targets').
+        return '<div data-target=".targets_section" class="settings_subtitle cursor-pointer px-3 py-2 "><i class="bi bi-file-earmark-fill me-2"></i>'.$this->trans('Targets').
             '<span class="target_count">'.sprintf($this->trans('targets: %d'), 0).'</span></div>'.
-            '<div class="targets_section"><table id="adv_target" class="adv_targets"><tr><th>'.
-            '<input type="radio" value="TEXT" id="adv_msg" class="target_radio" checked="checked" '.
-            'name="target_type" /><label for="adv_msg">'.$this->trans('Entire message').'</label></th>'.
-            '<th><input type="radio" class="target_radio" value="BODY" name="target_type" id="adv_body" '.
-            '/><label for="adv_body">'.$this->trans('Body').'</label></th><td></td></tr><tr><th><input type="radio" '.
-            'class="target_radio" value="header" id="adv_header_radio" name="target_type" /><label for="adv_header_radio">'.
-            $this->trans('Header').'</label></th><td>'.'<select class="adv_header_select" ><option value="FROM">'.
+            '<div class="targets_section mx-5 py-4"><div class="col-lg-6 col-12" id="adv_target"><table class="adv_targets table table-borderless"><tr><th>'.
+            '<input type="radio" value="TEXT" id="adv_msg" class="target_radio form-check-input" checked="checked" '.
+            'name="target_type" /><label class="form-check-label ms-2" for="adv_msg">'.$this->trans('Entire message').'</label></th>'.
+            '<th><input type="radio" class="target_radio form-check-input" value="BODY" name="target_type" id="adv_body" '.
+            '/><label class="form-check-label ms-2" for="adv_body">'.$this->trans('Body').'</label></th><td></td></tr><tr><th><input type="radio" '.
+            'class="target_radio form-check-input" value="header" id="adv_header_radio" name="target_type" /><label class="form-check-label ms-2" for="adv_header_radio">'.
+            $this->trans('Header').'</label></th><td>'.'<select class="adv_header_select form-select" ><option value="FROM">'.
             $this->trans('From').'</option><option value="SUBJECT">'.$this->trans('Subject').'</option><option value="TO">'.
             $this->trans('To').'</option><option value="CC">'.$this->trans('Cc').'</option></select></td></tr>'.
-            '<tr><th><input type="radio" class="target_radio" value="custom" id="adv_custom" name="target_type" />'.
-            '<label for="adv_custom">'.$this->trans('Custom Header').'</label></th><td><input class="adv_custom_header" '.
-            'type="text" /></td></tr></table><img class="new_target" width="16" height="16" alt="'.$this->trans('Add').
-            '" src="'.Hm_Image_Sources::$plus.'" /></div>';
+            '<tr><th><input type="radio" class="target_radio form-check-input" value="custom" id="adv_custom" name="target_type" />'.
+            '<label class="form-check-label ms-2" for="adv_custom">'.$this->trans('Custom Header').'</label></th><td><input class="adv_custom_header form-control" '.
+            'type="text" /></td></tr></table></div><i class="bi bi-plus-circle new_target cursor-pointer ms-2"></i></div>';
     }
 
     protected function terms() {
-        return '<div data-target=".terms_section" class="settings_subtitle"><img width="16" height="16" alt="'.
-            $this->trans('terms').'" src="'.Hm_Image_Sources::$search.'" />'.$this->trans('Terms').
+        return '<div data-target=".terms_section" class="settings_subtitle cursor-pointer px-3 py-2 mt-3">'.
+            '<i class="bi bi-search me-2"></i>'.$this->trans('Terms').
             '<span class="term_count">'.sprintf($this->trans('terms: %d'), 0).'</span></div>'.
-            '<div class="terms_section">'.
-            '<span id="adv_term_not" class="adv_term_nots"><input type="checkbox" value="not" id="adv_term_not" /> !</span>'.
-            '<input class="adv_terms" id="adv_term" type="text" /><img class="new_term" '.
-            'width="16" height="16" alt="'.$this->trans('Add').'" src="'.Hm_Image_Sources::$plus.'" /></div>';
+            '<div class="terms_section mx-5 py-4">'.
+            '<div class="d-flex align-items-center"><span id="adv_term_not" class="adv_term_nots"><input type="checkbox" class="form-check-input" value="not" id="adv_term_not" /> !</span>'.
+            '<input class="adv_terms form-control w-auto" id="adv_term" type="text" /><i class="bi bi-plus-circle new_term cursor-pointer ms-3"></i></div></div>';
     }
 
     protected function times() {
@@ -261,50 +256,45 @@ protected function times() {
         $from_date = date("Y-m-d", $from_time);
         $to_time = strtotime("+1 day", time());
         $to_date = date("Y-m-d", $to_time);
-        return '<div data-target=".time_section" class="settings_subtitle"><img width="16" height="16" alt="'.
-            $this->trans('time').'" src="'.Hm_Image_Sources::$calendar.'" />'.$this->trans('Time').
+        return '<div data-target=".time_section" class="settings_subtitle cursor-pointer px-3 py-2 "><i class="bi bi-calendar3-week-fill me-2"></i>'.$this->trans('Time').
             '<span class="time_count">'.sprintf($this->trans('time ranges: %d'), 0).'</span></div>'.
-            '<div class="time_section"><span id="adv_time" class="adv_times">'.$this->trans('From').
-            ' <input class="adv_time_fld_from" type="date" value="'.$this->html_safe($from_date).
-            '" /> '.$this->trans('To').' <input class="adv_time_fld_to" type="date" value="'.
-            $this->html_safe($to_date).'" /></span> <img class="new_time" width="16" height="16" alt="'.
-            $this->trans('Add').'" src="'.Hm_Image_Sources::$plus.'" /></div>';
+            '<div class="time_section mx-5 py-4"><span id="adv_time" class="adv_times d-flex align-items-center gap-2">'.$this->trans('From').
+            ' <input class="adv_time_fld_from form-control w-auto" type="date" value="'.$this->html_safe($from_date).
+            '" /> '.$this->trans('To').' <input class="adv_time_fld_to form-control w-auto" type="date" value="'.
+            $this->html_safe($to_date).'" /></span><i class="bi bi-plus-circle new_time cursor-pointer"></i></div>';
     }
 
     protected function sources() {
-        return '<div data-target=".source_section" class="settings_subtitle"><img width="16" height="16" alt="'.
-            $this->trans('sources').'" src="'.Hm_Image_Sources::$folder.'" />'.$this->trans('Sources').
+        return '<div data-target=".source_section" class="settings_subtitle cursor-pointer px-3 py-2 "><i class="bi bi-folder-fill me-2"></i>'.$this->trans('Sources').
             '<span class="source_count">'.sprintf($this->trans('sources: %d'), 0).'</span></div>'.
-            '<div class="source_section">'.$this->trans('IMAP').' <img class="adv_folder_select" width="16" '.
-            'height="16" alt="'.$this->trans('Add').'" src="'.Hm_Image_Sources::$plus.'" /><br /><div '.
+            '<div class="source_section mx-5 py-4">'.$this->trans('IMAP').' <i class="bi bi-plus-circle adv_folder_select cursor-pointer"></i><br /><div '.
             'class="adv_folder_list"></div><div class="adv_source_list"></div></div>';
     }
 
     protected function other() {
-        return '<div data-target=".other_section" class="settings_subtitle"><img width="16" height="16" alt="'.
-            $this->trans('other').'" src="'.Hm_Image_Sources::$cog.'" />'.$this->trans('Other').
+        return '<div data-target=".other_section" class="settings_subtitle cursor-pointer px-3 py-2 "><i class="bi bi-gear-fill me-2"></i>'.$this->trans('Other').
             '<span class="other_count">'.sprintf($this->trans('other settings: %d'), 0).'</span></div>'.
-            '<div class="other_section"><table><tr><th>'.$this->trans('Character set').'</th><td><select class="charset">'.
+            '<div class="other_section mx-5 py-4"><div class="col-lg-6 col-12"><table class="table table-borderless"><tr><th>'.$this->trans('Character set').'</th><td><select class="charset form-select w-auto">'.
             '<option value="">'.$this->trans('Default').'</option><option value="UTF-8">UTF-8</option>'.
             '<option value="ASCII">ASCII</option></select></td></tr><tr><th>'.$this->trans('Results per source').'</th>'.
-            '<td><input type="number" value="100" class="adv_source_limit" /></td></tr><tr><th>'.$this->trans('Flags').'</th><td>'.
-            '<div class="flags"><input id="adv_flag_read" class="adv_flag" value="SEEN" type="checkbox">'.
-            '<label for="adv_flag_read">'.$this->trans('Read').
-            ' </label><input id="adv_flag_unread" class="adv_flag" value="UNSEEN" type="checkbox">'.
-            '<label for="adv_flag_unread">'.$this->trans('Unread').
-            '<br /></label><input id="adv_flag_answered" class="adv_flag" value="ANSWERED" type="checkbox">'.
-            '<label for="adv_flag_answered">'.$this->trans('Answered').
-            '</label><input id="adv_flag_unanswered" class="adv_flag" value="UNANSWERED" type="checkbox">'.
-            '<label for="adv_flag_unanswered">'.$this->trans('Unanswered').
-            '<br /></label><input id="adv_flag_flagged" class="adv_flag" value="FLAGGED" type="checkbox">'.
-            '<label for="adv_flag_flagged">'.$this->trans('Flagged').
-            '</label><input id="adv_flag_unflagged" class="adv_flag" value="UNFLAGGED" type="checkbox">'.
-            '<label for="adv_flag_unflagged">'.$this->trans('Unflagged').
-            '<br /></label><input id="adv_flag_deleted" class="adv_flag" value="DELETED" type="checkbox">'.
-            '<label for="adv_flag_deleted">'.$this->trans('Deleted').
-            '</label><input id="adv_flag_undeleted" class="adv_flag" value="UNDELETED" type="checkbox">'.
-            '<label for="adv_flag_undeleted">'.$this->trans('Not deleted').
-            '</label></div></td></tr></table></div>';
+            '<td><input type="number" value="100" class="adv_source_limit form-control" /></td></tr><tr><th>'.$this->trans('Flags').'</th><td>'.
+            '<div class="flags d-flex flex-column"><div><input id="adv_flag_read" class="adv_flag form-check-input" value="SEEN" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_read">'.$this->trans('Read').
+            ' </label></div><div><input id="adv_flag_unread" class="adv_flag form-check-input" value="UNSEEN" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_unread">'.$this->trans('Unread').
+            '</label></div><div><input id="adv_flag_answered" class="adv_flag form-check-input" value="ANSWERED" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_answered">'.$this->trans('Answered').
+            '</label></div><div><input id="adv_flag_unanswered" class="adv_flag form-check-input" value="UNANSWERED" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_unanswered">'.$this->trans('Unanswered').
+            '</label></div><div><input id="adv_flag_flagged" class="adv_flag form-check-input" value="FLAGGED" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_flagged">'.$this->trans('Flagged').
+            '</label></div><div><input id="adv_flag_unflagged" class="adv_flag form-check-input" value="UNFLAGGED" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_unflagged">'.$this->trans('Unflagged').
+            '</label></div><div><input id="adv_flag_deleted" class="adv_flag form-check-input" value="DELETED" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_deleted">'.$this->trans('Deleted').
+            '</label></div><div><input id="adv_flag_undeleted" class="adv_flag form-check-input" value="UNDELETED" type="checkbox">'.
+            '<label class="form-check-label ms-2" for="adv_flag_undeleted">'.$this->trans('Not deleted').
+            '</label></div></div></td></tr></table></div></div>';
     }
 }
 
@@ -314,7 +304,7 @@ protected function other() {
  */
 class Hm_Output_advanced_search_form_end extends Hm_Output_Module {
     protected function output() {
-        return '</div><div class="content_title search_result_title"><img width="16" height="16" src="'.
+        return '</div><div class="content_title search_result_title mb-3 px-3"><img width="16" height="16" src="'.
             Hm_Image_Sources::$env_closed.'" alt="'.$this->trans('Results').
             '" class="adv_expand_all">'.$this->trans('Search Results').'</div>'.
             '<div class="adv_controls">'.message_controls($this).' '.combined_sort_dialog($this).'</div>'.
diff --git a/modules/advanced_search/site.css b/modules/advanced_search/site.css
index d5d7f1f90e..3329cbac59 100644
--- a/modules/advanced_search/site.css
+++ b/modules/advanced_search/site.css
@@ -1,19 +1,9 @@
-.targets_section, .other_section, .submit_section, .time_section, .source_section, .terms_section { padding: 20px; padding-left: 60px; margin-bottom: 10px; }
 .adv_controls { margin-left: 25px; display: none; }
-.targets_section img, .time_section img, .source_section img, .terms_section img { cursor: pointer; margin-left: 10px; vertical-align: -3px; opacity: .4; }
-.submit_section { margin-top: 20px; }
-.other_section table, .targets_section table { width: 1%; white-space: nowrap; margin-bottom: 5px; }
-.other_section th, .targets_section th { vertical-align: top; font-weight: normal; text-align: left; padding: 5px; padding-bottom: 10px; }
-.other_section .flags { line-height: 150%; }
-.andor { width: 200px; padding: 10px; text-align: center; }
-.timeandor { width: 400px; padding: 10px; text-align: center; }
 .adv_folder_list { width: 400px; }
 .adv_source_list { margin-top: 10px; line-height: 150%; }
 .adv_source_list img { margin-right: 10px; }
-.adv_collapse_all, .adv_expand_all { margin-right: 10px; opacity: .4; vertical-align: -1px; cursor: pointer; }
 .adv_expand_all { display: none; }
 #adv_search { cursor: pointer; }
-.search_result_title { margin-bottom: 20px; }
 .source_count, .time_count, .target_count, .other_count, .term_count { display: none; float: right; margin-right: 30px; }
 .imap_support_required { padding: 100px; text-align: center; font-size: 120%; color: #666; }
 .adv_reset { margin-left: 20px; cursor: pointer; }
diff --git a/modules/advanced_search/site.js b/modules/advanced_search/site.js
index 0d2fe3e80a..0591788a71 100644
--- a/modules/advanced_search/site.js
+++ b/modules/advanced_search/site.js
@@ -4,13 +4,14 @@ var add_remove_terms = function(el) {
     var close = $(globals.close_html);
     var count = $('.adv_terms').length;
     var term = $('#adv_term').clone(false);
-    var not_chk = $('<span id="adv_term_not" class="adv_term_nots"><input type="checkbox" value="not" id="adv_term_not" /> !</span>');
-    var and_or_html = '<div class="andor"><input checked="checked" type="radio" name="term_and'
-    and_or_html += '_or'+count+'" value="and">and <input type="radio" name="term_and_or'+count;
+    var not_chk = $('<span id="adv_term_not" class="adv_term_nots"><input type="checkbox" class="form-check-input" value="not" id="adv_term_not" /> !</span>');
+    var and_or_html = '<div class="andor px-4"><input class="form-check-input" checked="checked" type="radio" name="term_and'
+    and_or_html += '_or'+count+'" value="and">and <input class="form-check-input" type="radio" name="term_and_or'+count;
     and_or_html += '" value="or">or</div>';
     var and_or = $(and_or_html);
     term.attr('id', 'adv_term'+count);
     close.attr('id', 'term_adv_remove'+count);
+    close.addClass('ms-2');
     and_or.attr('id', 'term_and_or'+count);
     not_chk.attr('id', 'adv_term_not'+count);
     $(el).prev().after(and_or.prop('outerHTML')+not_chk.prop('outerHTML')+term.prop('outerHTML')+close.prop('outerHTML'));
@@ -27,14 +28,15 @@ var add_remove_terms = function(el) {
 var add_remove_times = function(el) {
     var close = $(globals.close_html);
     var count = $('.adv_times').length;
-    var time_html = '<span id="adv_time" class="adv_times">From <input class="adv_time_fld_from" ';
-    time_html += 'type="date" value=""> To <input class="adv_time_fld_to" type="date" value=""></span>';
+    var time_html = '<span id="adv_time" class="adv_times d-flex align-items-center gap-2">From <input class="adv_time_fld_from form-control w-auto" ';
+    time_html += 'type="date" value=""> To <input class="adv_time_fld_to form-control w-auto" type="date" value=""></span>';
     var timeset = $(time_html);
-    var and_or_html = '<div class="timeandor"><input type="radio" name="time_and_or'+count;
+    var and_or_html = '<div class="timeandor"><input class="form-check-input" type="radio" name="time_and_or'+count;
     and_or_html += '" checked="checked" value="or">or</div>';
     var and_or = $(and_or_html);
     timeset.attr('id', 'adv_time'+count);
     close.attr('id', 'time_adv_remove'+count);
+    close.addClass('me-2');
     and_or.attr('id', 'time_and_or'+count);
     $(el).prev().after(and_or.prop('outerHTML')+timeset.prop('outerHTML')+close.prop('outerHTML'));
     $('#time_adv_remove'+count).on("click", function() {
@@ -48,8 +50,8 @@ var add_remove_targets = function(el) {
     var close = $(globals.close_html);
     var count = $('.adv_targets').length;
     var target = $('#adv_target').clone(false);
-    var and_or_html = '<div class="andor"><input type="radio" name="target_and_or'+count;
-    and_or_html += '" value="and">and <input type="radio" name="target_and_or'+count;
+    var and_or_html = '<div class="andor"><input class="form-check-input" type="radio" name="target_and_or'+count;
+    and_or_html += '" value="and">and <input class="form-check-input" type="radio" name="target_and_or'+count;
     and_or_html += '" checked="checked" value="or">or</div>';
     var and_or = $(and_or_html);
 
@@ -57,6 +59,7 @@ var add_remove_targets = function(el) {
     $('.target_radio', target).attr('name', 'target_type'+count);
     $('.target_radio', target).removeAttr('checked');
     close.attr('id', 'target_adv_remove'+count);
+    close.addClass('ms-2');
     and_or.attr('id', 'target_and_or'+count);
     $(el).prev().after(and_or.prop('outerHTML')+target.prop('outerHTML')+close.prop('outerHTML'));
     $(el).hide();
@@ -84,7 +87,7 @@ var expand_adv_folder = function(res) {
 
 var adv_select_imap_folder = function(el) {
     var close = $(globals.close_html);
-    close.addClass('close_adv_folders');
+    close.addClass('close_adv_folders ms-2');
     var list_container = $('.adv_folder_list');
     var folders = $('.email_folders').clone(false);
     folders.find('.manage_folders_li').remove();
@@ -515,13 +518,7 @@ var adv_reset_page = function() {
 $(function() {
     if (hm_page_name() == 'advanced_search') {
 
-        globals.close_html = '<img width="16" height="16" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22';
-        globals.close_html += 'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%2';
-        globals.close_html += '2%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.21%';
-        globals.close_html += '200-4%201.79-4%204s1.79%204%204%204%204-1.79%204-4-1.79-4-4-4zm-1.5%201.781';
-        globals.close_html += 'l1.5%201.5%201.5-1.5.719.719-1.5%201.5%201.5%201.5-.719.719-1.5-1.5-1.5%201';
-        globals.close_html += '.5-.719-.719%201.5-1.5-1.5-1.5.719-.719z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="R';
-        globals.close_html += 'emove">';
+        globals.close_html = '<i class="bi bi-x-circle-fill cursor-pointer"></i>';
 
         $('.settings_subtitle').on("click", function() { return Hm_Utils.toggle_page_section($(this).data('target')); });
         $('.adv_folder_select').on("click", function() { adv_select_imap_folder(this); });
diff --git a/modules/core/message_list_functions.php b/modules/core/message_list_functions.php
index f1cda526ec..cc12fad359 100644
--- a/modules/core/message_list_functions.php
+++ b/modules/core/message_list_functions.php
@@ -546,7 +546,7 @@ function search_field_selection($current, $output_mod) {
         'TO' => 'To',
         'CC' => 'Cc',
     );
-    $res = '<select id="search_fld" name="search_fld">';
+    $res = '<select class="form-select form-select-sm w-auto" id="search_fld" name="search_fld">';
     foreach ($flds as $val => $name) {
         $res .= '<option ';
         if ($current == $val) {
diff --git a/modules/core/output_modules.php b/modules/core/output_modules.php
index 0c11c5c454..0fa5577e44 100644
--- a/modules/core/output_modules.php
+++ b/modules/core/output_modules.php
@@ -16,15 +16,14 @@ class Hm_Output_search_from_folder_list extends Hm_Output_Module {
      */
     protected function output() {
         $res = '<li class="menu_search"><form method="get">';
+        $res .= '<div class="d-flex align-items-center">';
         if (!$this->get('hide_folder_icons')) {
-            $res .= '<a class="unread_link" href="?page=search">';
-            $res .= '<img class="account_icon" src="'.$this->html_safe(Hm_Image_Sources::$search);
-            $res .= '" alt="'.$this->trans('Search').'" width="16" height="16" /></a>';
-        }
-        $res .= '<input type="hidden" name="page" value="search" />'.
-            '<label class="screen_reader" for="search_terms">'.$this->trans('Search').
-            '</label><input type="search" class="search_terms" '.
-            'name="search_terms" placeholder="'.$this->trans('Search').'" /></form></li>';
+            $res .= '<div class="ps-1 pe-2"><a class="unread_link" href="?page=search">';
+            $res .= '<i class="bi bi-search"></i></a></div>';
+        }
+        $res .= '<div class=""><input type="hidden" name="page" value="search" />'.
+            '<input type="search" class="search_terms form-control form-control-sm" '.
+            'name="search_terms" placeholder="'.$this->trans('Search').'" /></div></form></div></li>';
         if ($this->format == 'HTML5') {
             return $res;
         }
@@ -41,7 +40,7 @@ class Hm_Output_search_content_start extends Hm_Output_Module {
      * Leaves two open div tags that are closed in Hm_Output_search_content_end and Hm_Output_search_form
      */
     protected function output() {
-        return '<div class="search_content"><div class="content_title">'.
+        return '<div class="search_content px-0"><div class="content_title px-3 d-flex align-items-center">'.
             message_controls($this).$this->trans('Search');
     }
 }
@@ -84,7 +83,7 @@ protected function output() {
  */
 class Hm_Output_search_form_start extends Hm_Output_Module {
     protected function output() {
-        return '<div class="search_form"><form method="get">';
+        return '<div class="search_form"><form class="d-flex align-items-center" method="get">';
     }
 }
 
@@ -98,15 +97,14 @@ protected function output() {
 
         return '<input type="hidden" name="page" value="search" />'.
             ' <label class="screen_reader" for="search_terms">'.$this->trans('Search Terms').'</label>'.
-            '<input required placeholder="'.$this->trans('Search Terms').
-            '" id="search_terms" type="search" class="search_terms" name="search_terms" value="'.$this->html_safe($terms).'" />'.
+            '<input required placeholder="'.$this->trans('Search Terms').'" id="search_terms" type="search" class="search_terms form-control form-control-sm" name="search_terms" value="'.$this->html_safe($terms).'" />'.
             ' <label class="screen_reader" for="search_fld">'.$this->trans('Search Field').'</label>'.
             search_field_selection($this->get('search_fld', DEFAULT_SEARCH_FLD), $this).
             ' <label class="screen_reader" for="search_since">'.$this->trans('Search Since').'</label>'.
             message_since_dropdown($this->get('search_since', DEFAULT_SINCE), 'search_since', $this).
             combined_sort_dialog($this).
-            ' | <input type="submit" class="search_update" value="'.$this->trans('Update').'" />'.
-            ' <input type="button" class="search_reset" value="'.$this->trans('Reset').'" />';
+            ' | <input type="submit" class="search_update btn btn-success btn-sm" value="'.$this->trans('Update').'" />'.
+            ' <input type="button" class="search_reset btn btn-light border btn-sm" value="'.$this->trans('Reset').'" />';
     }
 }
 
@@ -116,12 +114,8 @@ protected function output() {
  */
 class Hm_Output_search_form_end extends Hm_Output_Module {
     protected function output() {
-        $source_link = '<a href="#" title="'.$this->trans('Sources').
-            '" class="source_link"><img alt="Sources" class="refresh_list" src="'.
-            Hm_Image_Sources::$folder.'" width="20" height="20" /></a>';
-        $refresh_link = '<a class="refresh_link" title="'.$this->trans('Refresh').'" href="#"><img alt="'.
-            $this->trans('Refresh').'" class="refresh_list" src="'.Hm_Image_Sources::$refresh.
-            '" width="20" height="20" /></a>';
+        $source_link = '<a href="#" title="'.$this->trans('Sources').'" class="source_link"><i class="bi bi-folder-fill refresh_list"></i></a>';
+        $refresh_link = '<a class="refresh_link ms-3" title="'.$this->trans('Refresh').'" href="#"><i class="bi bi-arrow-clockwise refresh_list"></i></a>';
         return '</form></div>'.
             list_controls($refresh_link, false, $source_link).list_sources($this->get('data_sources', array()), $this).'</div>';
     }
diff --git a/modules/core/site.css b/modules/core/site.css
index 6c7c7fd7e3..b877deff38 100644
--- a/modules/core/site.css
+++ b/modules/core/site.css
@@ -41,7 +41,9 @@ td { vertical-align: top; }
 #theme_setting, #timezone_setting { max-width: 200px; }
 .s_pre { color: #666}
 .message_table > thead > tr > th { display: none; }
-/* .message_table > tbody > tr > td { cursor: pointer; padding: 5px; padding-left: 10px; padding-top: 5px; padding-bottom: 3px; color: #333; border-bottom: solid 1px #ede8e6; } */
+.message_table > tbody > tr > td { cursor: pointer; padding: 5px; padding-left: 10px; padding-top: 5px; padding-bottom: 3px; color: #333; border-bottom: solid 1px #ede8e6; }
+.message_table { table-layout: fixed; width: 100%; padding: 20px; padding-top: 15px; padding-bottom: 40px; padding-left: 20px; }
+.message_table > tbody > tr > th:hover { color: #000; }
 .logout_form { white-space: nowrap; padding: 0px; margin: 0px; }
 .logout_form a { font-weight: bold; color: #666; }
 .logged_in { padding-left: 10px; float: right; padding-right: 10px; }
@@ -52,9 +54,9 @@ td { vertical-align: top; }
 .logout { cursor: pointer; background: #fff; font-size: 100%; }
 .server_content, .profile_content, .user_settings { display: table; table-layout: fixed; width: 100%; min-height: 500px; background: #fff; height: 100%; margin-right: 20px; padding-bottom: 40px; }
 .user_settings table { table-layout: fixed; width: 100%; }
-/* .user_settings table td { height: 34px; vertical-align: middle; padding: 5px; padding-left: 37px; padding-top: 10px; color: #666; } */
+.user_settings table td { height: 34px; vertical-align: middle; padding: 5px; padding-left: 37px; padding-top: 10px; color: #666; }
 /* .settings_table .save_settings { cursor: pointer; color: #666; font-size: 125%; padding: 10px !important; float: left !important; } */
-.reset_factory_button { margin-top: -65px;}
+.reset_factory_button { cursor: pointer; color: #666; font-size: 100%; padding: 10px !important; float: right !important; margin-right: 20px;}
 .disabled_link { color: #bbb; }
 /* .save_settings_password { float: left; margin-left: 0px; padding: 4px; } */
 .disabled_input, input:disabled { color: #aaa !important; background-color: #ddd; }
@@ -69,7 +71,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .inner_list a { padding-right: 5px; }
 .folders { margin-top: 10px; margin-bottom: 20px; margin-left: 20px !important;}
 .inner_list { margin-bottom: 10px; } 
-/* .folders a, .unread_link { color: #555; text-decoration: none; line-height: 1.25em; } */
+.folders a, .unread_link { color: #555; text-decoration: none; line-height: 1.25em; }
 .folder_list { background-color: #fff; margin-right: 20px; padding-right: 15px; padding-bottom: 40px; min-width: 200px; padding-top: 0px; }
 
 .folders, .inner_list { list-style-type: none; padding: 0px; margin-left: 10px; padding-right: 0px; }
@@ -81,7 +83,7 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .path_delim { opacity: .4; padding-left: 5px; vertical-align: 1px; padding-right: 3px; }
 .not_found { font-size: 150%; color: #999; padding: 50px; height: 100%; border-left: solid 1px #ddd; background-color: #fff; }
 .no_servers { text-align: center; padding: 50px; margin: auto; padding-bottom: 100px; }
-.selected_menu, .selected_menu a { color: teal !important; line-height: 1.25em; font-weight: bolder !important;}
+.selected_menu, .selected_menu a { color: teal !important; line-height: 1.25em;}
 .folder_list .update_message_list{ font-size: 80%; padding-top: 10px; float: right; }
 .src_name { white-space: nowrap; overflow: hidden; cursor: pointer; border-left: solid 1px #eee; padding-left: 25px; margin-top: 0px; margin-right: -15px; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); border-bottom: solid 1px #ede8e6; color: #777; padding-top: 10px; font-size: 125%; letter-spacing: -1px; padding-bottom: 10px; }
 .main_menu { padding-top: 20px; }
@@ -98,6 +100,9 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .confirm_logout { display: none; background-color: #eee; padding: 20px; position: absolute; left: 0px; top: 0px; border: solid 1px #ede8e6; z-index: 100; }
 /* .confirm_text {  padding-left: 10px; padding-bottom: 10px; } */
 .folder_list .update_unread { float: right; margin-top: 20px; }
+.page_links a { text-decoration: none; color: #111; }
+.page_links a img { opacity: .6; width: 16px; height: 16px; vertical-align: -2px; }
+.page_links { text-align: center; padding-top: 20px; }
 .checkbox_cell { width: 20px; padding-right: 10px !important; }
 .menu_caret { padding: 7px; float: right; margin-right: 10px; opacity: .15; }
 .news_cell { border: none !important; padding-bottom: 10px !important; padding-top: 10px !important; }
@@ -110,7 +115,15 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .news_cell .source {float: left; padding-right: 10px; font-size: 100% !important;}
 .news_cell .msg_date { clear: both; }
 .msg_img { max-width: 100%; }
+.wait { }
+/* .msg_controls { position: relative; display: none; padding-left: 0px; margin-right: 20px; } */
+/* .msg_controls_visible { display: inline; } */
+/* .msg_controls a { font-size: .6em; letter-spacing: 0px; color: #666; background-color: #fff; border: solid 1px #ede8e6; padding: 3px; width: auto; border-radius: 3px; vertical-align: 3px; display: inline-block !important; }
+.msg_controls a { margin-right: 3px; } */
+/* .toggle_link { padding-left: 4px !important; padding-right: 4px !important; padding-top: 4px !important;} */
 .list_settings_dialog { display: none; padding: 10px; position: absolute; top: 0px; right: 0px; width: 600px; background-color: #efefef; border: solid 1px #ede8e6; }
+/* .list_controls { position: absolute; right: 0px; padding-right: 10px; top: 0px; padding-top: 10px; background-color: #fff; } */
+/* .list_controls a { padding-right: 5px; } */
 .list_settings_dialog table { width: 1%; white-space: nowrap; }
 .list_settings_dialog table th { font-size: 90%; font-weight: normal; text-align: left; }
 .folder_toggle { font-size: 0px; float: left; margin: 15px; margin-top: 19px; display: none; }
@@ -121,12 +134,22 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .plink, .nlink { color: #666; }
 .plink:hover, .nlink:hover { color: teal !important; }
 .limit { width: 50px; margin-left: 20px; }
+/* .settings_subtitle { font-size: 115%; color: #777 !important; letter-spacing: -1px; padding-bottom: 6px !important; padding-left: 30px !important; height: 25px !important; padding-top: 15px !important; } */
+/* .server_section img, .settings_subtitle img { opacity: .4; padding-right: 10px; vertical-align: -1px; } */
+/* .settings_subtitle, .server_section { cursor: pointer; max-height: 50px; margin-top: 0px; color: #777; padding-bottom: 10px; padding-top: 15px; letter-spacing: -1px; font-size: 115%; padding-left: 30px; border-bottom: solid 1px #ede8e6; } */
+/* .list_meta { float: right; margin-right: 20px; letter-spacing: 0px; display: inline; color: #666 !important; font-size: 70% !important; margin-top: 2px; font-style: normal; margin-left: 20px; } */
+/* .list_meta b { color: #333 !important; font-weight: normal; padding-left: 5px; padding-right: 5px; vertical-align: 1px; } */
 .noscript { position: absolute; z-index: 100; right: 0px; left: 0px; top: 0px; bottom: 0px; background-color: #ede8e6; opacity: 1; padding-top: 100px; text-align: center; }
 .hide_folders { font-size: 0px; float: left; clear: none; margin-top: 10px; margin-left: 23px; }
 .hide_folders img { opacity: .4; }
 .section_caret { opacity: .15; vertical-align: 4px; padding-right: 10px; }
 .server_count { float: right; font-size: 90%; }
 .email_setting, .all_setting, .unread_setting, .flagged_setting, .general_setting, .junk_setting, .trash_setting, .drafts_setting { display: none; }
+/* .configured_server, .add_server { margin-top: 10px; color: #666; background-color: #fff; margin-bottom: 20px; padding: 10px; width: 200px; } */
+/* .message_list { min-height: 600px; background-color: #fff; height: 100%; padding-bottom: 20px; } */
+/* .configured_server { float: left; margin-left: 25px; width: 230px; } */
+/* .add_server { margin-right: 25px; float: left; clear: left; margin-left: 25px; width: 230px; } */
+/* .configured_server input, .add_server input, .add_server select { margin-bottom: 10px; padding: 5px; margin-right: 5px; } */
 .list_sources, .update_search_label_field { z-index: 100; border-left: solid 1px #ede8e6; border-bottom: solid 1px #ede8e6; position: absolute; right: 0px; top: 54px; background-color: #fafafa; font-size: 85%; padding: 30px; padding-top: 10px; display: none;}
 .list_src, .old_search_terms_label, .search_terms_label { color: #666; margin-bottom: 10px; }
 .old_search_terms_label, .search_terms_label { display: block; width: 100%; }
@@ -137,6 +160,8 @@ textarea, select, input, button { border: solid 1px #ddd; background-color: #fff
 .search_terms { padding-left: 5px; }
 .folder_list .search_terms { width: 80%; }
 .search_content { display: table; table-layout: fixed; width: 100%; min-height: 600px; background: #fff; height: 100%; margin-right: 20px; padding-bottom: 40px; }
+/* .save_perm_form, .save_details { max-width: 600px; margin-left: 30px; margin-top: 20px; padding-right: 20px; color: #666; } */
+/* .save_subtitle { font-size: 110%; padding-top: 20px; } */
 .msg_text_inner p { padding: 5px; }
 .save_reminder { clear: both; float: right; margin-right: 25px; }
 .save_reminder img { opacity: .4; }
@@ -151,7 +176,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .home_password_dialogs { min-height: 400px; max-width: 480px; padding: 20px; margin: 20px; margin-right: 0px; float: left; border: solid 1px #eee; }
 .home_password_dialogs .pw_input { width: 120px; }
 .nux_title { font-size: 120%; margin-bottom: 20px; }
-/* .total_unread_count, .unread_count { background-color: #ccc; font-size: 90%; margin-left: 10px; padding: 0px; padding-bottom: 1px; border-radius: 4px 4px 4px 4px; vertical-align: 2px; font-weight: bold; color: #fff; } */
+.total_unread_count, .unread_count { background-color: #ccc; font-size: 90%; margin-left: 10px; padding: 0px; padding-bottom: 1px; border-radius: 4px 4px 4px 4px; vertical-align: 2px; font-weight: bold; color: #fff; }
 .debug_title { color: teal; position: fixed; background-color: #f5f5f5; bottom: 0px; right: 0px; padding: 20px; padding-left: 20px; }
 .long_session { float: left; }
 .long_session input { padding: 0px; float: none; }
@@ -202,7 +227,7 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .mobile .folder_toggle { display: block; top: 0px; left: -3px; }
 .mobile .folder_toggle img { width: 24px; height: 32px; margin-top: -7px; }
 .mobile .folder_toggle { position: fixed; z-index: 101; }
-.mobile .message_table { padding-left: 5px !important; margin-top: 70px !important; }
+.mobile .message_table { padding-left: 5px !important; margin-top: 30px !important; }
 .mobile .list_settings_link, .mobile .refresh_list { width: 24px; height: 24px; vertical-align: -13px; }
 .mobile .refresh_list { margin-right: 5px; }
 .mobile .update_message_list { margin-right: 20px; }
@@ -240,6 +265,8 @@ div.unseen, .unseen .subject { font-weight: 700; }
 .mobile .imap_filter { display: none; }
 .mobile .list_controls { color: #777; background: linear-gradient(180deg, #fff, #fff, #f7f2ef); height: 48px; padding-left: 5px; padding-right: 5px; }
 .mobile .list_controls img { margin-top: 10px }
+.mobile .page_links { font-size: 150%; }
+.mobile .page_links a img { width: 24px; height: 24px; }
 .mobile .toggle_link { padding: 4px 6px !important; line-height: normal !important; margin-left: -3px !important; margin-top: -4px; position: relative; }
 .mobile .toggle_link img { vertical-align: -3px !important; width: 16px; height: 16px; margin-left: -3px !important}
 .mobile .compose_form { padding: 0px !important; padding-left: 5px !important; width: 92% !important; }
diff --git a/modules/pop3/modules.php b/modules/pop3/modules.php
deleted file mode 100644
index bceff97ab8..0000000000
--- a/modules/pop3/modules.php
+++ /dev/null
@@ -1,1129 +0,0 @@
-<?php
-
-/**
- * POP3 modules
- * @package modules
- * @subpackage pop3
- */
-
-if (!defined('DEBUG_MODE')) { die(); }
-
-require_once APP_PATH.'modules/pop3/hm-pop3.php';
-
-/**
- * Setup the list type
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_message_list_type extends Hm_Handler_Module {
-    /**
-     * Build meta information about the message list type
-     */
-    public function process() {
-        if (array_key_exists('list_path', $this->request->get)) {
-            $path = $this->request->get['list_path'];
-            if (preg_match("/^pop3_(\d+)$/", $path, $matches)) {
-                $this->out('list_path', $path, false);
-                $details = Hm_POP3_List::dump($matches[1]);
-                $title = array('POP3', $details['name'], 'INBOX');
-                if ($this->get('list_page', 0)) {
-                    $title[] = sprintf('Page %d', $this->get('list_page', 0));
-                }
-                if (!empty($details)) {
-                    $this->out('list_meta', false);
-                    $this->out('mailbox_list_title', $title);
-					$this->out('custom_list_controls', ' ');
-                }
-            }
-        }
-        if (array_key_exists('page', $this->request->get) && $this->request->get['page'] == 'search') {
-            $this->out('list_path', 'search', false);
-        }
-    }
-}
-
-/**
- * Check the status of a POP3 connection
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_status extends Hm_Handler_Module {
-    /**
-     * Used in an ajax request on the home page to determine a POP3 server status
-     */
-    public function process() {
-        list($success, $form) = $this->process_form(array('pop3_server_ids'));
-        if ($success) {
-            $ids = explode(',', $form['pop3_server_ids']);
-            foreach ($ids as $id) {
-                $start_time = microtime(true);
-                $pop3 = Hm_POP3_List::connect($id, false);
-                if (pop3_authed($pop3)) {
-                    $this->out('pop3_connect_time', microtime(true) - $start_time);
-                    $this->out('pop3_connect_status', 'Authenticated');
-                    $this->out('pop3_status_server_id', $id);
-                }
-            }
-        }
-    }
-}
-
-/**
- * Perform a message action on a POP3 message
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_message_action extends Hm_Handler_Module {
-    /**
-     * read or unread a POP3 message
-     * @todo add support for more message actions
-     */
-    public function process() {
-        list($success, $form) = $this->process_form(array('action_type', 'message_ids'));
-        if ($success) {
-            $id_list = explode(',', $form['message_ids']);
-            $server_ids = array();
-            foreach ($id_list as $msg_id) {
-                if (preg_match("/^pop3_(\d)+_(\d)+$/", $msg_id)) {
-                    $parts = explode('_', $msg_id);
-                    $server_ids[] = $parts[1];
-                    switch($form['action_type']) {
-                        case 'unread':
-                            Hm_POP3_Uid_Cache::unread($msg_id);
-                            break;
-                        case 'read':
-                            Hm_POP3_Uid_Cache::read($msg_id);
-                            break;
-                    }
-                }
-            }
-            if (count($server_ids) > 0) {
-                foreach ($server_ids as $id) {
-                    bust_pop3_cache($this->cache, $id);
-                }
-            }
-        }
-    }
-}
-
-/**
- * Build the data for a POP3 folder page
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_folder_page extends Hm_Handler_Module {
-    /**
-     * Connect to a POP3 server and fetch message headers
-     * @todo see if this can be broken up into smaller functions
-     */
-    public function process() {
-
-        $msgs = array();
-        list($success, $form) = $this->process_form(array('pop3_server_id'));
-        if ($success) {
-            $unread_only = false;
-            $login_time = $this->session->get('login_time', false);
-            if ($login_time) {
-                $this->out('login_time', $login_time);
-            }
-            $page = 1;
-            $terms = false;
-            if (array_key_exists('list_page', $this->request->get)) {
-                $page = $this->request->get['list_page'];
-            }
-            if (array_key_exists('pop3_search', $this->request->post)) {
-                $limit = DEFAULT_PER_SOURCE;
-                $terms = $this->session->get('search_terms', false);
-                if (!$terms) {
-                    return;
-                }
-                $since = $this->session->get('search_since', DEFAULT_SINCE);
-                $fld = $this->session->get('search_fld', 'TEXT');
-                $date = process_since_argument($since);
-                $cutoff_timestamp = strtotime($date);
-            }
-            elseif ($this->get('list_path') == 'unread' || (array_key_exists('pop3_unread_only', $this->request->post) && $this->request->post['pop3_unread_only'])) {
-                $limit = $this->user_config->get('unread_per_source_setting', DEFAULT_PER_SOURCE);
-                $date = process_since_argument($this->user_config->get('unread_since_setting', DEFAULT_SINCE));
-                $unread_only = true;
-                $cutoff_timestamp = strtotime($date);
-                if ($login_time && $login_time > $cutoff_timestamp) {
-                    $cutoff_timestamp = $login_time;
-                }
-            }
-            elseif ($this->get('list_path') == 'email') {
-                $limit = $this->user_config->get('all_email_per_source_setting', DEFAULT_PER_SOURCE);
-                $date = process_since_argument($this->user_config->get('all_email_since_setting', DEFAULT_SINCE));
-                $cutoff_timestamp = strtotime($date);
-            }
-            elseif ($this->get('list_path') == 'combined_inbox') {
-                $limit = $this->user_config->get('all_per_source_setting', DEFAULT_PER_SOURCE);
-                $date = process_since_argument($this->user_config->get('all_since_setting', DEFAULT_SINCE));
-                $cutoff_timestamp = strtotime($date);
-            }
-            else {
-                $limit = DEFAULT_PER_SOURCE;
-                $date = false;
-                $cutoff_timestamp = strtotime($date);
-            }
-            $cache = false;
-            if (!$unread_only) {
-                $cache = Hm_POP3_List::get_cache($this->cache, $form['pop3_server_id']);
-            }
-            if ($cache) {
-                $this->out('pop3_cache_used', true);
-            }
-            $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], $cache);
-            $details = Hm_POP3_List::dump($form['pop3_server_id']);
-            $path = sprintf("pop3_%d", $form['pop3_server_id']);
-            if (pop3_authed($pop3)) {
-                $this->out('pop3_mailbox_page_path', $path);
-                $list = array_reverse(array_unique(array_keys($pop3->mlist())));
-                $total = count($list);
-                $list = array_slice($list, (($page - 1) * $limit), $limit);
-                foreach ($list as $id) {
-                    $msg_headers = $pop3->msg_headers($id);
-                    if (!empty($msg_headers)) {
-                        if ($date && isset($msg_headers['date'])) {
-                            if (!Hm_POP3_Uid_Cache::is_unread(sprintf('pop3_%d_%d', $form['pop3_server_id'], $id)) && strtotime($msg_headers['date']) < $cutoff_timestamp) {
-                                continue;
-                            }
-                        }
-                        if ($unread_only && Hm_POP3_Uid_Cache::is_read(sprintf('pop3_%d_%d', $form['pop3_server_id'], $id))) {
-                            continue;
-                        }
-                        if ($terms) {
-                            $body = implode('', $pop3->retr_full($id));
-                            if (!search_pop3_msg($body, $msg_headers, $terms, $fld)) {
-                                continue;
-                            }
-                        }
-                        $msg_headers['server_name'] = $details['name'];
-                        $msg_headers['server_id'] = $form['pop3_server_id'];
-                        $msgs[$id] = $msg_headers;
-                    }
-                }
-                $this->out('pop3_mailbox_page', $msgs);
-                $this->out('pop3_server_id', $form['pop3_server_id']);
-                $this->out('list_page', $page);
-                if (!$date) {
-                    $this->out('page_links', build_page_links($limit, $page, $total, $path));
-                }
-            }
-        }
-    }
-}
-
-/**
- * Fetch a message from a POP3 server
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_message_content extends Hm_Handler_Module {
-    /**
-     * Connect to a POP3 server and download a message
-     */
-    public function process() {
-
-        list($success, $form) = $this->process_form(array('pop3_uid', 'pop3_list_path'));
-        if ($success) {
-            $id = (int) substr($form['pop3_list_path'], 5);
-            $cache = Hm_POP3_List::get_cache($this->cache, $id);
-            $pop3 = Hm_POP3_List::connect($id, $cache);
-            $details = Hm_POP3_List::dump($id);
-            if (pop3_authed($pop3)) {
-                $msg_lines = $pop3->retr_full($form['pop3_uid']);
-                $header_list = array();
-                $body = array();
-                $headers = true;
-                $last_header = false;
-
-                $bodies = array();
-                $has_multipart = false;
-                $boundary = '';
-                $boundaries = array();
-                $multipart_headers = false;
-                $multipart_header_list = array();
-
-                foreach ($msg_lines as $line) {
-                    if ($headers) {
-                        if (substr($line, 0, 1) == "\t"
-                            || substr($line, 0, 1) == " ") {
-                            $header_list[$last_header] .= decode_fld($line);
-                        }
-                        elseif (strstr($line, ':')) {
-                            $parts = explode(':', $line, 2);
-                            if (count($parts) == 2) {
-                                $header_list[$parts[0]] = decode_fld($parts[1]);
-                                $last_header = $parts[0];
-                            }
-                        }
-                        if (array_key_exists('Content-Type', $header_list)
-                            && strstr($header_list['Content-Type'], 'multipart')
-                            && $boundary = strstr($header_list['Content-Type'], 'boundary=')) {
-                            $has_multipart = true;
-                            $boundary = str_replace('boundary=', '', $boundary);
-                            $boundary = str_replace('"', '', $boundary);
-                            if (array_search($boundary, $boundaries) === false) {
-                                $boundaries[] = $boundary;
-                            }
-                        }
-                    }
-                    elseif ($multipart_headers) {
-                        if (substr($line, 0, 1) == "\t"
-                            || substr($line, 0, 1) == " ") {
-                            $multipart_header_list[$last_header] .= decode_fld($line);
-                        }
-                        elseif (strstr($line, ':')) {
-                            $parts = explode(':', $line, 2);
-                            if (count($parts) == 2) {
-                                $multipart_header_list[$parts[0]] = decode_fld($parts[1]);
-                                $last_header = $parts[0];
-                            }
-                        }
-                        if (array_key_exists('Content-Type', $multipart_header_list)
-                            && strstr($multipart_header_list['Content-Type'], 'multipart')
-                            && $boundary = strstr($multipart_header_list['Content-Type'], 'boundary=')) {
-                            $has_multipart = true;
-                            $boundary = str_replace('boundary=', '', $boundary);
-                            $boundary = str_replace('"', '', $boundary);
-                            if (array_search($boundary, $boundaries) === false) {
-                                $boundaries[] = $boundary;
-                            }
-                        }
-                    }
-                    else {
-                        $boundary = '####unmatch-boundary';
-                        foreach ($boundaries as $_boundary) {
-                            if (strstr($line, $_boundary)) {
-                                $boundary = $_boundary;
-                                break;
-                            }
-                        }
-                        if ($has_multipart === true && strstr($line, $boundary)) {
-                            if (array_key_exists('Content-Type', $multipart_header_list)
-                                && strstr($multipart_header_list['Content-Type'], 'html')) {
-                                $body['content-type'] = 'html';
-                            }
-                            else {
-                                $body['content-type'] = 'text';
-                            }
-                            if (array_key_exists('Content-Transfer-Encoding', $multipart_header_list)
-                                && strstr($multipart_header_list['Content-Transfer-Encoding'], 'base64')) {
-                                $body['text'] = base64_decode(str_replace(array("\r", "\n"), '', $body['text']));
-                            }
-                            if (array_key_exists('Content-Type', $multipart_header_list)
-                                && $charset = strstr($multipart_header_list['Content-Type'], 'charset=')) {
-                                $charset = str_replace('charset=', '', $charset);
-                                $body['text'] = mb_convert_encoding($body['text'], 'UTF-8', $charset);
-                            }
-                            if (array_key_exists('text', $body)) {
-                                $bodies[] = $body;
-                            }
-                            $body = array('text' => '');
-                            
-                            $multipart_headers = true;
-                            $multipart_header_list = array();
-                        }
-                        else {
-                            if (array_key_exists('text', $body)) {
-                                $body['text'] .= $line;
-                            }
-                            else {
-                                $body['text'] = $line;
-                            }
-                        }
-                    }
-
-                    if (!trim($line)) {
-                        $headers = false;
-                        if ($multipart_headers === true) {
-                            $multipart_headers = false;
-                        }
-                    }
-                }
-                $this->out('pop3_message_headers', $header_list);
-
-                if ($has_multipart === false) {
-                    if (array_key_exists('Content-Type', $header_list)
-                        && strstr($header_list['Content-Type'], 'html')) {
-                        $body['content-type'] = 'html';
-                    }
-                    if (array_key_exists('Content-Transfer-Encoding', $header_list)
-                        && strstr($header_list['Content-Transfer-Encoding'], 'base64')) {
-                        $body['text'] = base64_decode(str_replace(array("\r", "\n"), '', $body['text']));
-                    }
-                    if (array_key_exists('Content-Type', $header_list)
-                        && $charset = strstr($header_list['Content-Type'], 'charset=')) {
-                        $charset = trim(str_replace('charset=', '', $charset));
-                        if (strtolower($charset) != 'utf-8') {
-                            $body['text'] = mb_convert_encoding($body['text'], 'UTF-8', $charset);
-                        }
-                    }
-                    $bodies[] = $body;
-                }
-
-                $this->out('pop3_message_body', $bodies);
-                $this->out('pop3_mailbox_page_path', $form['pop3_list_path']);
-                $this->out('pop3_server_id', $id);
-                bust_pop3_cache($this->cache, $id);
-                Hm_POP3_Uid_Cache::read(sprintf("pop3_%s_%s", $id, $form['pop3_uid']));
-            }
-        }
-    }
-}
-
-/**
- * Save a POP3 server on the servers page
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_save extends Hm_Handler_Module {
-    /**
-     * Authenticate and save a POP3 server on the settings page
-     */
-    public function process() {
-        $just_saved_credentials = false;
-        if (isset($this->request->post['pop3_save'])) {
-            list($success, $form) = $this->process_form(array('pop3_user', 'pop3_pass', 'pop3_server_id'));
-            if (!$success) {
-                Hm_Msgs::add('ERRUsername and Password are required to save a connection');
-                return;
-            }
-            if (in_server_list('Hm_POP3_List', $form['pop3_server_id'], $form['pop3_user'])) {
-                Hm_Msgs::add('ERRThis server and username are already configured');
-                return;
-            }
-            $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], false, $form['pop3_user'], $form['pop3_pass'], true);
-            if (pop3_authed($pop3)) {
-                $just_saved_credentials = true;
-                Hm_Msgs::add("Server saved");
-                $this->session->record_unsaved('POP3 server saved');
-            }
-            else {
-                Hm_POP3_List::forget_credentials($form['pop3_server_id']);
-                Hm_Msgs::add("ERRUnable to save this server, are the username and password correct?");
-            }
-        }
-        $this->out('just_saved_credentials', $just_saved_credentials);
-    }
-}
-
-/**
- * Forget the username and password for a POP3 server
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_forget extends Hm_Handler_Module {
-    /**
-     * Used on the settings page to forget the username/password of a POP3 server
-     */
-    public function process() {
-        $just_forgot_credentials = false;
-        if (isset($this->request->post['pop3_forget'])) {
-            list($success, $form) = $this->process_form(array('pop3_server_id'));
-            if ($success) {
-                Hm_POP3_List::forget_credentials($form['pop3_server_id']);
-                $just_forgot_credentials = true;
-                Hm_Msgs::add('Server credentials forgotten');
-                $this->session->record_unsaved('POP3 server credentials forgotten');
-            }
-            else {
-                $this->out('old_form', $form);
-            }
-        }
-        $this->out('just_forgot_credentials', $just_forgot_credentials);
-    }
-}
-
-/**
- * Delete a POP3 server from the settings page
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_delete extends Hm_Handler_Module {
-    /**
-     * Delete a POP3 server
-     */
-    public function process() {
-        if (isset($this->request->post['pop3_delete'])) {
-            list($success, $form) = $this->process_form(array('pop3_server_id'));
-            if ($success) {
-                $res = Hm_POP3_List::del($form['pop3_server_id']);
-                if ($res) {
-                    $this->out('deleted_server_id', $form['pop3_server_id']);
-                    Hm_Msgs::add('Server deleted');
-                    $this->session->record_unsaved('POP3 server deleted');
-                }
-            }
-            else {
-                $this->out('old_form', $form);
-            }
-        }
-    }
-}
-
-/**
- * Test a connection to a POP3 server
- * @subpackage pop3/handler
- */
-class Hm_Handler_pop3_connect extends Hm_Handler_Module {
-    /**
-     * Used on the servers page to test a POP3 connection
-     */
-    public function process() {
-        $pop3 = false;
-        if (isset($this->request->post['pop3_connect'])) {
-            list($success, $form) = $this->process_form(array('pop3_user', 'pop3_pass', 'pop3_server_id'));
-            if ($success) {
-                $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], false, $form['pop3_user'], $form['pop3_pass']);
-            }
-            elseif (isset($form['pop3_server_id'])) {
-                $pop3 = Hm_POP3_List::connect($form['pop3_server_id'], false);
-            }
-            if ($pop3 && $pop3->state == 'authed') {
-                Hm_Msgs::add("Successfully authenticated to the POP3 server : " . $form['pop3_user']);
-            }
-            else {
-                Hm_Msgs::add("ERRFailed to authenticate to the POP3 server : " . $form['pop3_user']);
-            }
-        }
-    }
-}
-
-/**
- * Save a POP3 server cache
- * @subpackage pop3/handler
- */
-class Hm_Handler_save_pop3_cache extends Hm_Handler_Module {
-    /**
-     * Save a POP3 server cache in the session
-     *
-     */
-    public function process() {
-        $cache = array();
-        if ($this->get('pop3_cache_used')) {
-            return;
-        }
-        $servers = Hm_POP3_List::dump(false, true);
-        foreach ($servers as $id => $server) {
-            if (isset($server['object']) && is_object($server['object'])) {
-                $cache[$id] = $server['object']->dump_cache();
-            }
-        }
-        if (count($cache) > 0) {
-            foreach ($cache as $id => $data) {
-                $this->cache->set('pop3'.$id, $cache[$id]);
-            }
-        }
-    }
-}
-
-/**
- * Load POP3 servers up for the search page
- * @subpackage pop3/handler
- */
-class Hm_Handler_load_pop3_servers_for_search extends Hm_Handler_Module {
-    /**
-     * Add POP3 servers to the data sources list for the search page
-     */
-    public function process() {
-        foreach (Hm_POP3_List::dump() as $index => $vals) {
-            $this->append('data_sources', array('callback' => 'pop3_search_page_content', 'type' => 'pop3', 'name' => $vals['name'], 'id' => $index));
-        }
-    }
-}
-
-/**
- * Load POP3 server for combined message views
- * @subpackage pop3/handler
- */
-class Hm_Handler_load_pop3_servers_for_message_list extends Hm_Handler_Module {
-    /**
-     * Load POP3 servers for a combined message list
-     */
-    public function process() {
-        $server_id = false;
-        $callback = false;
-        if (array_key_exists('list_path', $this->request->get)) {
-            $path = $this->request->get['list_path'];
-        }
-        else {
-            $path = '';
-        }
-        switch ($path) {
-            case 'unread':
-                $callback = 'pop3_combined_unread_content';
-                break;
-            case 'combined_inbox':
-                $callback = 'pop3_combined_inbox_content';
-                break;
-            case 'email':
-                $callback = 'pop3_all_mail_content';
-                break;
-            default:
-                if (preg_match("/^pop3_(\d+)$/", $path, $matches)) {
-                    $server_id = $matches[1];
-                    $callback = 'load_pop3_list';
-                }
-                else {
-                    $callback = 'pop3_unread_background';
-                }
-                break;
-        }
-        if ($callback) {
-            foreach (Hm_POP3_List::dump() as $index => $vals) {
-                if ($server_id !== false && $server_id != $index) {
-                    continue;
-                }
-                if ($callback == 'pop3_unread_background') {
-                    $this->append('data_sources', array('callback' => $callback, 'group' => 'background', 'type' => 'pop3', 'name' => $vals['name'], 'id' => $index));
-                }
-                else {
-                    $this->append('data_sources', array('callback' => $callback, 'type' => 'pop3', 'name' => $vals['name'], 'id' => $index));
-                }
-            }
-        }
-    }
-}
-
-/**
- * Load POP3 servers from the user config
- * @subpackage pop3/handler
- */
-class Hm_Handler_load_pop3_servers_from_config extends Hm_Handler_Module {
-    /**
-     * Setup the POP3 server list
-     */
-    public function process() {
-        $servers = $this->user_config->get('pop3_servers', array());
-        $added = false;
-        $max = 0;
-        $index = 0;
-        foreach ($servers as $server) {
-            Hm_POP3_List::add( $server, $index );
-            if (array_key_exists('default', $server) && $server['default']) {
-                $added = true;
-            }
-            $max = $index;
-            $index++;
-        }
-        $max++;
-        if (!$added) {
-            $auth_server = $this->session->get('pop3_auth_server_settings', array());
-            if (array_key_exists('name', $auth_server)) {
-                $name = $auth_server['name'];
-            }
-            else {
-                $name = $this->config->get('pop3_auth_name', 'Default');
-            }
-            if (!empty($auth_server)) {
-                Hm_POP3_List::add(array( 
-                    'name' => $name,
-                    'default' => true,
-                    'server' => $auth_server['server'],
-                    'port' => $auth_server['port'],
-                    'tls' => $auth_server['tls'],
-                    'user' => $auth_server['username'],
-                    'pass' => $auth_server['password']),
-                $max);
-            }
-        }
-        Hm_POP3_Uid_Cache::load($this->session->get('pop3_read_uids', array()));
-    }
-}
-
-/**
- * Add a new POP3 server
- * @subpackage pop3/handler
- */
-class Hm_Handler_process_add_pop3_server extends Hm_Handler_Module {
-    /**
-     * Used on the servers page to process adding a new POP3 server
-     */
-    public function process() {
-        if (isset($this->request->post['submit_pop3_server'])) {
-            list($success, $form) = $this->process_form(array('new_pop3_name', 'new_pop3_address', 'new_pop3_port'));
-            if (!$success) {
-                $this->out('old_form', $form);
-                Hm_Msgs::add('ERRYou must supply a name, a server and a port ' . $form['pop3_user']);
-            }
-            else {
-                $tls = false;
-                if (array_key_exists('tls', $this->request->post) && $this->request->post['tls']) {
-                    $tls = true;
-                }
-                if ($con = fsockopen($form['new_pop3_address'], $form['new_pop3_port'], $errno, $errstr, 2)) {
-                    Hm_POP3_List::add( array(
-                        'name' => $form['new_pop3_name'],
-                        'server' => $form['new_pop3_address'],
-                        'port' => $form['new_pop3_port'],
-                        'tls' => $tls));
-                    Hm_Msgs::add('Added server!');
-                    $this->session->record_unsaved('POP3 server added');
-                }
-                else {
-                    Hm_Msgs::add(sprintf('ERRCound not add server: %s, %s', $errstr, $form['pop3_user']));
-                }
-            }
-        }
-    }
-}
-
-/**
- * Add a list of POP3 servers for the output modules
- * @subpackage pop3/handler
- */
-class Hm_Handler_add_pop3_servers_to_page_data extends Hm_Handler_Module {
-    /**
-     * Used to add POP3 server ids to an output page
-     */
-    public function process() {
-        $servers = Hm_POP3_List::dump();
-        $this->out('pop3_servers', $servers);
-    }
-}
-
-/**
- * Load POP3 folder data used by the folder list
- * @subpackage pop3/handler
- */
-class Hm_Handler_load_pop3_folders extends Hm_Handler_Module {
-    /**
-     * Add POP3 folders to the folder list E-mail section
-     */
-    public function process() {
-        $servers = Hm_POP3_List::dump();
-        $folders = array();
-        if (!empty($servers)) {
-            foreach ($servers as $id => $server) {
-                if ($server['name'] == 'Default-Auth-Server') {
-                    $server['name'] = 'Default';
-                }
-                $folders[$id] = $server['name'];
-            }
-        }
-        $this->out('pop3_folders', $folders);
-    }
-}
-
-/**
- * Save POP3 server list
- * @subpackage pop3/handler
- */
-class Hm_Handler_save_pop3_servers extends Hm_Handler_Module {
-    /**
-     * Save POP3 servers in the session
-     */
-    public function process() {
-        $servers = Hm_POP3_List::dump(false, true);
-        foreach ($servers as $index => $vals) {
-            if (array_key_exists('object', $vals) && $vals['object']) {
-                unset($servers[$index]['object']);
-            }
-        }
-        $this->user_config->set('pop3_servers', $servers);
-        $this->session->set('pop3_read_uids', Hm_POP3_Uid_Cache::dump());
-        Hm_POP3_List::clean_up();
-    }
-}
-
-/**
- * Format the add POP3 server dialog
- * @subpackage pop3/output
- */
-class Hm_Output_add_pop3_server_dialog extends Hm_Output_Module {
-    /**
-     * Build the HTML for the add server dialog
-     */
-    protected function output() {
-        if ($this->get('single_server_mode')) {
-            return '';
-        }
-        $count = count($this->get('pop3_servers', array()));
-        $count = sprintf($this->trans('%d configured'), $count);
-        return '<div class="pop3_server_setup"><div data-target=".pop3_section" class="server_section">'.
-            '<img alt="" src="'.Hm_Image_Sources::$env_closed.'" width="16" height="16" />'.
-            ' '.$this->trans('POP3 Servers').' <div class="server_count">'.$count.'</div></div><div class="pop3_section"><form class="add_server" method="POST">'.
-            '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-            '<div class="subtitle">'.$this->trans('Add a POP3 Server').'</div>'.
-            '<table><tr><td colspan="2"><label class="screen_reader" for="new_pop3_name">'.$this->trans('POP3 account name').'</label>'.
-            '<input required type="text" id="new_pop3_name" name="new_pop3_name" class="txt_fld form-control" value="" placeholder="'.$this->trans('Account name').'" /></td></tr>'.
-            '<tr><td colspan="2"><label class="screen_reader" for="new_pop3_address">'.$this->trans('POP3 server address').'</label>'.
-            '<input required type="text" id="new_pop3_address" name="new_pop3_address" class="txt_fld form-control" placeholder="'.$this->trans('POP3 server address').'" value=""/></td></tr>'.
-            '<tr><td colspan="2"><label for="new_pop3_port" class="screen_reader">'.$this->trans('POP3 port').'</label>'.
-            '<input required type="number" id="new_pop3_port" name="new_pop3_port" class="port_fld form-control" value="995" placeholder="'.$this->trans('Port').'"></td></tr>'.
-            '<tr><td><input type="radio" name="tls" value="1" id="pop3_tls" checked="checked" class="form-check-input" /> <label for="pop3_tls">'.$this->trans('Use TLS').'</label>'.
-            '<br /><input type="radio" name="tls" value="0" id="pop3_notls" class="form-check-input"><abel for="pop3_notls">'.$this->trans('STARTTLS or unencrypted').'</label></td>'.
-            '</tr><tr><td><input class="btn btn-success  btn-sm" type="submit" value="'.$this->trans('Add').'" name="submit_pop3_server" /></td></tr>'.
-            '</table></form>';
-    }
-}
-
-/**
- * Format a list of configured POP3 servers
- * @subpackage pop3/output
- */
-class Hm_Output_display_configured_pop3_servers extends Hm_Output_Module {
-    /**
-     * Build HTML for configured POP3 servers on the servers page
-     */
-    protected function output() {
-        if ($this->get('single_server_mode')) {
-            return '';
-        }
-        $res = '';
-        foreach ($this->get('pop3_servers', array()) as $index => $vals) {
-
-            $no_edit = false;
-
-            if (array_key_exists('user', $vals) && !array_key_exists('nopass', $vals)) {
-                $disabled = 'disabled="disabled"';
-                $user_pc = $vals['user'];
-                $pass_pc = $this->trans('[saved]');
-            }
-            elseif (array_key_exists('user', $vals) && array_key_exists('nopass', $vals)) {
-                $user_pc = $vals['user'];
-                $pass_pc = $this->trans('Password');
-                $disabled = '';
-            }
-            else {
-                $user_pc = '';
-                $pass_pc = $this->trans('Password');
-                $disabled = '';
-            }
-            if ($vals['name'] == 'Default-Auth-Server') {
-                $vals['name'] = $this->trans('Default');
-                $no_edit = true;
-            }
-            $res .= '<div class="configured_server">';
-            $res .= sprintf('<div class="server_title">%s</div><div class="server_subtitle">%s/%d %s</div>',
-                $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['port']), $vals['tls'] ? 'TLS' : '' );
-            $res .= 
-                '<form class="pop3_connect" method="POST">'.
-                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<input type="hidden" name="pop3_server_id" value="'.$this->html_safe($index).'" /><span> '.
-                '<label class="screen_reader" for="pop3_user_'.$index.'">'.$this->trans('POP3 username').'</label>'.
-                '<input '.$disabled.' id="pop3_user_'.$index.'" class="credentials" placeholder="'.$this->trans('Username').'" type="text" name="pop3_user" value="'.$this->html_safe($user_pc).'"></span>'.
-                '<span> <label class="screen_reader" for="pop3_password_'.$index.'">'.$this->trans('POP3 password').'</label>'.
-                '<input '.$disabled.' id="pop3_password_'.$index.'" class="credentials pop3_password" placeholder="'.$pass_pc.'" type="password" name="pop3_pass"></span>';
-            if (!$no_edit) {
-                if (!isset($vals['user']) || !$vals['user']) {
-                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_pop3_connection" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_pop3_connection" />';
-                }
-                else {
-                    $res .= '<input type="submit" value="Test" class="test_pop3_connect" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_pop3_connection" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_pop3_connection" />';
-                }
-                $res .= '<input type="hidden" value="ajax_pop3_debug" name="hm_ajax_hook" />';
-            }
-            $res .= '</form></div>';
-        }
-        $res .= '<br class="clear_float" /></div></div>';
-        return $res;
-    }
-}
-
-/**
- * Format POP3 folders for the folder list
- * @subpackage pop3/output
- */
-class Hm_Output_filter_pop3_folders extends Hm_Output_Module {
-    /**
-     * Build the HTML for POP3 accounts in the folder list
-     */
-    protected function output() {
-        $res = '';
-        foreach ($this->get('pop3_folders', array()) as $id => $folder) {
-            $res .= '<li class="pop3_'.$this->html_safe($id).'">'.
-                '<a data-id="pop3_'.$this->html_safe($id).'" href="?page=message_list&list_path=pop3_'.$this->html_safe($id).'">';
-            if (!$this->get('hide_folder_icons')) {
-                $res .= '<img class="account_icon" alt="Toggle folder" src="'.Hm_Image_Sources::$folder.'" width="16" height="16" /> ';
-            }
-            $res .= $this->html_safe($folder).'</a></li>';
-        }
-        if ($res) {
-            $this->append('folder_sources', array('email_folders', $res));
-        }
-        return '';
-    }
-}
-
-/**
- * Format a POP3 message for display
- * @subpackage pop3/output
- */
-class Hm_Output_filter_pop3_message_content extends Hm_Output_Module {
-    /**
-     * Build the HTML for a POP3 message view
-     */
-    protected function output() {
-        if ($this->get('pop3_message_headers')) {
-            $txt = '';
-            $from = '';
-            $small_headers = array('subject', 'date', 'from');
-            $headers = $this->get('pop3_message_headers');
-            $txt .= '<table class="msg_headers">'.
-                '<col class="header_name_col"><col class="header_val_col"></colgroup>';
-            foreach ($small_headers as $fld) {
-                foreach ($headers as $name => $value) {
-                    if ($fld == strtolower($name)) {
-                        if ($fld == 'from') {
-                            $from = $value;
-                        }
-                        if ($fld == 'subject') {
-                            $txt .= '<tr class="header_'.$fld.'"><th colspan="2">';
-                            if (isset($headers['Flags']) && stristr($headers['Flags'], 'flagged')) {
-                                $txt .= ' <img alt="" class="account_icon" src="'.Hm_Image_Sources::$folder.'" width="16" height="16" /> ';
-                            }
-                            $txt .= $this->html_safe($value).'</th></tr>';
-                        }
-                        else {
-                            $txt .= '<tr class="header_'.$fld.'"><th>'.$this->trans($name).'</th><td>'.$this->html_safe($value).'</td></tr>';
-                        }
-                        break;
-                    }
-                }
-            }
-            foreach ($headers as $name => $value) {
-                if (!in_array(strtolower($name), $small_headers)) {
-                    $txt .= '<tr style="display: none;" class="long_header"><th>'.$this->trans($name).'</th><td>'.$this->html_safe($value).'</td></tr>';
-                }
-            }
-            $txt .= '<tr><th colspan="2" class="header_links">'.
-                '<a href="#" class="header_toggle">'.$this->trans('All').'</a>'.
-                '<a class="header_toggle" style="display: none;" href="#">small</a>'.
-                ' | <a href="?page=compose">'.$this->trans('Reply').'</a>'.
-                ' | <a href="?page=compose">'.$this->trans('Forward').'</a>'.
-                ' | <a href="?page=compose">'.$this->trans('Attach').'</a>'.
-                ' | <a data-message-part="0" href="#">'.$this->trans('raw').'</a>'.
-                ' | <a href="#">'.$this->trans('Flag').'</a>'.
-                '</th></tr></table>';
-
-            $this->out('msg_headers', $txt);
-        }
-        $txt = '<div class="msg_text_inner">';
-        if ($this->get('pop3_message_body')) {
-            foreach ($this->get('pop3_message_body') as $body) {
-                if (array_key_exists('content-type', $body) && $body['content-type'] === 'html') {
-                    $txt .= format_msg_html($body['text']);
-                }
-                else {
-                    $txt .= format_msg_text($body['text'], $this);
-                }
-            }
-        }
-        $txt .= '</div>';
-        $this->out('msg_text', $txt);
-    }
-}
-
-/**
- * Format a list of POP3 messages
- * @subpackage pop3/output
- */
-class Hm_Output_filter_pop3_message_list extends Hm_Output_Module {
-    /**
-     * Build the HTML for a set of POP3 messages
-     */
-    protected function output() {
-        $res = array();
-        if ($this->get('pop3_mailbox_page')) {
-            $style = $this->get('news_list_style') ? 'news' : 'email';
-            if ($this->get('is_mobile')) {
-                $style = 'news';
-            }
-            if ($this->get('login_time')) {
-                $login_time = $this->get('login_time');
-            }
-            else {
-                $login_time = false;
-            }
-            $res = format_pop3_message_list($this->get('pop3_mailbox_page'), $this, $style, $login_time, $this->get('list_path'));
-        }
-        $this->out('formatted_message_list', $res);
-    }
-}
-
-/**
- * Output POP3 server ids
- * @subpackage pop3/output
- */
-class Hm_Output_pop3_server_ids extends Hm_Output_Module {
-    /**
-     * Put a list of POP3 server ids in a hidden page element
-     */
-    protected function output() {
-        return '<input type="hidden" class="pop3_server_ids" value="'.$this->html_safe(implode(',', array_keys($this->get('pop3_servers', array())))).'" />';
-    }
-}
-
-/**
- * Format a POP3 status response row
- * @subpackage pop3/output
- */
-class Hm_Output_display_pop3_status extends Hm_Output_Module {
-    /**
-     * Build the HTML for a POP3 status row on the home page
-     */
-    protected function output() {
-        $res = '';
-        foreach ($this->get('pop3_servers', array()) as $index => $vals) {
-            if ($vals['name'] == 'Default-Auth-Server') {
-                $vals['name'] = $this->trans('Default');
-            }
-            $res .= '<tr><td>POP3</td><td>'.$vals['name'].'</td><td class="pop3_status_'.$index.'"></td>'.
-                '<td class="pop3_detail_'.$index.'"></td></tr>';
-        }
-        return $res;
-    }
-}
-
-/**
- * Format POP3 status response data
- * @subpackage pop3/output
- */
-class Hm_Output_filter_pop3_status_data extends Hm_Output_Module {
-    /**
-     * Build ajax response for a status row on the home page
-     */
-    protected function output() {
-        if ($this->get('pop3_connect_status') == 'Authenticated') {
-            $this->out('pop3_status_display', '<span class="online">'.
-                $this->trans(ucwords($this->get('pop3_connect_status'))).'</span> in '.round($this->get('pop3_connect_time'), 3));
-        }
-        else {
-            $this->out('pop3_status_display', '<span class="down">'.$this->trans('Down').'</span>');
-        }
-    }
-}
-
-/**
- * Format a list of POP3 messages
- * @subpackage pop3/functions
- * @param array $msg_list list of message data
- * @param object $mod Hm_Output_Module
- * @param string $style list style
- * @param string $login_time timestamp of last login
- * @param string $list_parent list type
- * @return array
- */
-if (!hm_exists('format_pop3_message_list')) {
-function format_pop3_message_list($msg_list, $output_module, $style, $login_time, $list_parent) {
-    $res = array();
-    $show_icons = $output_module->get('msg_list_icons');
-    foreach($msg_list as $msg_id => $msg) {
-        $icon = 'env_open';
-        $row_class = 'email';
-        if ($msg['server_name'] == 'Default-Auth-Server') {
-            $msg['server_name'] = 'Default';
-        }
-        $id = sprintf("pop3_%s_%s", $msg['server_id'], $msg_id);
-        $subject = display_value('subject', $msg, false, $output_module->trans('[No Subject]'));
-        $from = display_value('from', $msg);
-        $nofrom = '';
-        if ($style == 'email' && !$from) {
-            $nofrom = ' nofrom';
-            $from = '[No From]';
-        }
-        $date = display_value('date', $msg, false, $output_module->trans('[No Date]'));
-        if ($date) {
-            $date = translate_time_str($date, $output_module);
-        }
-        $timestamp = display_value('date', $msg, 'time');
-        $url = '?page=message&uid='.$msg_id.'&list_path='.sprintf('pop3_%d', $msg['server_id']).'&list_parent='.$list_parent;
-        if ($output_module->get('list_page', 0)) {
-            $url .= '&list_page='.$output_module->html_safe($output_module->get('list_page', 1));
-        }
-        if (Hm_POP3_Uid_Cache::is_read($id)) {
-            $flags = array();
-        }
-        elseif (Hm_POP3_Uid_Cache::is_unread($id)) {
-            $flags = array('unseen');
-            $icon = 'env_closed';
-            $row_class .= ' unseen';
-        }
-        elseif (isset($msg['date']) && $login_time && strtotime($msg['date']) <= $login_time) {
-            $flags = array();
-        }
-        else {
-            $icon = 'env_closed';
-            $flags = array('unseen');
-        }
-        $row_class .= ' '.str_replace(' ', '_', $msg['server_name']);
-        if (!$show_icons) {
-            $icon = false;
-        }
-        if ($style == 'news') {
-            $res[$id] = message_list_row(array(
-                    array('checkbox_callback', $id),
-                    array('icon_callback', $flags),
-                    array('subject_callback', $subject, $url, $flags, $icon),
-                    array('safe_output_callback', 'source', $msg['server_name']),
-                    array('safe_output_callback', 'from'.$nofrom, $from),
-                    array('date_callback', $date, $timestamp),
-                ),
-                $id,
-                $style,
-                $output_module,
-                $row_class
-            );
-        }
-        else {
-            $res[$id] = message_list_row(array(
-                    array('checkbox_callback', $id),
-                    array('safe_output_callback', 'source', $msg['server_name'], $icon),
-                    array('safe_output_callback', 'from'.$nofrom, $from),
-                    array('subject_callback', $subject, $url, $flags),
-                    array('date_callback', $date, $timestamp),
-                    array('icon_callback', $flags)
-                ),
-                $id,
-                $style,
-                $output_module,
-                $row_class
-            );
-        }
-    }
-    return $res;
-}}
-
-/**
- * Search a POP3 message
- * @subpackage pop3/functions
- * @param string $body message body
- * @param array $headers message headers
- * @param string $terms search terms
- * @param string $fld field to search
- * @return bool
- */
-if (!hm_exists('search_pop3_msg')) {
-function search_pop3_msg($body, $headers, $terms, $fld) {
-    if ($fld == 'TEXT') {
-        if (stristr($body, $terms)) {
-            return true;
-        }
-    }
-    if ($fld == 'SUBJECT') {
-        if (array_key_exists('subject', $headers) && stristr($headers['subject'], $terms)) {
-            return true;
-        }
-    }
-    if ($fld == 'FROM') {
-        if (array_key_exists('from', $headers) && stristr($headers['from'], $terms)) {
-            return true;
-        }
-    }
-}}
-
-/**
- * @subpackage pop3/functions
- */
-if (!hm_exists('bust_pop3_cache')) {
-function bust_pop3_cache($hm_cache, $id) {
-    $hm_cache->del('pop3'.$id);
-    Hm_Debug::add('Busted POP3 cache for id '.$id);
-}}
-
-/**
- * @subpackage pop3/functions
- */
-if (!hm_exists('pop3_authed')) {
-function pop3_authed($pop3) {
-    return is_object($pop3) && $pop3->state == 'authed';
-}}
-
diff --git a/modules/saved_searches/modules.php b/modules/saved_searches/modules.php
index 516569c4a9..b47b04b3d7 100644
--- a/modules/saved_searches/modules.php
+++ b/modules/saved_searches/modules.php
@@ -192,8 +192,7 @@ class Hm_Output_save_search_icon extends Hm_Output_Module {
     protected function output() {
         $name = $this->get('search_name', '');
         if (!$name) {
-            return '<a style="display: none;" href="" class="save_search" title="'.$this->trans('Save search').'"><img width="20" height="20" alt="'.
-                $this->trans('Save search').'" src="'.Hm_Image_Sources::$circle_check.'" /></a>';
+            return '<a style="display: none;" href="" class="save_search" title="'.$this->trans('Save search').'"><i class="bi bi-check-circle-fill"></i></a>';
         }
     }
 }
diff --git a/modules/saved_searches/site.css b/modules/saved_searches/site.css
index 3522cb7818..c5484df237 100644
--- a/modules/saved_searches/site.css
+++ b/modules/saved_searches/site.css
@@ -2,7 +2,7 @@
 .saved_searches_form input { margin-left: 3px; margin-right: 3px; }
 .update_search_label img { opacity: .5; position: absolute; right: 105px; top: 21px; }
 .update_saved_search_title { color: #666; font-size: 110%; padding: 5px; margin-bottom: 10px; }
-.save_search img, .delete_search img { opacity: .5; position: absolute; right: 75px; top: 22px; }
+.save_search i, .delete_search img { opacity: .5; position: absolute; right: 75px; top: 22px; }
 .update_search img { opacity: .5; position: absolute; right: 135px; top: 22px; }
 
 .mobile .save_search, .mobile .update_search_label, .mobile .delete_search, .mobile .add_search { display: none !important; }

From 8eac8cf68e308f38d440a448b1f6762ea1d0a90d Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Wed, 24 Jan 2024 13:09:54 +0200
Subject: [PATCH 11/13] 2fa Module

---
 modules/2fa/modules.php                  |  58 +++++++++---
 modules/2fa/site.css                     |   6 +-
 modules/core/assets/images/logo_dark.svg |   1 +
 modules/core/output_modules.php          | 111 +++++++++++------------
 4 files changed, 107 insertions(+), 69 deletions(-)
 create mode 100644 modules/core/assets/images/logo_dark.svg

diff --git a/modules/2fa/modules.php b/modules/2fa/modules.php
index 18354a13ce..ca0d15bb18 100644
--- a/modules/2fa/modules.php
+++ b/modules/2fa/modules.php
@@ -147,6 +147,7 @@ protected function output() {
         if (array_key_exists('2fa_enable', $settings)) {
             $enabled = $settings['2fa_enable'];
         }
+<<<<<<< HEAD
         $res = '<tr>
                     <td colspan="2" data-target=".tfa_setting" class="settings_subtitle">'.
                         '<img alt="" src="'.Hm_Image_Sources::$unlocked.'" width="16" height="16" />'.$this->trans('2 Factor Authentication').'
@@ -158,6 +159,17 @@ protected function output() {
                         '.$this->trans('Enable 2 factor authentication').'
                         <input value="1" type="checkbox" name="2fa_enable" '.($enabled ? 'checked="checked"' : '').' />';
 
+=======
+        $res = '<tr><td colspan="2" data-target=".tfa_setting" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-unlock-fill fs-5 me-2"></i>'.$this->trans('2 Factor Authentication').'</td></tr>';
+
+        $res .= '<tr class="tfa_setting"><td><label class="form-check-label">'.$this->trans('Enable 2 factor authentication').'</label>'.
+            '</td><td><input class="form-check-input" value="1" type="checkbox" name="2fa_enable"';
+        if ($enabled) {
+            $res .= ' checked="checked"';
+        }
+        $res .= '></td></tr>';
+>>>>>>> ba2058f0 (2fa Module)
         $svg = $this->get('2fa_svg');
 
         if ($svg) {
@@ -227,24 +239,46 @@ protected function output() {
             $class = $dir."_page";
 
             if ($this->get('2fa_error')) {
-                $error = '<div class="tfa_error">'.$this->trans($this->get('2fa_error')).'</div>';
+                $error = '<div class="tfa_error"><div class="alert alert-danger alert-dismissible fade show" role="alert">'.$this->trans($this->get('2fa_error')).'</div></div>';
             }
             else {
                 $error = '';
             }
 
             if(!$this->get('fancy_login_allowed')){
-                echo '<!DOCTYPE html><html lang='.$this->html_safe($lang).' class="'.$this->html_safe($class).
-                '" dir="'.$this->html_safe($dir).'"><head><meta charset="utf-8" />'.
-                '<link href="site.css" media="all" rel="stylesheet" type="text/css" />'.
-                '<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">'.
-                '</head><body><form class="login_form" method="POST"><h1 class="title">'.
-                $this->html_safe($this->get('router_app_name')).'</h1>'. $error.'<div class="tfa_input">'.
-                '<label for="2fa_code">'.$this->trans('Enter the 6 digit code from your Authenticator application').
-                '</label></div><input type="hidden" name="hm_page_key" value="'.$this->get('2fa_key').'" />'.
-                '<input autofocus required id="2fa_code" type="number" name="2fa_code" value="" placeholder="'.
-                $this->trans('Login code').'" /><input type="submit" value="'.$this->trans('Submit').
-                '" /></form></body></html>';
+                echo '<!DOCTYPE html>
+                <html lang="'.$this->html_safe($lang).'" class="'.$this->html_safe($class).'" dir="'.$this->html_safe($dir).'">
+                <head>
+                    <meta charset="utf-8" />
+                    <link href="site.css" media="all" rel="stylesheet" type="text/css" />
+                    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+                    <link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
+                    <link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
+                </head>
+                <body>
+                    <div class="container bg-light">
+                        <div class="row align-items-center justify-content-center vh-100 p-3">
+                                <div class="card col-12 col-md-6 col-lg-4 py-3">
+                                    <div class="card-body">
+                                        <form class="mt-5" method="POST">
+                                            <p class="text-center"><img class="w-50" src="modules/core/assets/images/logo_dark.svg"></p>
+                                            <p class="text-center">'.$this->trans('Enter the 6 digit code from your Authenticator application').'</p>
+                                            '.$error.'
+                                            <div class="form-floating mb-3">
+                                                <input autofocus required id="2fa_code" type="number" name="2fa_code" class="form-control" value="" placeholder="'.$this->trans('Login code').'">
+                                                <label for="2fa_code">'.$this->trans('Login code').'</label>
+                                            </div>
+                                            <div class="d-grid">
+                                                <input type="submit" class="btn btn-success" value="'.$this->trans('Submit').'">
+                                            </div>
+                                            <input type="hidden" name="hm_page_key" value="'.$this->get('2fa_key').'">
+                                        </form>
+                                    </div>
+                                </div>
+                        </div>
+                    </div>
+                </body>
+                </html>';
             }
             else{
                 $style = '<style type="text/css">body,html{max-width:100vw !important; max-height:100vh !important; overflow:hidden !important;}.form-container{background-color:#f1f1f1;'.
diff --git a/modules/2fa/site.css b/modules/2fa/site.css
index e7a856aa2b..c98a6077f1 100644
--- a/modules/2fa/site.css
+++ b/modules/2fa/site.css
@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 :root {
     --tfa-form-valid-color: #198754;
     --tfa-form-valid-border-color: #198754;
@@ -216,4 +217,7 @@
 }
 /**
 	**		Shake Annimation Ends Here.
-	**/
\ No newline at end of file
+	**/
+=======
+.tfa_setting { display: none; }
+>>>>>>> ba2058f0 (2fa Module)
diff --git a/modules/core/assets/images/logo_dark.svg b/modules/core/assets/images/logo_dark.svg
new file mode 100644
index 0000000000..8e0fe23fd0
--- /dev/null
+++ b/modules/core/assets/images/logo_dark.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 559.55 246.22"><defs><style>.cls-1{fill:#80b441;}.cls-2{fill:#222;}</style></defs><title>cypht_logo_white</title><path class="cls-1" d="M189.83,391.4q46.63,0,71.35-14.21v-13.7H107Q139.56,391.39,189.83,391.4Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M98.84,355.8H261.18V319q-26.1,17-53.34,17-30.71,0-48.26-17.76c-.15-.16-.29-.32-.44-.47H75.07A106.61,106.61,0,0,0,98.84,355.8Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M67.92,274a132.58,132.58,0,0,0,4.68,36h80.34q-10.29-15.35-10.86-38.11H67.94C67.93,272.6,67.92,273.31,67.92,274Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M68.18,264.2h74q1.07-22.81,12.08-38.12H75A146.51,146.51,0,0,0,68.18,264.2Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M192.22,180.28v22.08a90.15,90.15,0,0,1,17.93-1.7,83.58,83.58,0,0,1,51,17V180.28Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M127.45,180.28h-69A110,110,0,0,0,32.84,218.4h69A110,110,0,0,1,127.45,180.28Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M92,218.4h69a58.88,58.88,0,0,1,14.84-10.47,83.47,83.47,0,0,0-34.56-7.27Q110.23,200.66,92,218.4Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M103.45,180.28A110,110,0,0,0,77.8,218.4H92q18.27-17.73,49.23-17.74a83.47,83.47,0,0,1,34.56,7.27,67.11,67.11,0,0,1,16.47-5.57V180.28Z" transform="translate(-32.84 -145.18)"/><path class="cls-1" d="M261.18,156.19q-18.7-11-60.5-11-53.91,0-88.47,27.42h149Z" transform="translate(-32.84 -145.18)"/><path class="cls-2" d="M354.43,245.57l-30.47,81q-11,29.24-33.11,29.23A42.38,42.38,0,0,1,277,353.89V335.43a19.45,19.45,0,0,0,10,2.71q8.93,0,12.45-8.42l3.95-9.3L273,245.57h25.64l14,45.63a59.21,59.21,0,0,1,2.05,10H315a70.45,70.45,0,0,1,2.42-9.89l14.13-45.77Z" transform="translate(-32.84 -145.18)"/><path class="cls-2" d="M387.17,311.85h-.3v43.21H363.73V245.57h23.14v11.28h.3q8.56-13.11,24.09-13.11,14.58,0,22.53,10t7.94,27.21q0,18.75-9.26,30.11T407.82,322.4Q394.28,322.4,387.17,311.85Zm-.66-30.76v6q0,7.75,4.1,12.67a13.34,13.34,0,0,0,10.77,4.9,14.16,14.16,0,0,0,12.26-6.11q4.37-6.12,4.36-17.32,0-19.78-15.38-19.78A14.44,14.44,0,0,0,391,266.84Q386.51,272.23,386.51,281.09Z" transform="translate(-32.84 -145.18)"/><path class="cls-2" d="M528.74,320.57H505.67V277.94q0-16.49-12-16.48a12.31,12.31,0,0,0-10,4.61,17.82,17.82,0,0,0-3.81,11.72v42.78H456.75v-111h23.14V256.7h.3q8.49-13,23.07-13,25.49,0,25.48,30.76Z" transform="translate(-32.84 -145.18)"/><path class="cls-2" d="M552.48,262.63V297q0,25.42,24.46,25.42,10.32,0,15.45-2.71V302.55a15.63,15.63,0,0,1-7.54,2.12q-9.3,0-9.3-11.72V262.63Z" transform="translate(-32.84 -145.18)"/><polygon class="cls-2" points="552.33 113.96 552.33 104.29 538.27 104.29 519.01 104.29 508.86 104.29 508.86 113.96 519.01 113.96 538.27 113.96 552.33 113.96"/><polygon class="cls-1" points="527.21 92.21 519.66 86.61 519.66 100.38 542.74 100.38 542.74 79.92 527.21 92.21"/><polygon class="cls-1" points="542.74 76.69 542.74 75.96 519.66 81.9 519.66 83.34 527.21 88.9 542.74 76.69"/></svg>
\ No newline at end of file
diff --git a/modules/core/output_modules.php b/modules/core/output_modules.php
index 0fa5577e44..4538ceb1db 100644
--- a/modules/core/output_modules.php
+++ b/modules/core/output_modules.php
@@ -175,60 +175,44 @@ class Hm_Output_login_start extends Hm_Output_Module {
      * Looks at the current login state and outputs the correct form
      */
     protected function output() {
-        $fancy_login =  $this->get('fancy_login_allowed');
-        if(!$fancy_login){
+        $fancy_login = $this->get('fancy_login_allowed');
+        if (!$fancy_login) {
             if (!$this->get('router_login_state')) {
-                $css = '<style type="text/css">.mobile .login_form{margin-top:60px;display:block;float:none;width:100%;'.
-                    'background-color:#fff;font-size:130%;height:auto;}.logged_out{display:block !important;}.sys_messages'.
+                return '<form class="login_form" method="POST">';
+            }
+            else {
+                return '<form class="logout_form" method="POST">';
+            }
+        } else {
+            if (!$this->get('router_login_state')) {
+                $css = '<style type="text/css">body,html{max-width:100vw !important; max-height:100vh !important; overflow:hidden !important;}.form-container{background-color:#f1f1f1;'.
+                    'background: linear-gradient( rgba(4, 26, 0, 0.85), rgba(4, 26, 0, 0.85)), url('.WEB_ROOT.'modules/core/assets/images/cloud.jpg);'.
+                    'background-attachment: fixed;background-position: center;background-repeat: no-repeat;background-size: cover;'.
+                    'display:grid; place-items:center; height:100vh; width:100vw;} .logged_out{display:block !important;}.sys_messages'.
                     '{position:fixed;right:20px;top:15px;min-height:30px;display:none;background-color:#fff;color:teal;'.
                     'margin-top:0px;padding:15px;padding-bottom:5px;white-space:nowrap;border:solid 1px #999;border-radius:'.
-                    '5px;filter:drop-shadow(4px 4px 4px #ccc);z-index:101;}.g-recaptcha{margin-left:-12px;}.mobile .g-recaptcha{'.
-                    'clear:left;margin-left:20px;}.title{font-weight:normal;padding:0px;margin:0px;margin-left:20px;'.
-                    'margin-bottom:20px;letter-spacing:-1px;color:#999;}html,body{max-width:100%;min-height:100%;'.
+                    '5px;filter:drop-shadow(4px 4px 4px #ccc);z-index:101;}.g-recaptcha{margin:0px 10px 10px 10px;}.mobile .g-recaptcha{'.
+                    'margin:0px 10px 5px 10px;}.title{font-weight:normal;padding:0px;margin:0px;margin-left:20px;'.
+                    'margin-bottom:20px;letter-spacing:-1px;color:#999;}html,body{min-width:100px !important;'.
                     'background-color:#fff;}body{background:linear-gradient(180deg,#faf6f5,#faf6f5,#faf6f5,#faf6f5,'.
-                    '#fff);font-size:1em;height:100%;color:#333;font-family:Arial;padding:0px;margin:0px;min-width:700px;'.
-                    'font-size:100%;}input,option,select{font-size:100%;padding:3px;}textarea,select,input{border:outset '.
-                    '1px #ddd;background-color:#fff;color:#333;border-radius:6px;}.screen_reader{position:absolute'.
-                    ';top:auto;width:1px;height:1px;overflow:hidden;}.login_form{float:left;font-size:90%;'.
-                    'padding-top:60px;height:300px;border-radius:0px 0px 20px 0px;margin:0px;background-color:#f5f5f5;'.
-                    'width:300px;padding-left:20px;}.login_form input{clear:both;float:left;padding:4px;margin-left:20px;'.
-                    'margin-top:10px;margin-bottom:10px;}#username,#password{width:200px;}.err{color:red !important;}.long_session'.
-                    '{float:left;}.long_session input{padding:0px;float:none;}.mobile .long_session{float:left;clear:both;}</style>';
+                    '#fff);font-size:1em;color:#333;font-family:Arial;padding:0px;margin:0px;min-width:700px;'.
+                    'font-size:100%;}input,option,select{font-size:100%;padding:3px;}textarea,select,input{border:solid '.
+                    '1px #ddd;background-color:#fff;color:#333;border-radius:3px;}.screen_reader{position:absolute'.
+                    ';top:auto;width:1px;height:1px;overflow:hidden;}.login_form{display:flex; justify-content:space-evenly; align-items:center; flex-direction:column;font-size:90%;'.
+                    'padding-top:60px;height:360px;border-radius:20px 20px 20px 20px;margin:0px;background-color:rgba(0,0,0,.6);'.
+                    'min-width:300px;}.login_form input{clear:both;float:left;padding:4px;'.
+                    'margin-top:10px;margin-bottom:10px;}#username,#password{width:200px; height:25px;} .err{color:red !important;}.long_session'.
+                    '{float:left;}.long_session input{padding:0px;float:none;font-size:18px;}.mobile .long_session{float:left;clear:both;} @media screen and (min-width:400px){.login_form{min-width:400px;}}'.
+                    '.user-icon_signin{display:block; background-color:white; border-radius:100%; padding:10px; height:40px; margin-top:-120px; box-shadow: #6eb549 .4px 2.4px 6.2px; }'.
+                    '.label_signin{width:210px; margin:0px 0px -18px 0px;color:#fff;opacity:0.7;} @media (max-height : 500px){ .user-icon_signin{display:none;}}
+                    </style>';
     
-                return $css.'<form class="login_form" method="POST">';
+                return $css.'<div class="form-container"><form class="login_form" method="POST">';
             }
             else {
-                return '<form class="logout_form" method="POST">';
+                return '<div class="form-container"><form class="logout_form" method="POST">';
             }
         }
-        if (!$this->get('router_login_state')) {
-            $css = '<style type="text/css">body,html{max-width:100vw !important; max-height:100vh !important; overflow:hidden !important;}.form-container{background-color:#f1f1f1;'.
-                'background: linear-gradient( rgba(4, 26, 0, 0.85), rgba(4, 26, 0, 0.85)), url('.WEB_ROOT.'modules/core/assets/images/cloud.jpg);'.
-                'background-attachment: fixed;background-position: center;background-repeat: no-repeat;background-size: cover;'.
-                'display:grid; place-items:center; height:100vh; width:100vw;} .logged_out{display:block !important;}.sys_messages'.
-                '{position:fixed;right:20px;top:15px;min-height:30px;display:none;background-color:#fff;color:teal;'.
-                'margin-top:0px;padding:15px;padding-bottom:5px;white-space:nowrap;border:solid 1px #999;border-radius:'.
-                '5px;filter:drop-shadow(4px 4px 4px #ccc);z-index:101;}.g-recaptcha{margin:0px 10px 10px 10px;}.mobile .g-recaptcha{'.
-                'margin:0px 10px 5px 10px;}.title{font-weight:normal;padding:0px;margin:0px;margin-left:20px;'.
-                'margin-bottom:20px;letter-spacing:-1px;color:#999;}html,body{min-width:100px !important;'.
-                'background-color:#fff;}body{background:linear-gradient(180deg,#faf6f5,#faf6f5,#faf6f5,#faf6f5,'.
-                '#fff);font-size:1em;color:#333;font-family:Arial;padding:0px;margin:0px;min-width:700px;'.
-                'font-size:100%;}input,option,select{font-size:100%;padding:3px;}textarea,select,input{border:solid '.
-                '1px #ddd;background-color:#fff;color:#333;border-radius:3px;}.screen_reader{position:absolute'.
-                ';top:auto;width:1px;height:1px;overflow:hidden;}.login_form{display:flex; justify-content:space-evenly; align-items:center; flex-direction:column;font-size:90%;'.
-                'padding-top:60px;height:360px;border-radius:20px 20px 20px 20px;margin:0px;background-color:rgba(0,0,0,.6);'.
-                'min-width:300px;}.login_form input{clear:both;float:left;padding:4px;'.
-                'margin-top:10px;margin-bottom:10px;}#username,#password{width:200px; height:25px;} .err{color:red !important;}.long_session'.
-                '{float:left;}.long_session input{padding:0px;float:none;font-size:18px;}.mobile .long_session{float:left;clear:both;} @media screen and (min-width:400px){.login_form{min-width:400px;}}'.
-                '.user-icon_signin{display:block; background-color:white; border-radius:100%; padding:10px; height:40px; margin-top:-120px; box-shadow: #6eb549 .4px 2.4px 6.2px; }'.
-                '.label_signin{width:210px; margin:0px 0px -18px 0px;color:#fff;opacity:0.7;} @media (max-height : 500px){ .user-icon_signin{display:none;}}
-                </style>';
-
-            return $css.'<div class="form-container"><form class="login_form" method="POST">';
-        }
-        else {
-            return '<div class="form-container"><form class="logout_form" method="POST">';
-        }
     }
 }
 
@@ -249,18 +233,31 @@ protected function output() {
             </div>';
         }
         if (!$this->get('router_login_state')) {
-            $fancy_login =  $this->get('fancy_login_allowed');
+            $fancy_login = $this->get('fancy_login_allowed');
             if(!$fancy_login){
-                return '<h1 class="title">'.$this->html_safe($this->get('router_app_name', '')).'</h1>'.
-            '       <input type="hidden" name="hm_page_key" value="'.Hm_Request_Key::generate().'" />'.
-                    ' <label class="screen_reader" for="username">'.$this->trans('Username').'</label>'.
-                    '<input autofocus required type="text" placeholder="'.$this->trans('Username').'" id="username" name="username" value="">'.
-                    ' <label class="screen_reader" for="password">'.$this->trans('Password').'</label>'.
-                    '<input required type="password" id="password" placeholder="'.$this->trans('Password').'" name="password">'.
-                    $stay_logged_in.' <input style="cursor:pointer;" type="submit" id="login" value="'.$this->trans('Login').'" />';
-            }
-
-            return '<svg class="user-icon_signin" viewBox="0 0 20 20"><path d="M12.075,10.812c1.358-0.853,2.242-2.507,2.242-4.037c0-2.181-1.795-4.618-4.198-4.618S5.921,4.594,5.921,6.775c0,1.53,0.884,3.185,2.242,4.037c-3.222,0.865-5.6,3.807-5.6,7.298c0,0.23,0.189,0.42,0.42,0.42h14.273c0.23,0,0.42-0.189,0.42-0.42C17.676,14.619,15.297,11.677,12.075,10.812 M6.761,6.775c0-2.162,1.773-3.778,3.358-3.778s3.359,1.616,3.359,3.778c0,2.162-1.774,3.778-3.359,3.778S6.761,8.937,6.761,6.775 M3.415,17.69c0.218-3.51,3.142-6.297,6.704-6.297c3.562,0,6.486,2.787,6.705,6.297H3.415z"></path></svg>'.
+                return '<div class="bg-light"><div class="d-flex align-items-center justify-content-center vh-100 p-3">
+                    <div class="card col-12 col-md-6 col-lg-4 py-3">
+                        <div class="card-body">
+                            <p class="text-center"><img class="w-50" src="'.WEB_ROOT. 'modules/core/assets/images/logo_dark.svg"></p>
+                            <div class="mt-5">
+                                <div class="mb-3 form-floating">
+                                    <input autofocus required type="text" placeholder="'.$this->trans('Username').'" id="username" name="username" class="form-control">
+                                    <label for="username" class="form-label screen-reader">'.$this->trans('Username').'</label>
+                                </div>
+                                <div class="mb-3 form-floating">
+                                    <input required type="password" id="password" placeholder="'.$this->trans('Password').'" name="password" class="form-control">
+                                    <label for="password" class="form-label screen-reader">'.$this->trans('Password').'</label>
+                                </div>'.
+                                '<div class="d-flex justify-content-between align-items-center">'.$stay_logged_in.
+                                    '<input type="hidden" name="hm_page_key" value="'.Hm_Request_Key::generate().'" />
+                                    <input type="submit" id="login" class="btn btn-success btn-block px-5" value="'.$this->trans('Login').'">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div></div>';
+            } else {
+                return '<svg class="user-icon_signin" viewBox="0 0 20 20"><path d="M12.075,10.812c1.358-0.853,2.242-2.507,2.242-4.037c0-2.181-1.795-4.618-4.198-4.618S5.921,4.594,5.921,6.775c0,1.53,0.884,3.185,2.242,4.037c-3.222,0.865-5.6,3.807-5.6,7.298c0,0.23,0.189,0.42,0.42,0.42h14.273c0.23,0,0.42-0.189,0.42-0.42C17.676,14.619,15.297,11.677,12.075,10.812 M6.761,6.775c0-2.162,1.773-3.778,3.358-3.778s3.359,1.616,3.359,3.778c0,2.162-1.774,3.778-3.359,3.778S6.761,8.937,6.761,6.775 M3.415,17.69c0.218-3.51,3.142-6.297,6.704-6.297c3.562,0,6.486,2.787,6.705,6.297H3.415z"></path></svg>'.
                 '<img src="'.WEB_ROOT. 'modules/core/assets/images/logo.svg" style="height:90px;">'.
                 '<!--h1 class="title">'.$this->html_safe($this->get('router_app_name', '')).'</h1-->'.
                 ' <input type="hidden" name="hm_page_key" value="'.Hm_Request_Key::generate().'" />'.
@@ -269,6 +266,8 @@ protected function output() {
                 ' <label class="label_signin" for="password">'.$this->trans('Password').'</label>'.
                 '<input required type="password" id="password" placeholder="'.$this->trans('Password').'" name="password">'.
                 $stay_logged_in.' <input style="cursor:pointer; display:block; width:210px; background-color:#6eb549; color:white; height:40px;" type="submit" id="login" value="'.$this->trans('Login').'" />';
+            }
+
         }
         else {
             $settings = $this->get('changed_settings', array());

From c660cd723452156037d9d7774723f855fd59ae44 Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Thu, 25 Jan 2024 23:10:38 +0200
Subject: [PATCH 12/13] Fix server registration issue after migration

---
 modules/feeds/modules.php       |   4 +-
 modules/github/modules.php      |   4 +-
 modules/highlights/modules.php  |   4 +-
 modules/imap/functions.php      |  14 +--
 modules/imap/output_modules.php | 157 ++++++++++++++++----------------
 modules/imap/site.css           |  14 +--
 modules/imap/site.js            |   4 +-
 modules/smtp/modules.php        |  47 ++++++----
 modules/smtp/site.js            |   2 +-
 modules/wordpress/modules.php   |   4 +-
 10 files changed, 124 insertions(+), 130 deletions(-)

diff --git a/modules/feeds/modules.php b/modules/feeds/modules.php
index 387620141c..2e87192415 100644
--- a/modules/feeds/modules.php
+++ b/modules/feeds/modules.php
@@ -561,7 +561,7 @@ protected function output() {
                                             <label for="new_feed_address" class="">'.$this->trans('Site address or feed URL').'</label>
                                         </div>
 
-                                        <input type="submit" class="btn btn-success" value="'.$this->trans('Add').'" name="submit_feed" />
+                                        <input type="submit" class="btn btn-success px-5" value="'.$this->trans('Add').'" name="submit_feed" />
                                     </form>
                                 </div>';
         }
@@ -577,7 +577,7 @@ protected function output() {
         $res = '';
         if ($this->format == 'HTML5') {
             foreach ($this->get('feeds', array()) as $index => $vals) {
-                $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
+                $res .= '<div class="configured_server col-12 col-lg-4 mb-2"><div class="card card-body">';
                 $res .= sprintf('<div class="server_title"><b>%s</b></div><div title="%s" class="server_subtitle">%s</div>',
                     $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['server']));
                 $res .= '<form class="feed_connect d-flex gap-2" method="POST">';
diff --git a/modules/github/modules.php b/modules/github/modules.php
index 4a540b64b7..4d4433ef8c 100644
--- a/modules/github/modules.php
+++ b/modules/github/modules.php
@@ -662,8 +662,8 @@ protected function output() {
  */
 class Hm_Output_start_github_settings extends Hm_Output_Module {
     protected function output() {
-        return '<tr><td colspan="2" data-target=".github_all_setting" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$code.'" width="16" height="16" />'.$this->trans('Github Settings').'</td></tr>';
+        return '<tr><td colspan="2" data-target=".github_all_setting" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-github fs-5 me-2"></i>'.$this->trans('Github Settings').'</td></tr>';
     }
 }
 
diff --git a/modules/highlights/modules.php b/modules/highlights/modules.php
index 329dbc7666..81db8786a8 100644
--- a/modules/highlights/modules.php
+++ b/modules/highlights/modules.php
@@ -228,8 +228,8 @@ protected function output() {
         }
         $res .= '</table></div>';
         
-        $res .= '<div class="settings_subtitle mt-3"><b>'.$this->trans('Add a new rule').'</b></div>';
-        $res .= '<div class="col-12 col-lg-5 mt-2">';
+        $res .= '<div class="settings_subtitle mt-3 px-3"><b>'.$this->trans('Add a new rule').'</b></div>';
+        $res .= '<div class="col-12 col-lg-5 mt-2 px-3">';
         $res .= '<form method="POST">';
 
         // Source Type
diff --git a/modules/imap/functions.php b/modules/imap/functions.php
index 03d858723b..c447bcd0bd 100644
--- a/modules/imap/functions.php
+++ b/modules/imap/functions.php
@@ -1385,18 +1385,20 @@ function snooze_formats() {
 if (!hm_exists('snooze_dropdown')) {
 function snooze_dropdown($output, $unsnooze = false) {
     $values = snooze_formats();
-    $txt = '<div style="display: inline-block;">';
-    $txt .= '<a class="snooze_link hlink btn btn-sm btn-outline-success" id="snooze_message" href="#">'.$output->trans('Snooze').'</a>';
-    $txt .= '<div class="snooze_dropdown" style="display:none;">';
+
+    $txt = '<div class="btn-group">
+                <button type="button" class="btn btn-outline-success btn-sm dropdown-toggle" id="dropdownMenuSnooze" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">'.$output->trans('Snooze').'</button>
+                <div class="dropdown-menu mt-4" aria-labelledby="dropdownMenuSnooze">';
     foreach ($values as $format) {
         $labels = get_snooze_date($format, true);
-        $txt .= '<a href="#" class="snooze_helper" data-value="'.$format.'">'.$output->trans($labels[0]).' <span>'.$labels[1].'</span></a>';
+        $txt .= '<a href="#" class="snooze_helper dropdown-item d-flex justify-content-between gap-5 py-2" data-value="'.$format.'"><span>'.$output->trans($labels[0]).'</span> <span class="text-end">'.$labels[1].'</span></a>';
     }
-    $txt .= '<label for="snooze_input_date" class="snooze_date_picker">'.$output->trans('Pick a date').'</label>';
+    $txt .= '<div class="dropdown-divider"></div>';
+    $txt .= '<label for="snooze_input_date" class="snooze_date_picker dropdown-item cursor-pointer">'.$output->trans('Pick a date').'</label>';
     $txt .= '<input id="snooze_input_date" type="datetime-local" min="'.date('Y-m-d\Th:m').'" class="snooze_input_date" style="visibility: hidden; position: absolute; height: 0;">';
     $txt .= '<input class="snooze_input" style="display:none;">';
     if ($unsnooze) {
-        $txt .= '<a href="#" data-value="unsnooze" class="unsnooze snooze_helper">'.$output->trans('Unsnooze').'</a>';
+        $txt .= '<a href="#" data-value="unsnooze" class="unsnooze snooze_helper dropdown-item"">'.$output->trans('Unsnooze').'</a>';
     }
     $txt .= '</div></div>';
 
diff --git a/modules/imap/output_modules.php b/modules/imap/output_modules.php
index 8cd3d041bb..67557ea85d 100644
--- a/modules/imap/output_modules.php
+++ b/modules/imap/output_modules.php
@@ -438,6 +438,7 @@ protected function output() {
                 $disabled = 'disabled="disabled"';
                 $user_pc = $vals['user'];
                 $pass_pc = $this->trans('[saved]');
+                $pass_value = '*************';
             }
             elseif (array_key_exists('nopass', $vals)) {
                 if (array_key_exists('user', $vals)) {
@@ -448,66 +449,61 @@ protected function output() {
                 }
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
+                $pass_value = '';
             }
             else {
                 $user_pc = '';
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
+                $pass_value = '';
             }
-            $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
+            $res .= '<div class="configured_server col-12 col-lg-4 mb-2"><div class="card card-body">';
             $res .= sprintf('<div class="server_title"><b>%s</b></div><div class="server_subtitle">%s/%d %s</div>',
                 $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['port']),
                 $vals['tls'] ? 'TLS' : '' );
-            $res .= '<form class="imap_connect" method="POST">'.
-                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<input type="hidden" name="imap_server_id" class="imap_server_id" value="'.$this->html_safe($index).'" /><span> '.
-                '<label class="screen_reader" for="imap_user_'.$index.'">'.$this->trans('IMAP username').'</label>'.
-                '<input '.$disabled.' id="imap_user_'.$index.'" class="credentials" placeholder="'.$this->trans('Username').
-                '" type="text" name="imap_user" value="'.$this->html_safe($user_pc).'"></span>'.
-                '<span><label class="screen_reader" for="imap_pass_'.$index.'">'.$this->trans('IMAP password').'</label>'.
-                '<input '.$disabled.' id="imap_pass_'.$index.'" class="credentials imap_password" placeholder="'.$pass_pc.
-                '" type="password" name="imap_pass"></span>';
 
-            if ($this->get('sieve_filters_enabled')) {
-                $default_value = '';
-                if (isset($vals['sieve_config_host'])) {
-                    $default_value = $vals['sieve_config_host'];
-
-                    $res .=  '<span><label class="screen_reader" for="imap_sieve_host_'.$index.'">'.$this->trans('Sieve Host').'</label>'.
-                            '<input '.$disabled.' id="imap_sieve_host_'.$index.'" class="credentials imap_sieve_host_input" placeholder="Sieve Host" type="text" name="imap_sieve_host" value="'.$default_value.'"></span>';
-                }
+            $res .= '<form class="imap_connect" method="POST">';
+            $res .= '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />';
+            $res .= '<input type="hidden" name="imap_server_id" class="imap_server_id" value="'.$this->html_safe($index).'" />';
+            
+            // IMAP Username
+            $res .= '<div class="form-floating mb-3">';
+            $res .= '<input '.$disabled.' id="imap_user_'.$index.'" class="form-control credentials" type="text" name="imap_user" value="'.$this->html_safe($user_pc).'" placeholder="'.$this->trans('Username').'">';
+            $res .= '<label for="imap_user_'.$index.'">'.$this->trans('IMAP username').'</label></div>';
+            
+            // IMAP Password
+            $res .= '<div class="form-floating mb-3">';
+            $res .= '<input '.$disabled.' id="imap_pass_'.$index.'" class="form-control credentials imap_password" type="password" name="imap_pass" value="'.$pass_value.'" placeholder="'.$pass_pc.'">';
+            $res .= '<label for="imap_pass_'.$index.'">'.$this->trans('IMAP password').'</label></div>';
+            
+            // Sieve Host (Conditional)
+            if ($this->get('sieve_filters_enabled') && isset($vals['sieve_config_host'])) {
+                $default_value = $vals['sieve_config_host'];
+                $res .= '<div class="form-floating mb-3">';
+                $res .= '<input '.$disabled.' id="imap_sieve_host_'.$index.'" class="form-control credentials imap_sieve_host_input" type="text" name="imap_sieve_host" value="'.$default_value.'" placeholder="Sieve Host">';
+                $res .= '<label for="imap_sieve_host_'.$index.'">'.$this->trans('Sieve Host').'</label></div>';
             }
-
-            $res .= '<div class="d-flex gap-2">';
+            
+            // Buttons
             if (!isset($vals['user']) || !$vals['user']) {
-                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete btn btn-outline-danger btn-sm" />';
-                $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_imap_connection btn btn-outline-secondary btn-sm" />';
-            }
-            else {
-                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_imap_connect btn btn-outline-secondary btn-sm" />';
-                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete btn btn-outline-danger btn-sm" />';
-                $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_imap_connection btn btn-outline-warning btn-sm" />';
-            }
-
-            $hidden = false;
-            if (array_key_exists('hide', $vals) && $vals['hide']) {
-                $hidden = true;
-            }
-            $res .= '<input type="submit" ';
-            if ($hidden) {
-                $res .= 'style="display: none;" ';
-            }
-            $res .= 'value="'.$this->trans('Hide').'" class="hide_imap_connection btn btn-outline-secondary btn-sm" />';
-            $res .= '<input type="submit" ';
-            if (!$hidden) {
-                $res .= 'style="display: none;" ';
+                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete btn btn-outline-danger btn-sm me-2" />';
+                $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_imap_connection btn btn-outline-secondary btn-sm me-2" />';
+            } else {
+                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_imap_connect btn btn-outline-secondary btn-sm me-2" />';
+                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete btn btn-outline-danger btn-sm me-2" />';
+                $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_imap_connection btn btn-outline-warning btn-sm me-2" />';
             }
-            $res .= 'value="'.$this->trans('Unhide').'" class="unhide_imap_connection btn btn-outline-secondary btn-sm" />';
+            
+            // Hide/Unhide Buttons
+            $hidden = array_key_exists('hide', $vals) && $vals['hide'];
+            $res .= '<input type="submit" '.($hidden ? 'style="display: none;" ' : '').'value="'.$this->trans('Hide').'" class="hide_imap_connection btn btn-outline-secondary btn-sm me-2" />';
+            $res .= '<input type="submit" '.(!$hidden ? 'style="display: none;" ' : '').'value="'.$this->trans('Unhide').'" class="unhide_imap_connection btn btn-outline-secondary btn-sm me-2" />';
+            
             $res .= '<input type="hidden" value="ajax_imap_debug" name="hm_ajax_hook" />';
+            $res .= '</form>';
+                
 
-            $res .= '</div>';
-
-            $res .= '</form></div></div>';
+            $res .= '</div></div>';
         }
         $res .= '<br class="clear_float" /></div></div></div></div>';
         return $res;
@@ -671,6 +667,7 @@ protected function output() {
                 $disabled = 'disabled="disabled"';
                 $user_pc = $vals['user'];
                 $pass_pc = $this->trans('[saved]');
+                $pass_value = '*************';
             }
             elseif (array_key_exists('nopass', $vals)) {
                 if (array_key_exists('user', $vals)) {
@@ -681,54 +678,52 @@ protected function output() {
                 }
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
+                $pass_value = '';
             }
             else {
                 $user_pc = '';
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
+                $pass_value = '';
             }
-            $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
+            $res .= '<div class="configured_server col-12 col-lg-4 mb-2"><div class="card card-body">';
             $res .= sprintf('<div class="server_title">%s</div><div class="server_subtitle">%s</div>',
-                $this->html_safe($vals['name']), $this->html_safe($vals['server']));
-            $res .= '<form class="imap_connect" method="POST">'.
-                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<input type="hidden" name="imap_server_id" class="imap_server_id" value="'.$this->html_safe($index).'" /><span> '.
-                '<label class="screen_reader" for="imap_user_'.$index.'">'.$this->trans('JMAP username').'</label>'.
-                '<input '.$disabled.' id="imap_user_'.$index.'" class="credentials" placeholder="'.$this->trans('Username').
-                '" type="text" name="imap_user" value="'.$this->html_safe($user_pc).'"></span>'.
-                '<span><label class="screen_reader" for="imap_pass_'.$index.'">'.$this->trans('JMAP password').'</label>'.
-                '<input '.$disabled.' id="imap_pass_'.$index.'" class="credentials imap_password" placeholder="'.$pass_pc.
-                '" type="password" name="imap_pass"></span>';
-
-            $res .= '<div class="d-flex gap-2">';    
+            $this->html_safe($vals['name']), $this->html_safe($vals['server']));
+            
+            $res .= '<form class="imap_connect" method="POST">';
+            $res .= '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />';
+            $res .= '<input type="hidden" name="imap_server_id" class="imap_server_id" value="'.$this->html_safe($index).'" />';
 
+            // JMAP Username
+            $res .= '<div class="form-floating mb-3">';
+            $res .= '<input '.$disabled.' id="imap_user_'.$index.'" class="form-control credentials" type="text" name="imap_user" value="'.$this->html_safe($user_pc).'" placeholder="'.$this->trans('Username').'">';
+            $res .= '<label for="imap_user_'.$index.'">'.$this->trans('JMAP username').'</label></div>';
+
+            // JMAP Password
+            $res .= '<div class="form-floating mb-3">';
+            $res .= '<input '.$disabled.' id="imap_pass_'.$index.'" class="form-control credentials imap_password" type="password" name="imap_pass" value="'.$pass_value.'" placeholder="'.$pass_pc.'">';
+            $res .= '<label for="imap_pass_'.$index.'">'.$this->trans('JMAP password').'</label></div>';
+
+            // Buttons
             if (!isset($vals['user']) || !$vals['user']) {
-                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete" />';
-                $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_imap_connection" />';
-            }
-            else {
-                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_imap_connect" />';
-                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="imap_delete" />';
-                $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_imap_connection" />';
-            }
-            $hidden = false;
-            if (array_key_exists('hide', $vals) && $vals['hide']) {
-                $hidden = true;
-            }
-            $res .= '<input type="submit" ';
-            if ($hidden) {
-                $res .= 'style="display: none;" ';
+                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="btn btn-outline-danger btn-sm imap_delete me-2" />';
+                $res .= '<input type="submit" value="'.$this->trans('Save').'" class="btn btn-outline-success btn-sm save_imap_connection me-2" />';
+            } else {
+                $res .= '<input type="submit" value="'.$this->trans('Test').'" class="btn btn-outline-secondary btn-sm test_imap_connect me-2" />';
+                $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="btn btn-danger btn-sm imap_delete me-2" />';
+                $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="btn btn-outline-warning btn-sm forget_imap_connection me-2" />';
             }
 
-            $res .= 'value="'.$this->trans('Hide').'" class="hide_imap_connection" />';
-            $res .= '<input type="submit" ';
-            if (!$hidden) {
-                $res .= 'style="display: none;" ';
-            }
-            $res .= 'value="'.$this->trans('Unhide').'" class="unhide_imap_connection" />';
+            // Hide/Unhide Button Logic
+            $hidden = array_key_exists('hide', $vals) && $vals['hide'];
+            $res .= '<input type="submit" '.($hidden ? 'style="display: none;" ' : '').'value="'.$this->trans('Hide').'" class="btn btn-outline-secondary btn-sm hide_imap_connection me-2" />';
+            $res .= '<input type="submit" '.(!$hidden ? 'style="display: none;" ' : '').'value="'.$this->trans('Unhide').'" class="btn btn-outline-secondary btn-sm unhide_imap_connection me-2" />';
+
             $res .= '<input type="hidden" value="ajax_imap_debug" name="hm_ajax_hook" />';
-            $res .= '</div>';
-            $res .= '</form></div></div>';
+            $res .= '</form>';
+
+
+            $res .= '</div></div>';
         }
         $res .= '<br class="clear_float" /></div></div></div>';
         return $res;
diff --git a/modules/imap/site.css b/modules/imap/site.css
index c22d2cdbc6..0ec1032ed5 100644
--- a/modules/imap/site.css
+++ b/modules/imap/site.css
@@ -6,7 +6,7 @@
 .hl { padding-right: 5px; color: #666; }
 .dl { color: #888; }
 .empty_list { text-align: center; color: #ccc; font-size: 2em; font-style: italic; padding: 30px; padding-bottom: 100px; }
-.credentials { width: 205px; margin-bottom: 15px !important; }
+/* .credentials { width: 205px; margin-bottom: 15px !important; } */
 /* .add_server .txt_fld { width: 205px; } */
 /* .add_server .port_fld { width: 50px; } */
 /* .server_title { font-size: 110%; margin-bottom: 0px; color: #666; } */
@@ -21,7 +21,6 @@
 .imap_update a { color: teal; font-size: 75%; vertical-align: 1px; text-decoration: none; padding-left: 10px; letter-spacing: 0px; }
 .close_link { float: right; padding-right: 20px; text-decoration: none; color: teal; font-size: 90%; margin-bottom: 10px;}
 .header_links { padding-top: 10px !important; }
-.header_links a { float: none !important; padding-left: 3px !important; padding-right: 3px !important; }
 .overlay {position: fixed; height: 100%; width: 100%; z-index: 100; background-color: #ccc; opacity: .7; }
 .account_row { cursor: pointer; }
 .expand_link { display: block; width: 16px; height: 16px; float: left; margin-right: 0px; margin-left: 0px; font-size: 16px; text-align: left; }
@@ -100,17 +99,6 @@
 #block_sender_form label, #block_sender_form select, #block_sender_form textarea { display: block; margin: 3px 0; width: 100%; }
 #block_sender_form label { text-transform: capitalize; }
 
-.snooze_date_picker, .snooze_helper { color: #333; text-transform: capitalize; }
-.snooze_date_picker { border-top: 1px solid #ddd; }
-.snooze_dropdown { position: absolute; margin-top: 15px; background-color: #fff; border: 1px solid #ddd; box-shadow: 3px 3px 3px #ddd; font-variant: none;     min-width: 250px; }
-.snooze_date_picker:hover, .snooze_helper:hover { background-color: #eee; }
-.header_links a.snooze_date_picker, .header_links a.snooze_helper, .msg_controls a.snooze_date_picker, .msg_controls a.snooze_helper { padding: 8px; padding-left: 15px !important; padding-right: 15px !important; white-space: nowrap; font-size: 1rem; display: block !important; margin-right: 0; border: 0; }
-.snooze_helper span { float: right; }
-.snooze_date_picker { display: block; padding: 8px 15px; color: #333; font-size: 1rem; cursor: pointer; }
-.unsnooze { color: teal; }
-.header_x-snoozed .unsnooze { margin-left: 20px; }
-
-
 /* Popup container - can be anything you want */
 .popup {
     position: relative;
diff --git a/modules/imap/site.js b/modules/imap/site.js
index 28c6dc86e9..351b3029a3 100644
--- a/modules/imap/site.js
+++ b/modules/imap/site.js
@@ -65,7 +65,7 @@ var imap_forget_action = function(event) {
             if (res.just_forgot_credentials) {
                 form.find('.credentials').prop('disabled', false);
                 form.find('.credentials').val('');
-                form.append('<input type="submit" value="Save" class="save_imap_connection" />');
+                form.append('<input type="submit" value="Save" class="save_imap_connection btn btn-success-warning btn-sm" />');
                 $('.save_imap_connection').on('click', imap_save_action);
                 $('.forget_imap_connection', form).hide();
                 Hm_Utils.set_unsaved_changes(1);
@@ -88,7 +88,7 @@ var imap_save_action = function(event) {
                 form.find('.save_imap_connection').hide();
                 form.find('.imap_password').val('');
                 form.find('.imap_password').attr('placeholder', '[saved]');
-                form.append('<input type="submit" value="Forget" class="forget_imap_connection" />');
+                form.append('<input type="submit" value="Forget" class="forget_imap_connection btn btn-outline-warning btn-sm" />');
                 $('.forget_imap_connection').on('click', imap_forget_action);
                 Hm_Utils.set_unsaved_changes(1);
                 Hm_Folders.reload_folders(true);
diff --git a/modules/smtp/modules.php b/modules/smtp/modules.php
index 91a7bbc362..3afb701f75 100644
--- a/modules/smtp/modules.php
+++ b/modules/smtp/modules.php
@@ -1363,45 +1363,54 @@ protected function output() {
                 $disabled = 'disabled="disabled"';
                 $user_pc = $vals['user'];
                 $pass_pc = $this->trans('[saved]');
+                $pass_value = '************';
             }
             elseif (array_key_exists('user', $vals) && array_key_exists('nopass', $vals)) {
                 $user_pc = $vals['user'];
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
+                $pass_value = '';
             }
             else {
                 $user_pc = '';
                 $pass_pc = $this->trans('Password');
                 $disabled = '';
+                $pass_value = '';
             }
-            $res .= '<div class="configured_server col-12 col-lg-4"><div class="card card-body">';
+            $res .= '<div class="configured_server col-12 col-lg-4 mb-3"><div class="card card-body">';
             $res .= sprintf('<div class="server_title"><b>%s</b></div><div class="server_subtitle">%s/%d %s</div>',
                 $this->html_safe($vals['name']), $this->html_safe($vals['server']), $this->html_safe($vals['port']), $vals['tls'] ? 'TLS' : '' );
-            $res .=
-                '<form class="smtp_connect" method="POST">'.
-                '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />'.
-                '<input type="hidden" name="smtp_server_id" value="'.$this->html_safe($index).'" /><span> '.
-                '<label class="screen_reader" for="smtp_user_'.$index.'">'.$this->trans('SMTP username').'</label>'.
-                '<input '.$disabled.' class="credentials" id="smtp_user_'.$index.'" placeholder="'.$this->trans('Username').
-                '" type="text" name="smtp_user" value="'.$this->html_safe($user_pc).'"></span><br/><span> <label class="screen_reader" for="smtp_pass_'.
-                $index.'">'.$this->trans('SMTP password').'</label><input '.$disabled.' class="credentials smtp_password" placeholder="'.
-                $pass_pc.'" type="password" id="smtp_pass_'.$index.'" name="smtp_pass"></span>';
-
-            $res .= '<div class="d-flex gap-2">';
+            
+            $res .= '<form class="smtp_connect" method="POST">';
+            $res .= '<input type="hidden" name="hm_page_key" value="'.$this->html_safe(Hm_Request_Key::generate()).'" />';
+            $res .= '<input type="hidden" name="smtp_server_id" value="'.$this->html_safe($index).'" />';
+            
+            // SMTP Username
+            $res .= '<div class="form-floating mb-3">';
+            $res .= '<input '.$disabled.' class="form-control credentials" id="smtp_user_'.$index.'" type="text" name="smtp_user" value="'.$this->html_safe($user_pc).'" placeholder="'.$this->trans('Username').'">';
+            $res .= '<label for="smtp_user_'.$index.'">'.$this->trans('SMTP username').'</label></div>';
+            
+            // SMTP Password
+            $res .= '<div class="form-floating mb-3">';
+            $res .= '<input '.$disabled.' class="form-control credentials smtp_password" type="password" id="smtp_pass_'.$index.'" name="smtp_pass" value="'.$pass_value.'" placeholder="'.$pass_pc.'">';
+            $res .= '<label for="smtp_pass_'.$index.'">'.$this->trans('SMTP password').'</label></div>';
+            
+            // Buttons
             if (!$no_edit) {
                 if (!isset($vals['user']) || !$vals['user']) {
-                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection btn btn-light border btn-sm" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_smtp_connection btn btn-light border btn-sm" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection btn btn-light border btn-sm me-2" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Save').'" class="save_smtp_connection btn btn-light border btn-sm me-2" />';
                 }
                 else {
-                    $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_smtp_connect btn btn-outline-secondary btn-sm" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection btn btn-outline-danger btn-sm" />';
-                    $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_smtp_connection btn btn-outline-warning btn-sm" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Test').'" class="test_smtp_connect btn btn-outline-secondary btn-sm me-2" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Delete').'" class="delete_smtp_connection btn btn-outline-danger btn-sm me-2" />';
+                    $res .= '<input type="submit" value="'.$this->trans('Forget').'" class="forget_smtp_connection btn btn-outline-secondary btn-sm me-2" />';
                 }
                 $res .= '<input type="hidden" value="ajax_smtp_debug" name="hm_ajax_hook" />';
             }
-            $res .= '</div>';
-            $res .= '</form></div></div>';
+            $res .= '</form>';
+
+            $res .= '</div></div>';
         }
         $res .= '<br class="clear_float" /></div></div></div>';
         return $res;
diff --git a/modules/smtp/site.js b/modules/smtp/site.js
index 10b660d8d0..24bc7c4d83 100644
--- a/modules/smtp/site.js
+++ b/modules/smtp/site.js
@@ -44,7 +44,7 @@ var smtp_save_action = function(event) {
                 form.find('.save_smtp_connection').hide();
                 form.find('.smtp_password').val('');
                 form.find('.smtp_password').attr('placeholder', '[saved]');
-                form.append('<input type="submit" value="Forget" class="forget_smtp_connection" />');
+                form.append('<input type="submit" value="Forget" class="forget_smtp_connection btn btn-outline-secondary btn-sm" />');
                 $('.forget_smtp_connection').on('click', smtp_forget_action);
                 Hm_Utils.set_unsaved_changes(1);
                 Hm_Folders.reload_folders(true);
diff --git a/modules/wordpress/modules.php b/modules/wordpress/modules.php
index 9eccfe4b06..553de3708f 100644
--- a/modules/wordpress/modules.php
+++ b/modules/wordpress/modules.php
@@ -393,8 +393,8 @@ protected function output() {
  */
 class Hm_Output_start_wordpress_settings extends Hm_Output_Module {
     protected function output() {
-        return '<tr><td colspan="2" data-target=".wp_notifications_setting" class="settings_subtitle">'.
-            '<img alt="" src="'.Hm_Image_Sources::$w.'" width="16" height="16" />'.$this->trans('WordPress.com Settings').'</td></tr>';
+        return '<tr><td colspan="2" data-target=".wp_notifications_setting" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
+            '<i class="bi bi-wordpress fs-5 me-2"></i>'.$this->trans('WordPress.com Settings').'</td></tr>';
     }
 }
 

From eedadad02d4b5292d7e1af66b63d8e440c600de7 Mon Sep 17 00:00:00 2001
From: Alvin Bauma <alvinbauma10@gmail.com>
Date: Tue, 6 Feb 2024 13:29:15 +0200
Subject: [PATCH 13/13] Fix failed unit tests

---
 language/fa.php                               |   2 +-
 modules/2fa/modules.php                       |  18 +--
 modules/2fa/site.css                          |   4 -
 modules/smtp/modules.php                      |   4 +-
 .../modules/core/message_list_functions.php   |  20 +--
 tests/phpunit/modules/core/modules.php        | 136 +++++++++---------
 6 files changed, 83 insertions(+), 101 deletions(-)

diff --git a/language/fa.php b/language/fa.php
index 3feb7cdbc6..71c9a8095a 100755
--- a/language/fa.php
+++ b/language/fa.php
@@ -249,7 +249,7 @@
     "Github Connect"=>"Github Connect",
     "Hide From Combined Pages"=>"پنهان کردن از صفحات ترکیبی",
     "Save Settings"=>"تنظیمات را ذخیره کن",
-    "Settings are not saved permanently on the server unless you explicitly allow it. If you don't save your settings, any changes made since you last logged in will be deleted when your session expires or you logout. You must re-enter your password for security purposes to save your settings permanently."=>"تنظیمات برای همیشه در سرور ذخیره نمی شوند ، مگر اینکه صریحاً اجازه آن را بدهید. اگر تنظیمات خود را ذخیره نکنید ، با اتمام جلسه یا خارج شدن از سیستم ، هر تغییری که از آخرین ورود به سیستم انجام داده اید ، حذف خواهد شد. برای ذخیره تنظیمات خود باید دوباره رمز ورود خود را برای اهداف امنیتی وارد کنید.",
+    "Settings are not saved permanently on the server unless you explicitly allow it. If you don\'t save your settings, any changes made since you last logged in will be deleted when your session expires or you logout. You must re-enter your password for security purposes to save your settings permanently."=>"تنظیمات برای همیشه در سرور ذخیره نمی شوند ، مگر اینکه صریحاً اجازه آن را بدهید. اگر تنظیمات خود را ذخیره نکنید ، با اتمام جلسه یا خارج شدن از سیستم ، هر تغییری که از آخرین ورود به سیستم انجام داده اید ، حذف خواهد شد. برای ذخیره تنظیمات خود باید دوباره رمز ورود خود را برای اهداف امنیتی وارد کنید.",
     "Add a Repository"=>"مخزن اضافه کنید",
     "Disconnect"=>"قطع شدن",
     "Already connected"=>"قبلاً متصل شده اید",
diff --git a/modules/2fa/modules.php b/modules/2fa/modules.php
index ca0d15bb18..21750235bb 100644
--- a/modules/2fa/modules.php
+++ b/modules/2fa/modules.php
@@ -147,19 +147,6 @@ protected function output() {
         if (array_key_exists('2fa_enable', $settings)) {
             $enabled = $settings['2fa_enable'];
         }
-<<<<<<< HEAD
-        $res = '<tr>
-                    <td colspan="2" data-target=".tfa_setting" class="settings_subtitle">'.
-                        '<img alt="" src="'.Hm_Image_Sources::$unlocked.'" width="16" height="16" />'.$this->trans('2 Factor Authentication').'
-                    </td>
-                </tr>';
-
-        $res .= '<tr class="tfa_setting">
-                    <td>
-                        '.$this->trans('Enable 2 factor authentication').'
-                        <input value="1" type="checkbox" name="2fa_enable" '.($enabled ? 'checked="checked"' : '').' />';
-
-=======
         $res = '<tr><td colspan="2" data-target=".tfa_setting" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary">'.
             '<i class="bi bi-unlock-fill fs-5 me-2"></i>'.$this->trans('2 Factor Authentication').'</td></tr>';
 
@@ -169,7 +156,6 @@ protected function output() {
             $res .= ' checked="checked"';
         }
         $res .= '></td></tr>';
->>>>>>> ba2058f0 (2fa Module)
         $svg = $this->get('2fa_svg');
 
         if ($svg) {
@@ -196,7 +182,7 @@ protected function output() {
             $res .= ' '.$val.'<input type="hidden" name="2fa_backup_codes[]" value="'.$val.'" /></br >';
         }
         $res .= '<div class="tfa_mt_1">
-                    <fieldset class="tfa_confirmation_fieldset">
+                    <fieldset class="tfa_confirmation_fieldset p-3">
                         <legend>Enter the confirmation code</legend>
                         <div class="tfa_confirmation_wrapper">
                             <div class="tfa_confirmation_form">
@@ -208,7 +194,7 @@ protected function output() {
                                     <input class="tfa_confirmation_input_digit" type="number" aria-label="Digit 4" aria-required="true">
                                     <input class="tfa_confirmation_input_digit" type="number" aria-label="Digit 5" aria-required="true">
                                 </div>
-                                <button id="tfaConfirmationBtn" type="submit" class="tfa_confirmation_input_button">'.$this->trans('Verify code').'</button>
+                                <button id="tfaConfirmationBtn" type="submit" class="tfa_confirmation_input_button btn btn-light border-1">'.$this->trans('Verify code').'</button>
                             </div>
                             <div class="tfa_confirmation_hint"> '.$this->trans('Enter the 6 digit code from your Authenticator application').'</div>
                         </div>
diff --git a/modules/2fa/site.css b/modules/2fa/site.css
index c98a6077f1..899b8eaef8 100644
--- a/modules/2fa/site.css
+++ b/modules/2fa/site.css
@@ -1,4 +1,3 @@
-<<<<<<< HEAD
 :root {
     --tfa-form-valid-color: #198754;
     --tfa-form-valid-border-color: #198754;
@@ -218,6 +217,3 @@
 /**
 	**		Shake Annimation Ends Here.
 	**/
-=======
-.tfa_setting { display: none; }
->>>>>>> ba2058f0 (2fa Module)
diff --git a/modules/smtp/modules.php b/modules/smtp/modules.php
index 3afb701f75..00f728007c 100644
--- a/modules/smtp/modules.php
+++ b/modules/smtp/modules.php
@@ -1131,11 +1131,11 @@ protected function output() {
                     '<input value="'.$this->html_safe($subject).'" required name="compose_subject" class="compose_subject form-control" type="text" placeholder="'.$this->trans('Subject').'" id="compose_subject" />'.
                     '<label for="compose_subject">'.$this->trans('Subject').'</label>'.
                 '</div>'.
-                '<div class="form-floating">'.
+                '<div class="form-floating mb-3">'.
                     '<textarea id="compose_body" name="compose_body" class="compose_body form-control" placeholder="'.$this->trans('Message').'">'.$this->html_safe($body).'</textarea>'.
                     '<label for="compose_body">'.$this->trans('Message').'</label>'.
                 '</div>'.
-                '<div><input value="1" name="compose_delivery_receipt" id="compose_delivery_receipt" type="checkbox" /><label for="compose_delivery_receipt">'.$this->trans('Request a delivery receipt').'</label></div>';
+                '<div class="form-check mb-3"><input value="1" name="compose_delivery_receipt" id="compose_delivery_receipt" type="checkbox" class="form-check-input" /><label for="compose_delivery_receipt" class="form-check-label">'.$this->trans('Request a delivery receipt').'</label></div>';
         if ($html == 2) {
             $res .= '<link href="'.WEB_ROOT.'modules/smtp/assets/markdown/editor.css" rel="stylesheet" />'.
                 '<script type="text/javascript" src="'.WEB_ROOT.'modules/smtp/assets/markdown/editor.js"></script>'.
diff --git a/tests/phpunit/modules/core/message_list_functions.php b/tests/phpunit/modules/core/message_list_functions.php
index 9bd6c2adf7..5dc21c0fdc 100644
--- a/tests/phpunit/modules/core/message_list_functions.php
+++ b/tests/phpunit/modules/core/message_list_functions.php
@@ -29,9 +29,9 @@ public function test_get_message_list_settings() {
     public function test_get_message_list_meta() {
         $mod = new Hm_Output_Test(array('foo' => 'bar', 'bar' => 'foo'), array('bar'));
         $this->assertEquals('', message_list_meta(array(), $mod));
-        $this->assertEquals('<div class="list_meta">last 7 days<b>-</b><span class="src_count"></span> sources@20 each<b>-</b><span class="total"></span> total</div>', message_list_meta(array('list_meta' => 'foo', 'message_list_since' => '-1 week'), $mod));
-        $this->assertEquals('<div class="list_meta">last 7 days<b>-</b><span class="src_count"></span> sources@5 each<b>-</b><span class="total"></span> total</div>', message_list_meta(array('list_meta' => 'foo', 'per_source_limit' => 5), $mod));
-        $this->assertEquals('<div class="list_meta">last 7 days<b>-</b><span class="src_count"></span> sources@5 each<b>-</b><span class="total"></span> total</div>', message_list_meta(array('list_meta' => 'foo', 'per_source_limit' => 5, 'message_list_since' => '-1 week'), $mod));
+        $this->assertEquals('<div class="list_meta d-flex align-items-center fs-6">last 7 days<b>-</b><span class="src_count"></span> sources@20 each<b>-</b><span class="total"></span> total</div>', message_list_meta(array('list_meta' => 'foo', 'message_list_since' => '-1 week'), $mod));
+        $this->assertEquals('<div class="list_meta d-flex align-items-center fs-6">last 7 days<b>-</b><span class="src_count"></span> sources@5 each<b>-</b><span class="total"></span> total</div>', message_list_meta(array('list_meta' => 'foo', 'per_source_limit' => 5), $mod));
+        $this->assertEquals('<div class="list_meta d-flex align-items-center fs-6">last 7 days<b>-</b><span class="src_count"></span> sources@5 each<b>-</b><span class="total"></span> total</div>', message_list_meta(array('list_meta' => 'foo', 'per_source_limit' => 5, 'message_list_since' => '-1 week'), $mod));
     }
     /**
      * @preserveGlobalState disabled
@@ -107,7 +107,7 @@ public function test_icon_callback() {
      */
     public function test_message_controls() {
         $mod = new Hm_Output_Test(array('msg_controls_extra' => 'foo', 'foo' => 'bar', 'bar' => 'foo'), array('bar'));
-        $this->assertEquals('<a class="toggle_link" href="#"><img alt="x" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M6.406%201l-.719.688-2.781%202.781-.781-.781-.719-.688-1.406%201.406.688.719%201.5%201.5.719.688.719-.688%203.5-3.5.688-.719-1.406-1.406z%22%20%2F%3E%0A%3C%2Fsvg%3E" width="8" height="8" /></a><div class="msg_controls"><a class="msg_read core_msg_control" href="#" data-action="read">Read</a><a class="msg_unread core_msg_control" href="#" data-action="unread">Unread</a><a class="msg_flag core_msg_control" href="#" data-action="flag">Flag</a><a class="msg_unflag core_msg_control" href="#" data-action="unflag">Unflag</a><a class="msg_delete core_msg_control" href="#" data-action="delete">Delete</a><a class="msg_archive core_msg_control" href="#" data-action="archive">Archive</a>foo</div>', message_controls($mod));
+        $this->assertEquals('<a class="toggle_link border px-1 m-0" href="#"><i class="bi bi-check"></i></a><div class="msg_controls fs-6 d-none gap-2"><a class="msg_read core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="read">Read</a><a class="msg_unread core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="unread">Unread</a><a class="msg_flag core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="flag">Flag</a><a class="msg_unflag core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="unflag">Unflag</a><a class="msg_delete core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="delete">Delete</a><a class="msg_archive core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="archive">Archive</a>foo</div>', message_controls($mod));
     }
     /**
      * @preserveGlobalState disabled
@@ -115,7 +115,7 @@ public function test_message_controls() {
      */
     public function test_message_since_dropdown() {
         $mod = new Hm_Output_Test(array('foo' => 'bar', 'bar' => 'foo'), array('bar'));
-        $this->assertEquals('<select name="foo" id="foo" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select>', message_since_dropdown('-1 week', 'foo', $mod));
+        $this->assertEquals('<select name="foo" id="foo" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select>', message_since_dropdown('-1 week', 'foo', $mod));
     }
     /**
      * @preserveGlobalState disabled
@@ -160,18 +160,18 @@ public function test_validate_search_field() {
      */
     public function test_search_field_selection() {
         $mod = new Hm_Output_Test(array('foo' => 'bar', 'bar' => 'foo'), array('bar'));
-        $this->assertEquals('<select id="search_fld" name="search_fld"><option selected="selected" value="TEXT">Entire message</option><option value="BODY">Message body</option><option value="SUBJECT">Subject</option><option value="FROM">From</option><option value="TO">To</option><option value="CC">Cc</option></select>', search_field_selection('TEXT', $mod));
-        $this->assertEquals('<select id="search_fld" name="search_fld"><option value="TEXT">Entire message</option><option value="BODY">Message body</option><option value="SUBJECT">Subject</option><option value="FROM">From</option><option value="TO">To</option><option value="CC">Cc</option></select>', search_field_selection('foo', $mod));
+        $this->assertEquals('<select class="form-select form-select-sm w-auto" id="search_fld" name="search_fld"><option selected="selected" value="TEXT">Entire message</option><option value="BODY">Message body</option><option value="SUBJECT">Subject</option><option value="FROM">From</option><option value="TO">To</option><option value="CC">Cc</option></select>', search_field_selection('TEXT', $mod));
+        $this->assertEquals('<select class="form-select form-select-sm w-auto" id="search_fld" name="search_fld"><option value="TEXT">Entire message</option><option value="BODY">Message body</option><option value="SUBJECT">Subject</option><option value="FROM">From</option><option value="TO">To</option><option value="CC">Cc</option></select>', search_field_selection('foo', $mod));
     }
     /**
      * @preserveGlobalState disabled
      * @runInSeparateProcess
      */
     public function test_build_page_links() {
-        $this->assertEquals('<a href="?page=message_list&amp;list_path=%2F&amp;list_page=4"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M6%200l-4%204%204%204v-8z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&larr;" /></a>  <a href="?page=message_list&amp;list_path=%2F&amp;list_page=1">1</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2">2</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=3">3</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=4">4</a> <a class="current_page" href="?page=message_list&amp;list_path=%2F&amp;list_page=5">5</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6">6</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=7">7</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=8">8</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=9">9</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=10">10</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=11">11</a> ... <a href="?page=message_list&amp;list_path=%2F&amp;list_page=100">100</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M2%200v8l4-4-4-4z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&rarr;" /></a>', build_page_links(10, 5, 1000, '/'));
-        $this->assertEquals('<a href="?page=message_list&amp;list_path=%2F&amp;list_page=9"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M6%200l-4%204%204%204v-8z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&larr;" /></a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=1">1</a> ...  <a href="?page=message_list&amp;list_path=%2F&amp;list_page=4">4</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=5">5</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6">6</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=7">7</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=8">8</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=9">9</a> <a class="current_page" href="?page=message_list&amp;list_path=%2F&amp;list_page=10">10</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=11">11</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=12">12</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=13">13</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=14">14</a> ... <a href="?page=message_list&amp;list_path=%2F&amp;list_page=100">100</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=11"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M2%200v8l4-4-4-4z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&rarr;" /></a>', build_page_links(10, 10, 1000, '/'));
+        $this->assertEquals('<a href="?page=message_list&amp;list_path=%2F&amp;list_page=4"><i class="bi bi-caret-left-fill"></i></a>  <a href="?page=message_list&amp;list_path=%2F&amp;list_page=1">1</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2">2</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=3">3</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=4">4</a> <a class="current_page fw-bolder" href="?page=message_list&amp;list_path=%2F&amp;list_page=5">5</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6">6</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=7">7</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=8">8</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=9">9</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=10">10</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=11">11</a> ... <a href="?page=message_list&amp;list_path=%2F&amp;list_page=100">100</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6"><i class="bi bi-caret-right-fill"></i></a>', build_page_links(10, 5, 1000, '/'));
+        $this->assertEquals('<a href="?page=message_list&amp;list_path=%2F&amp;list_page=9"><i class="bi bi-caret-left-fill"></i></a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=1">1</a> ...  <a href="?page=message_list&amp;list_path=%2F&amp;list_page=4">4</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=5">5</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6">6</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=7">7</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=8">8</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=9">9</a> <a class="current_page fw-bolder" href="?page=message_list&amp;list_path=%2F&amp;list_page=10">10</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=11">11</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=12">12</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=13">13</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=14">14</a> ... <a href="?page=message_list&amp;list_path=%2F&amp;list_page=100">100</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=11"><i class="bi bi-caret-right-fill"></i></a>', build_page_links(10, 10, 1000, '/'));
         $this->assertEquals('', build_page_links(10, 1, 10, '/'));
-        $this->assertEquals('<a class="disabled_link"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M6%200l-4%204%204%204v-8z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&larr;" /></a>  <a class="current_page" href="?page=message_list&amp;list_path=%2F&amp;list_page=1&amp;filter=1&amp;sort=1">1</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2&amp;filter=1&amp;sort=1">2</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=3&amp;filter=1&amp;sort=1">3</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=4&amp;filter=1&amp;sort=1">4</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=5&amp;filter=1&amp;sort=1">5</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6&amp;filter=1&amp;sort=1">6</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=7&amp;filter=1&amp;sort=1">7</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=8&amp;filter=1&amp;sort=1">8</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=9&amp;filter=1&amp;sort=1">9</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=10&amp;filter=1&amp;sort=1">10</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2&amp;filter=1&amp;sort=1"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M2%200v8l4-4-4-4z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&rarr;" /></a>', build_page_links(10, 1, 100, '/', true, true));
+        $this->assertEquals('<a class="disabled_link"><i class="bi bi-caret-left-fill"></i></a>  <a class="current_page fw-bolder" href="?page=message_list&amp;list_path=%2F&amp;list_page=1&amp;filter=1&amp;sort=1">1</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2&amp;filter=1&amp;sort=1">2</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=3&amp;filter=1&amp;sort=1">3</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=4&amp;filter=1&amp;sort=1">4</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=5&amp;filter=1&amp;sort=1">5</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=6&amp;filter=1&amp;sort=1">6</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=7&amp;filter=1&amp;sort=1">7</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=8&amp;filter=1&amp;sort=1">8</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=9&amp;filter=1&amp;sort=1">9</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=10&amp;filter=1&amp;sort=1">10</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2&amp;filter=1&amp;sort=1"><i class="bi bi-caret-right-fill"></i></a>', build_page_links(10, 1, 100, '/', true, true));
         $this->assertEquals('<a class="disabled_link"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M6%200l-4%204%204%204v-8z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&larr;" /></a>  <a class="current_page" href="?page=message_list&amp;list_path=%2F&amp;list_page=1&amp;keyword=cypht&amp;filter=1&amp;sort=1">1</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2&amp;keyword=cypht&amp;filter=1&amp;sort=1">2</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=3&amp;keyword=cypht&amp;filter=1&amp;sort=1">3</a> <a href="?page=message_list&amp;list_path=%2F&amp;list_page=2&amp;keyword=cypht&amp;filter=1&amp;sort=1"><img src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M2%200v8l4-4-4-4z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="&rarr;" /></a>', build_page_links(10, 1, 30, '/', true, true, "cypht"));
     }
 }
diff --git a/tests/phpunit/modules/core/modules.php b/tests/phpunit/modules/core/modules.php
index 871fc2a06c..cfaceeffd6 100644
--- a/tests/phpunit/modules/core/modules.php
+++ b/tests/phpunit/modules/core/modules.php
@@ -567,7 +567,7 @@ public function test_search_from_folder_list() {
         $test->run();
         $test->rtype = 'AJAX';
         $res = $test->run();
-        $this->assertEquals('<li class="menu_search"><form method="get"><a class="unread_link" href="?page=search"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M3.5%200c-1.927%200-3.5%201.573-3.5%203.5s1.573%203.5%203.5%203.5c.592%200%201.166-.145%201.656-.406a1%201%200%200%200%20.125.125l1%201a1.016%201.016%200%201%200%201.438-1.438l-1-1a1%201%200%200%200-.156-.125c.266-.493.438-1.059.438-1.656%200-1.927-1.573-3.5-3.5-3.5zm0%201c1.387%200%202.5%201.113%202.5%202.5%200%20.661-.241%201.273-.656%201.719l-.031.031a1%201%200%200%200-.125.125c-.442.397-1.043.625-1.688.625-1.387%200-2.5-1.113-2.5-2.5s1.113-2.5%202.5-2.5z%22%0A%20%20%2F%3E%0A%3C%2Fsvg%3E" alt="Search" width="16" height="16" /></a><input type="hidden" name="page" value="search" /><label class="screen_reader" for="search_terms">Search</label><input type="search" class="search_terms" name="search_terms" placeholder="Search" /></form></li>', $res->output_data['formatted_folder_list']);
+        $this->assertEquals('<li class="menu_search"><form method="get"><div class="d-flex align-items-center"><div class="ps-1 pe-2"><a class="unread_link" href="?page=search"><i class="bi bi-search"></i></a></div><div class=""><input type="hidden" name="page" value="search" /><input type="search" class="search_terms form-control form-control-sm" name="search_terms" placeholder="Search" /></div></form></div></li>', $res->output_data['formatted_folder_list']);
     }
     /**
      * @preserveGlobalState disabled
@@ -576,7 +576,7 @@ public function test_search_from_folder_list() {
     public function test_search_content_start() {
         $test = new Output_Test('search_content_start', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<div class="search_content"><div class="content_title"><a class="toggle_link" href="#"><img alt="x" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M6.406%201l-.719.688-2.781%202.781-.781-.781-.719-.688-1.406%201.406.688.719%201.5%201.5.719.688.719-.688%203.5-3.5.688-.719-1.406-1.406z%22%20%2F%3E%0A%3C%2Fsvg%3E" width="8" height="8" /></a><div class="msg_controls"><a class="msg_read core_msg_control" href="#" data-action="read">Read</a><a class="msg_unread core_msg_control" href="#" data-action="unread">Unread</a><a class="msg_flag core_msg_control" href="#" data-action="flag">Flag</a><a class="msg_unflag core_msg_control" href="#" data-action="unflag">Unflag</a><a class="msg_delete core_msg_control" href="#" data-action="delete">Delete</a><a class="msg_archive core_msg_control" href="#" data-action="archive">Archive</a></div>Search'), $res->output_response);
+        $this->assertEquals(array('<div class="search_content px-0"><div class="content_title px-3 d-flex align-items-center"><a class="toggle_link border px-1 m-0" href="#"><i class="bi bi-check"></i></a><div class="msg_controls fs-6 d-none gap-2"><a class="msg_read core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="read">Read</a><a class="msg_unread core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="unread">Unread</a><a class="msg_flag core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="flag">Flag</a><a class="msg_unflag core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="unflag">Unflag</a><a class="msg_delete core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="delete">Delete</a><a class="msg_archive core_msg_control btn btn-sm btn-light border text-black-50" href="#" data-action="archive">Archive</a></div>Search'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -609,7 +609,7 @@ public function test_save_reminder() {
     public function test_search_form_start() {
         $test = new Output_Test('search_form_start', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<div class="search_form"><form method="get">'), $res->output_response);
+        $this->assertEquals(array('<div class="search_form"><form class="d-flex align-items-center" method="get">'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -618,7 +618,7 @@ public function test_search_form_start() {
     public function test_search_form_content() {
         $test = new Output_Test('search_form_content', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<input type="hidden" name="page" value="search" /> <label class="screen_reader" for="search_terms">Search Terms</label><input required placeholder="Search Terms" id="search_terms" type="search" class="search_terms" name="search_terms" value="" /> <label class="screen_reader" for="search_fld">Search Field</label><select id="search_fld" name="search_fld"><option selected="selected" value="TEXT">Entire message</option><option value="BODY">Message body</option><option value="SUBJECT">Subject</option><option value="FROM">From</option><option value="TO">To</option><option value="CC">Cc</option></select> <label class="screen_reader" for="search_since">Search Since</label><select name="search_since" id="search_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select><select name="sort" class="combined_sort"><option value="4">Arrival Date &darr;</option><option value="-4">Arrival Date &uarr;</option><option value="2">From &darr;</option><option value="-2">From &uarr;</option><option value="3">Subject &darr;</option><option value="-3">Subject &uarr;</option></select> | <input type="submit" class="search_update" value="Update" /> <input type="button" class="search_reset" value="Reset" />'), $res->output_response);
+        $this->assertEquals(array('<input type="hidden" name="page" value="search" /> <label class="screen_reader" for="search_terms">Search Terms</label><input required placeholder="Search Terms" id="search_terms" type="search" class="search_terms form-control form-control-sm" name="search_terms" value="" /> <label class="screen_reader" for="search_fld">Search Field</label><select class="form-select form-select-sm w-auto" id="search_fld" name="search_fld"><option selected="selected" value="TEXT">Entire message</option><option value="BODY">Message body</option><option value="SUBJECT">Subject</option><option value="FROM">From</option><option value="TO">To</option><option value="CC">Cc</option></select> <label class="screen_reader" for="search_since">Search Since</label><select name="search_since" id="search_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select><select name="sort" style="width: 150px" class="combined_sort form-select form-select-sm"><option value="4">Arrival Date &darr;</option><option value="-4">Arrival Date &uarr;</option><option value="2">From &darr;</option><option value="-2">From &uarr;</option><option value="3">Subject &darr;</option><option value="-3">Subject &uarr;</option></select> | <input type="submit" class="search_update btn btn-success btn-sm" value="Update" /> <input type="button" class="search_reset btn btn-light border btn-sm" value="Reset" />'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -677,7 +677,7 @@ public function test_fancy_login_end() {
     public function test_login_start() {
         $test = new Output_Test('login_start', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<style type="text/css">.mobile .login_form{margin-top:60px;display:block;float:none;width:100%;background-color:#fff;font-size:130%;height:auto;}.logged_out{display:block !important;}.sys_messages{position:fixed;right:20px;top:15px;min-height:30px;display:none;background-color:#fff;color:teal;margin-top:0px;padding:15px;padding-bottom:5px;white-space:nowrap;border:solid 1px #999;border-radius:5px;filter:drop-shadow(4px 4px 4px #ccc);z-index:101;}.g-recaptcha{margin-left:-12px;}.mobile .g-recaptcha{clear:left;margin-left:20px;}.title{font-weight:normal;padding:0px;margin:0px;margin-left:20px;margin-bottom:20px;letter-spacing:-1px;color:#999;}html,body{max-width:100%;min-height:100%;background-color:#fff;}body{background:linear-gradient(180deg,#faf6f5,#faf6f5,#faf6f5,#faf6f5,#fff);font-size:1em;height:100%;color:#333;font-family:Arial;padding:0px;margin:0px;min-width:700px;font-size:100%;}input,option,select{font-size:100%;padding:3px;}textarea,select,input{border:outset 1px #ddd;background-color:#fff;color:#333;border-radius:6px;}.screen_reader{position:absolute;top:auto;width:1px;height:1px;overflow:hidden;}.login_form{float:left;font-size:90%;padding-top:60px;height:300px;border-radius:0px 0px 20px 0px;margin:0px;background-color:#f5f5f5;width:300px;padding-left:20px;}.login_form input{clear:both;float:left;padding:4px;margin-left:20px;margin-top:10px;margin-bottom:10px;}#username,#password{width:200px;}.err{color:red !important;}.long_session{float:left;}.long_session input{padding:0px;float:none;}.mobile .long_session{float:left;clear:both;}</style><form class="login_form" method="POST">'), $res->output_response);
+        $this->assertEquals(array('<form class="login_form" method="POST">'), $res->output_response);
         $test->handler_response = array('router_login_state' => true);
         $res = $test->run();
         $this->assertEquals(array('<form class="logout_form" method="POST">'), $res->output_response);
@@ -765,7 +765,7 @@ public function test_msgs() {
         $test = new Output_Test('msgs', 'core');
         $test->handler_response = array('router_login_state' => false);
         $res = $test->run();
-        $this->assertEquals(array('<div class="sys_messages logged_out"><span class="err">foo</span>,foo</div>'), $res->output_response);
+        $this->assertEquals(array('<div class="z-3 position-fixed top-0 end-0 mt-3 me-3 sys_messages logged_out"><div class="alert alert-danger alert-dismissible fade show" role="alert"><i class="bi bi-exclamation-triangle me-2"></i><span class="err">foo</span>,<div class="alert alert-info alert-dismissible fade show" role="alert"><i class="bi bi-info-circle me-2"></i><span>foo</span><button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button></div></div>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -774,7 +774,7 @@ public function test_msgs() {
     public function test_header_start() {
         $test = new Output_Test('header_start', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<!DOCTYPE html><html dir="ltr" class="ltr_page" lang=en><head><meta name="apple-mobile-web-app-capable" content="yes" /><meta name="mobile-web-app-capable" content="yes" /><meta name="apple-mobile-web-app-status-bar-style" content="black" /><meta name="theme-color" content="#888888" /><meta charset="utf-8" />'), $res->output_response);
+        $this->assertEquals(array('<!DOCTYPE html><html dir="ltr" class="ltr_page" lang=en><head><meta name="apple-mobile-web-app-capable" content="yes" /><meta name="mobile-web-app-capable" content="yes" /><meta name="apple-mobile-web-app-status-bar-style" content="black" /><meta name="theme-color" content="#888888" /><meta charset="utf-8" /><link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" /><link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" /><script src="vendor/twbs/bootstrap/dist/js/bootstrap.bundle.min.js"></script>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -828,7 +828,7 @@ public function test_header_content() {
     public function test_header_css() {
         $test = new Output_Test('header_css', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<link href="site.css?v=asdf" media="all" rel="stylesheet" type="text/css" /><style type="text/css">@font-face {font-family:"Behdad";src:url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff2") format("woff2"),url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff") format("woff");</style>'), $res->output_response);
+        $this->assertEquals(array('<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" /><link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" /><link href="site.css?v=asdf" media="all" rel="stylesheet" type="text/css" /><style type="text/css">@font-face {font-family:"Behdad";src:url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff2") format("woff2"),url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff") format("woff");</style>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -839,7 +839,7 @@ public function test_header_css_integrity() {
         $test = new Output_Test('header_css', 'core');
         $test->handler_response = array('router_module_list', array('core'));
         $res = $test->run();
-        $this->assertEquals(array('<link href="site.css?v=asdf" integrity="foo" media="all" rel="stylesheet" type="text/css" /><style type="text/css">@font-face {font-family:"Behdad";src:url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff2") format("woff2"),url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff") format("woff");</style>'), $res->output_response);
+        $this->assertEquals(array('<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" /><link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" /><link href="site.css?v=asdf" integrity="foo" media="all" rel="stylesheet" type="text/css" /><style type="text/css">@font-face {font-family:"Behdad";src:url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff2") format("woff2"),url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff") format("woff");</style>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -898,7 +898,7 @@ public function test_loading_icon() {
     public function test_start_settings_form() {
         $test = new Output_Test('start_settings_form', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<div class="user_settings"><div class="content_title">Site Settings</div><form method="POST"><input type="hidden" name="hm_page_key" value="" /><table class="settings_table"><colgroup><col class="label_col"><col class="setting_col"></colgroup>'), $res->output_response);
+        $this->assertEquals(array('<div class="user_settings px-0"><div class="content_title px-3">Site Settings</div><form method="POST"><input type="hidden" name="hm_page_key" value="" /><div class="px-3"><table class="settings_table table table-borderless"><colgroup><col class="label_col"><col class="setting_col"></colgroup>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -907,10 +907,10 @@ public function test_start_settings_form() {
     public function test_start_page_setting() {
         $test = new Output_Test('start_page_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="start_page">First page after login</label></td><td><select id="start_page" name="start_page"><option value="none">None</option><option value="page=home">Home</option><option value="page=message_list&list_path=combined_inbox">Everything</option><option value="page=message_list&list_path=unread">Unread</option><option value="page=message_list&list_path=flagged">Flagged</option><option value="page=compose">Compose</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label for="start_page">First page after login</label></td><td><select class="form-select form-select-sm w-auto" id="start_page" name="start_page"><option value="none">None</option><option value="page=home">Home</option><option value="page=message_list&list_path=combined_inbox">Everything</option><option value="page=message_list&list_path=unread">Unread</option><option value="page=message_list&list_path=flagged">Flagged</option><option value="page=compose">Compose</option></select></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('start_page' => 'page=message_list&list_path=unread'));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="start_page">First page after login</label></td><td><select id="start_page" name="start_page"><option value="none">None</option><option value="page=home">Home</option><option value="page=message_list&list_path=combined_inbox">Everything</option><option selected="selected" value="page=message_list&list_path=unread">Unread</option><option value="page=message_list&list_path=flagged">Flagged</option><option value="page=compose">Compose</option></select><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_select"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label for="start_page">First page after login</label></td><td><select class="form-select form-select-sm w-auto" id="start_page" name="start_page"><option value="none">None</option><option value="page=home">Home</option><option value="page=message_list&list_path=combined_inbox">Everything</option><option selected="selected" value="page=message_list&list_path=unread">Unread</option><option value="page=message_list&list_path=flagged">Flagged</option><option value="page=compose">Compose</option></select><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_select"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -919,10 +919,10 @@ public function test_start_page_setting() {
     public function test_list_style_setting() {
         $test = new Output_Test('list_style_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="list_style">Message list style</label></td><td><select id="list_style" name="list_style"><option value="email_style">Email</option><option value="news_style">News</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label for="list_style">Message list style</label></td><td><select class="form-select form-select-sm w-auto" id="list_style" name="list_style"><option value="email_style">Email</option><option value="news_style">News</option></select></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('list_style' => 'email_style'));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="list_style">Message list style</label></td><td><select id="list_style" name="list_style"><option selected="selected" value="email_style">Email</option><option value="news_style">News</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label for="list_style">Message list style</label></td><td><select class="form-select form-select-sm w-auto" id="list_style" name="list_style"><option selected="selected" value="email_style">Email</option><option value="news_style">News</option></select></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -932,10 +932,10 @@ public function test_mailto_handler_setting() {
         $test = new Output_Test('mailto_handler_setting', 'core');
         $test->handler_response = array('user_settings' => array());
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="mailto_handler">Allow handling of mailto links</label></td><td><input type="checkbox"  value="1" id="mailto_handler" name="mailto_handler" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="mailto_handler">Allow handling of mailto links</label></td><td><input class="form-check-input" type="checkbox"  value="1" id="mailto_handler" name="mailto_handler" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('mailto_handler' => true));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="mailto_handler">Allow handling of mailto links</label></td><td><input type="checkbox"  checked="checked" value="1" id="mailto_handler" name="mailto_handler" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="mailto_handler">Allow handling of mailto links</label></td><td><input class="form-check-input" type="checkbox"  checked="checked" value="1" id="mailto_handler" name="mailto_handler" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -945,10 +945,10 @@ public function test_no_folder_icon_setting() {
         $test = new Output_Test('no_folder_icon_setting', 'core');
         $test->handler_response = array('user_settings' => array());
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="no_folder_icons">Hide folder list icons</label></td><td><input type="checkbox"  value="1" id="no_folder_icons" name="no_folder_icons" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="no_folder_icons">Hide folder list icons</label></td><td><input class="form-check-input" type="checkbox"  value="1" id="no_folder_icons" name="no_folder_icons" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('no_folder_icons' => true));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="no_folder_icons">Hide folder list icons</label></td><td><input type="checkbox"  checked="checked" value="1" id="no_folder_icons" name="no_folder_icons" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="no_folder_icons">Hide folder list icons</label></td><td><input class="form-check-input" type="checkbox"  checked="checked" value="1" id="no_folder_icons" name="no_folder_icons" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -958,10 +958,10 @@ public function test_no_password_setting() {
         $test = new Output_Test('no_password_setting', 'core');
         $test->handler_response = array('user_settings' => array());
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="no_password_save">Don\'t save account passwords between logins</label></td><td><input type="checkbox"  value="1" id="no_password_save" name="no_password_save" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="no_password_save">Don\'t save account passwords between logins</label></td><td><input class="form-check-input" type="checkbox"  value="1" id="no_password_save" name="no_password_save" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('no_password_save' => true));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="no_password_save">Don\'t save account passwords between logins</label></td><td><input type="checkbox"  checked="checked" value="1" id="no_password_save" name="no_password_save" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="no_password_save">Don\'t save account passwords between logins</label></td><td><input class="form-check-input" type="checkbox"  value="1" id="no_password_save" name="no_password_save" /></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -971,10 +971,10 @@ public function test_delete_prompt_setting() {
         $test = new Output_Test('delete_prompt_setting', 'core');
         $test->handler_response = array('user_settings' => array());
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="disable_delete_prompt">Disable prompts when deleting</label></td><td><input type="checkbox"  value="1" id="disable_delete_prompt" name="disable_delete_prompt" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="disable_delete_prompt">Disable prompts when deleting</label></td><td><input class="form-check-input" type="checkbox"  value="1" id="disable_delete_prompt" name="disable_delete_prompt" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('disable_delete_prompt' => true));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="disable_delete_prompt">Disable prompts when deleting</label></td><td><input type="checkbox"  checked="checked" value="1" id="disable_delete_prompt" name="disable_delete_prompt" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="disable_delete_prompt">Disable prompts when deleting</label></td><td><input class="form-check-input" type="checkbox"  checked="checked" value="1" id="disable_delete_prompt" name="disable_delete_prompt" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -983,7 +983,7 @@ public function test_delete_prompt_setting() {
     public function test_start_flagged_settings() {
         $test = new Output_Test('start_flagged_settings', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr><td data-target=".flagged_setting" colspan="2" class="settings_subtitle"><img alt="" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%200v8h1v-8h-1zm2%200v4h2v1h4l-2-1.969%202-2.031h-3v-1h-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" width="16" height="16" />Flagged</td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr><td data-target=".flagged_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary"><i class="bi bi-flag-fill fs-5 me-2"></i>Flagged</td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -992,7 +992,7 @@ public function test_start_flagged_settings() {
     public function test_start_everything_settings() {
         $test = new Output_Test('start_everything_settings', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr><td data-target=".all_setting" colspan="2" class="settings_subtitle"><img alt="" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%200v1h8v-1h-8zm0%202v5.906c0%20.06.034.094.094.094h7.813c.06%200%20.094-.034.094-.094v-5.906h-2.969v1.031h-2.031v-1.031h-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" width="16" height="16" />Everything</td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr><td data-target=".all_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary"><i class="bi bi-box2-fill fs-5 me-2"></i>Everything</td></tr>'), $res->output_response);
         $test->handler_response = array('single_server_mode' => true);
         $res = $test->run();
         $this->assertEquals(array('single_server_mode' => true), $res->output_response);
@@ -1004,7 +1004,7 @@ public function test_start_everything_settings() {
     public function test_start_junk_settings() {
         $test = new Output_Test('start_junk_settings', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr><td data-target=".junk_setting" colspan="2" class="settings_subtitle"><img alt="" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%3E%0A%20%20%3Cpath%20d%3D%22M1%204L1%205.5820312L11%2012L21%205.5820312L21%204L1%204%20z%20M%201%207.7519531L1%2010.552734L1%2020L12.421875%2020L14%2020L14.757812%2020L15.757812%2019L13.636719%2016.878906L17.878906%2012.636719L20%2014.757812L21%2013.757812L21%2013L21%209.1953125L21%207.7519531L11%2014L1%207.7519531%20z%20M%2017.878906%2015.464844L16.464844%2016.878906L18.585938%2019L16.464844%2021.121094L17.878906%2022.535156L20%2020.414062L22.121094%2022.535156L23.535156%2021.121094L21.414062%2019L23.535156%2016.878906L22.121094%2015.464844L20%2017.585938L17.878906%2015.464844%20z%22%20%2F%3E%0A%3C%2Fsvg%3E" width="16" height="16" />Junk</td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr><td data-target=".junk_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary"><i class="bi bi-envelope-x-fill fs-5 me-2"></i>Junk</td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1013,7 +1013,7 @@ public function test_start_junk_settings() {
     public function test_start_unread_settings() {
         $test = new Output_Test('start_unread_settings', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr><td data-target=".unread_setting" colspan="2" class="settings_subtitle"><img alt="" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%201v1l4%202%204-2v-1h-8zm0%202v4h8v-4l-4%202-4-2z%22%20%2F%3E%0A%3C%2Fsvg%3E" width="16" height="16" />Unread</td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr><td data-target=".unread_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary"><i class="bi bi-envelope-fill fs-5 me-2"></i>Unread</td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1026,7 +1026,7 @@ public function test_start_all_email_settings() {
         $this->assertEquals(array('router_module_list' => array()), $res->output_response);
         $test->handler_response = array('router_module_list' => array('imap'));
         $res = $test->run();
-        $this->assertEquals(array('<tr><td data-target=".email_setting" colspan="2" class="settings_subtitle"><img alt="" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%201v1l4%202%204-2v-1h-8zm0%202v4h8v-4l-4%202-4-2z%22%20%2F%3E%0A%3C%2Fsvg%3E" width="16" height="16" />All Email</td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr><td data-target=".email_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary"><i class="bi bi-envelope-fill fs-5 me-2"></i>All Email</td></tr>'), $res->output_response);
         $test->handler_response = array('router_module_list' => array('imap'), 'single_server_mode' => true);
         $res = $test->run();
         $this->assertEquals(array('router_module_list' => array('imap'), 'single_server_mode' => true), $res->output_response);
@@ -1038,7 +1038,7 @@ public function test_start_all_email_settings() {
     public function test_start_general_settings() {
         $test = new Output_Test('start_general_settings', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr><td data-target=".general_setting" colspan="2" class="settings_subtitle"><img alt="" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M3.5%200l-.5%201.188-.281.125-1.188-.5-.719.719.5%201.188-.125.281-1.188.5v1l1.188.5.125.313-.5%201.156.719.719%201.188-.5.281.125.5%201.188h1l.5-1.188.281-.125%201.188.5.719-.719-.5-1.188.125-.281%201.188-.5v-1l-1.188-.5-.125-.281.469-1.188-.688-.719-1.188.5-.281-.125-.5-1.188h-1zm.5%202.5c.83%200%201.5.67%201.5%201.5s-.67%201.5-1.5%201.5-1.5-.67-1.5-1.5.67-1.5%201.5-1.5z%22%0A%20%20%2F%3E%0A%3C%2Fsvg%3E" width="16" height="16" />General</td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr><td data-target=".general_setting" colspan="2" class="settings_subtitle cursor-pointer border-bottom p-2 text-secondary"><i class="bi bi-gear-wide-connected fs-5 me-2"></i>General</td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1047,10 +1047,10 @@ public function test_start_general_settings() {
     public function test_unread_source_max_setting() {
         $test = new Output_Test('unread_source_max_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_per_source">Max messages per source</label></td><td><input type="text" size="2" id="unread_per_source" name="unread_per_source" value="20" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_per_source">Max messages per source</label></td><td><input class="form-control form-control-sm w-auto" type="text" size="2" id="unread_per_source" name="unread_per_source" value="20" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('unread_per_source' => 10));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_per_source">Max messages per source</label></td><td><input type="text" size="2" id="unread_per_source" name="unread_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_per_source">Max messages per source</label></td><td><input class="form-control form-control-sm w-auto" type="text" size="2" id="unread_per_source" name="unread_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1059,10 +1059,10 @@ public function test_unread_source_max_setting() {
     public function test_unread_since_setting() {
         $test = new Output_Test('unread_since_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_since">Show messages received since</label></td><td><select name="unread_since" id="unread_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_since">Show messages received since</label></td><td><select name="unread_since" id="unread_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('unread_since' => '-1 week'));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_since">Show messages received since</label></td><td><select name="unread_since" id="unread_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="unread_setting"><td><label for="unread_since">Show messages received since</label></td><td><select name="unread_since" id="unread_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1071,10 +1071,10 @@ public function test_unread_since_setting() {
     public function test_flagged_source_max_setting() {
         $test = new Output_Test('flagged_source_max_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_per_source">Max messages per source</label></td><td><input type="text" size="2" id="flagged_per_source" name="flagged_per_source" value="20" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_per_source">Max messages per source</label></td><td><input class="form-control form-control-sm w-auto" type="text" size="2" id="flagged_per_source" name="flagged_per_source" value="20" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('flagged_per_source' => 10));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_per_source">Max messages per source</label></td><td><input type="text" size="2" id="flagged_per_source" name="flagged_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_per_source">Max messages per source</label></td><td><input class="form-control form-control-sm w-auto" type="text" size="2" id="flagged_per_source" name="flagged_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1083,10 +1083,10 @@ public function test_flagged_source_max_setting() {
     public function test_flagged_since_setting() {
         $test = new Output_Test('flagged_since_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_since">Show messages received since</label></td><td><select name="flagged_since" id="flagged_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_since">Show messages received since</label></td><td><select name="flagged_since" id="flagged_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('flagged_since' => '-1 week'));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_since">Show messages received since</label></td><td><select name="flagged_since" id="flagged_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="flagged_setting"><td><label for="flagged_since">Show messages received since</label></td><td><select name="flagged_since" id="flagged_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1099,7 +1099,7 @@ public function test_all_email_source_max_setting() {
         $this->assertEquals(array('user_settings' => array('all_email_per_source' => 10), 'router_module_list' => array()), $res->output_response);
         $test->handler_response = array('user_settings' => array('all_email_per_source' => 10), 'router_module_list' => array('imap'));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="email_setting"><td><label for="all_email_per_source">Max messages per source</label></td><td><input type="text" size="2" id="all_email_per_source" name="all_email_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="email_setting"><td><label for="all_email_per_source">Max messages per source</label></td><td><input class="form-control form-control-sm w-auto" type="text" size="2" id="all_email_per_source" name="all_email_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1108,10 +1108,10 @@ public function test_all_email_source_max_setting() {
     public function test_all_source_max_setting() {
         $test = new Output_Test('all_source_max_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_per_source">Max messages per source</label></td><td><input type="text" size="2" id="all_per_source" name="all_per_source" value="20" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_per_source">Max messages per source</label></td><td><input class="form-control form-control-sm w-auto" type="text" size="2" id="all_per_source" name="all_per_source" value="20" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('all_per_source' => 10));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_per_source">Max messages per source</label></td><td><input type="text" size="2" id="all_per_source" name="all_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_per_source">Max messages per source</label></td><td><input class="form-control form-control-sm w-auto" type="text" size="2" id="all_per_source" name="all_per_source" value="10" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_input" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1124,7 +1124,7 @@ public function test_all_email_since_setting() {
         $this->assertEquals(array('user_settings' => array('all_email_since' => '-1 week'), 'router_module_list' => array()), $res->output_response);
         $test->handler_response = array('user_settings' => array('all_email_since' => '-1 week'), 'router_module_list' => array('imap'));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="email_setting"><td><label for="all_email_since">Show messages received since</label></td><td><select name="all_email_since" id="all_email_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="email_setting"><td><label for="all_email_since">Show messages received since</label></td><td><select name="all_email_since" id="all_email_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1133,10 +1133,10 @@ public function test_all_email_since_setting() {
     public function test_all_since_setting() {
         $test = new Output_Test('all_since_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_since">Show messages received since</label></td><td><select name="all_since" id="all_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_since">Show messages received since</label></td><td><select name="all_since" id="all_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('all_since' => '-1 week'));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_since">Show messages received since</label></td><td><select name="all_since" id="all_since" class="message_list_since"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="all_setting"><td><label for="all_since">Show messages received since</label></td><td><select name="all_since" id="all_since" class="message_list_since form-select form-select-sm w-auto"><option value="today">Today</option><option selected="selected" value="-1 week">Last 7 days</option><option value="-2 weeks">Last 2 weeks</option><option value="-4 weeks">Last 4 weeks</option><option value="-6 weeks">Last 6 weeks</option><option value="-6 months">Last 6 months</option><option value="-1 year">Last year</option><option value="-5 years">Last 5 years</option></select></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1146,7 +1146,7 @@ public function test_language_setting() {
         $test = new Output_Test('language_setting', 'core');
         $test->handler_response = array('language'=> 'en');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="language">Language</label></td><td><select id="language" name="language"><option value="az">Azerbaijani</option><option value="pt-BR">Brazilian Portuguese</option><option value="zh-Hans">Chinese Simplified</option><option value="nl">Dutch</option><option selected="selected" value="en">English</option><option value="et">Estonian</option><option value="fa">Farsi</option><option value="fr">French</option><option value="de">German</option><option value="hu">Hungarian</option><option value="id">Indonesian</option><option value="it">Italian</option><option value="ja">Japanese</option><option value="ro">Romanian</option><option value="ru">Russian</option><option value="es">Spanish</option></select></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label for="language">Language</label></td><td><select id="language" class="form-select form-select-sm w-auto" name="language"><option value="az">Azerbaijani</option><option value="pt-BR">Brazilian Portuguese</option><option value="zh-Hans">Chinese Simplified</option><option value="nl">Dutch</option><option selected="selected" value="en">English</option><option value="et">Estonian</option><option value="fa">Farsi</option><option value="fr">French</option><option value="de">German</option><option value="hu">Hungarian</option><option value="id">Indonesian</option><option value="it">Italian</option><option value="ja">Japanese</option><option value="ro">Romanian</option><option value="ru">Russian</option><option value="es">Spanish</option></select></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1167,10 +1167,10 @@ public function test_timezone_setting() {
     public function test_msg_list_icons_setting() {
         $test = new Output_Test('msg_list_icons_setting', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="show_list_icons">Show icons in message lists</label></td><td><input type="checkbox"  id="show_list_icons" name="show_list_icons" value="1" /></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="show_list_icons">Show icons in message lists</label></td><td><input class="form-check-input" type="checkbox"  id="show_list_icons" name="show_list_icons" value="1" /></td></tr>'), $res->output_response);
         $test->handler_response = array('user_settings' => array('show_list_icons' => true));
         $res = $test->run();
-        $this->assertEquals(array('<tr class="general_setting"><td><label for="show_list_icons">Show icons in message lists</label></td><td><input type="checkbox"  checked="checked" id="show_list_icons" name="show_list_icons" value="1" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
+        $this->assertEquals(array('<tr class="general_setting"><td><label class="form-check-label" for="show_list_icons">Show icons in message lists</label></td><td><input class="form-check-input" type="checkbox"  checked="checked" id="show_list_icons" name="show_list_icons" value="1" /><span class="tooltip_restore" restore_aria_label="Restore default value"><img alt="Refresh" class="refresh_list reset_default_value_checkbox"  src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.201%200-4%201.799-4%204s1.799%204%204%204c1.104%200%202.092-.456%202.813-1.188l-.688-.688c-.54.548-1.289.875-2.125.875-1.659%200-3-1.341-3-3s1.341-3%203-3c.834%200%201.545.354%202.094.906l-1.094%201.094h3v-3l-1.188%201.188c-.731-.72-1.719-1.188-2.813-1.188z%22%20%2F%3E%0A%3C%2Fsvg%3E" /></span></td></tr>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1179,10 +1179,10 @@ public function test_msg_list_icons_setting() {
     public function test_end_settings_form() {
         $test = new Output_Test('end_settings_form', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<tr><td class="submit_cell" colspan="2"><input class="save_settings" type="submit" name="save_settings" value="Save" /></td></tr></table></form><form method="POST"><input type="hidden" name="hm_page_key" value="" /><input class="reset_factory_button" type="submit" name="reset_factory" value="Restore Defaults" /></form></div>'), $res->output_response);
+        $this->assertEquals(array('<tr><td class="submit_cell" colspan="2"><input class="save_settings btn btn-success" type="submit" name="save_settings" value="Save" /></td></tr></table></div></form><div class="px-3 d-flex justify-content-end"><form method="POST"><input type="hidden" name="hm_page_key" value="" /><input class="reset_factory_button btn btn-light border" type="submit" name="reset_factory" value="Restore Defaults" /></form></div></div>'), $res->output_response);
         $test->handler_response = array('single_server_mode' => true);
         $res = $test->run();
-        $this->assertEquals(array('<tr><td class="submit_cell" colspan="2"><input class="save_settings" type="submit" name="save_settings" value="Save" /></td></tr></table></form><form method="POST"><input type="hidden" name="hm_page_key" value="" /><input class="reset_factory_button" type="submit" name="reset_factory" value="Restore Defaults" /></form></div>'), $res->output_response);
+        $this->assertEquals(array('<tr><td class="submit_cell" colspan="2"><input class="save_settings btn btn-success" type="submit" name="save_settings" value="Save" /></td></tr></table></div></form><div class="px-3 d-flex justify-content-end"><form method="POST"><input type="hidden" name="hm_page_key" value="" /><input class="reset_factory_button btn btn-light border" type="submit" name="reset_factory" value="Restore Defaults" /></form></div></div>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1225,10 +1225,10 @@ public function test_main_menu_content() {
         $test = new Output_Test('main_menu_content', 'core');
         $test->handler_response = array('folder_sources' => array(array('email_folders', 'baz')));
         $res = $test->run();
-        $this->assertEquals(array('<li class="menu_combined_inbox"><a class="unread_link" href="?page=message_list&amp;list_path=combined_inbox"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%200v1h8v-1h-8zm0%202v5.906c0%20.06.034.094.094.094h7.813c.06%200%20.094-.034.094-.094v-5.906h-2.969v1.031h-2.031v-1.031h-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Everything</a><span class="combined_inbox_count"></span></li><li class="menu_unread"><a class="unread_link" href="?page=message_list&amp;list_path=unread"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%201v1l4%202%204-2v-1h-8zm0%202v4h8v-4l-4%202-4-2z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Unread</a><span class="total_unread_count"></span></li><li class="menu_flagged"><a class="unread_link" href="?page=message_list&amp;list_path=flagged"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%200v8h1v-8h-1zm2%200v4h2v1h4l-2-1.969%202-2.031h-3v-1h-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Flagged</a> <span class="flagged_count"></span></li><li class="menu_junk"><a class="unread_link" href="?page=message_list&amp;list_path=junk"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%3E%0A%20%20%3Cpath%20d%3D%22M1%204L1%205.5820312L11%2012L21%205.5820312L21%204L1%204%20z%20M%201%207.7519531L1%2010.552734L1%2020L12.421875%2020L14%2020L14.757812%2020L15.757812%2019L13.636719%2016.878906L17.878906%2012.636719L20%2014.757812L21%2013.757812L21%2013L21%209.1953125L21%207.7519531L11%2014L1%207.7519531%20z%20M%2017.878906%2015.464844L16.464844%2016.878906L18.585938%2019L16.464844%2021.121094L17.878906%2022.535156L20%2020.414062L22.121094%2022.535156L23.535156%2021.121094L21.414062%2019L23.535156%2016.878906L22.121094%2015.464844L20%2017.585938L17.878906%2015.464844%20z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Junk</a></li><li class="menu_trash"><a class="unread_link" href="?page=message_list&amp;list_path=trash"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2028%2028%22%3E%0A%20%20%3Cpath%20d%3D%22M6%208v16c0%201.1.9%202%202%202h14c1.1%200%202-.9%202-2V8H6zM24%204h-6c0-.6-.4-1-1-1h-4c-.6%200-1%20.4-1%201H6C5.4%204%205%204.4%205%205s.4%201%201%201h18c.6%200%201-.4%201-1S24.6%204%2024%204z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Trash</a></li><li class="menu_drafts"><a class="unread_link" href="?page=message_list&amp;list_path=drafts"><img class="account_icon" src="data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%0A%3C%21--%20Uploaded%20to%3A%20SVG%20Repo%2C%20www.svgrepo.com%2C%20Generator%3A%20SVG%20Repo%20Mixer%20Tools%20--%3E%0A%3C%21DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%0A%3Csvg%20fill%3D%22%23000000%22%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20%0A%09%20width%3D%22800px%22%20height%3D%22800px%22%20viewBox%3D%220%200%2031.854%2031.854%22%0A%09%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cg%3E%0A%09%3Cpath%20d%3D%22M15.94%2C11.735c0%2C0.588-0.476%2C1.064-1.065%2C1.064H5.298c-0.588%2C0-1.065-0.476-1.065-1.064c0-0.587%2C0.477-1.063%2C1.065-1.063%0A%09%09h9.577C15.465%2C10.672%2C15.94%2C11.148%2C15.94%2C11.735z%20M21.52%2C11.087l5.342%2C4.791L15.535%2C28.505l-5.34-4.791L21.52%2C11.087z%0A%09%09%20M20.008%2C16.188l-0.033-0.029c-0.127-0.114-0.293-0.172-0.461-0.163c-0.168%2C0.009-0.328%2C0.085-0.439%2C0.211l-6.079%2C6.776%0A%09%09c-0.253%2C0.281-0.229%2C0.713%2C0.052%2C0.965c0.126%2C0.115%2C0.291%2C0.174%2C0.461%2C0.164c0.168-0.01%2C0.327-0.086%2C0.44-0.213l6.108-6.81%0A%09%09C20.293%2C16.828%2C20.27%2C16.423%2C20.008%2C16.188z%20M21.27%2C13.751l-0.301%2C0.336c-0.111%2C0.126-0.17%2C0.292-0.162%2C0.461%0A%09%09c0.01%2C0.169%2C0.086%2C0.328%2C0.211%2C0.441l0.035%2C0.031c0.127%2C0.113%2C0.293%2C0.171%2C0.461%2C0.162c0.17-0.009%2C0.328-0.085%2C0.44-0.211%0A%09%09l0.728-0.811l-0.51-0.457C21.91%2C13.467%2C21.506%2C13.489%2C21.27%2C13.751z%20M22.035%2C10.51l5.341%2C4.791l1.312-1.462l-5.34-4.791%0A%09%09L22.035%2C10.51z%20M31.047%2C11.21l-1.877%2C2.093l-5.341-4.79l1.88-2.093c0.247-0.28%2C0.6-0.448%2C0.975-0.468%0A%09%09c0.375-0.021%2C0.742%2C0.109%2C1.021%2C0.359l3.234%2C2.903C31.52%2C9.735%2C31.569%2C10.629%2C31.047%2C11.21z%20M29.996%2C10.264l-3.233-2.902%0A%09%09l-0.937%2C1.042l3.233%2C2.903L29.996%2C10.264z%20M9.557%2C24.428l5.339%2C4.791l-6.31%2C2.586c-0.243%2C0.098-0.521%2C0.051-0.716-0.125%0A%09%09c-0.196-0.177-0.273-0.447-0.201-0.699L9.557%2C24.428z%20M10.045%2C26.13l-0.722%2C2.507l1.411%2C1.268l2.412-0.986L10.045%2C26.13z%0A%09%09%20M8.215%2C24.285l-0.623%2C2.162H2.859c-1.332%2C0-2.413-1.08-2.413-2.412V6.493c0-1.332%2C1.08-2.413%2C2.413-2.413h2.94V3.906%0A%09%09c0-0.492%2C0.399-0.89%2C0.89-0.89h0.74C7.414%2C2.909%2C7.406%2C2.781%2C7.406%2C2.661C7.406%2C1.194%2C8.599%2C0%2C10.067%2C0%0A%09%09c1.469%2C0%2C2.661%2C1.194%2C2.661%2C2.661c0%2C0.12-0.01%2C0.248-0.023%2C0.354h0.749c0.492%2C0%2C0.89%2C0.399%2C0.89%2C0.89v0.174h2.87%0A%09%09c1.332%2C0%2C2.412%2C1.081%2C2.412%2C2.413v4.63l-2.128%2C2.372V7.506c0-0.699-0.565-1.265-1.264-1.265h-1.891v1.201%0A%09%09c0%2C0.491-0.399%2C0.89-0.89%2C0.89H6.69c-0.492%2C0-0.89-0.399-0.89-0.89V6.241H3.874c-0.699%2C0-1.265%2C0.567-1.265%2C1.265V23.02%0A%09%09c0%2C0.701%2C0.567%2C1.266%2C1.265%2C1.266H8.215z%20M9.003%2C2.661c0%2C0.124%2C0.023%2C0.248%2C0.061%2C0.355h2.005c0.04-0.107%2C0.062-0.23%2C0.062-0.355%0A%09%09c0-0.587-0.477-1.065-1.064-1.065C9.479%2C1.596%2C9.003%2C2.074%2C9.003%2C2.661z%20M14.949%2C16.341l0.991-1.105%0A%09%09c-0.014-0.576-0.484-1.054-1.064-1.054H5.298c-0.588%2C0-1.065%2C0.493-1.065%2C1.082c0%2C0.587%2C0.477%2C1.082%2C1.065%2C1.082h9.577%0A%09%09C14.9%2C16.344%2C14.925%2C16.342%2C14.949%2C16.341z%20M4.233%2C18.791c0%2C0.588%2C0.477%2C1.062%2C1.065%2C1.062H11.8l1.907-2.127H5.298%0A%09%09C4.71%2C17.727%2C4.233%2C18.203%2C4.233%2C18.791z%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Drafts</a></li>'), $res->output_response);
+        $this->assertEquals(array('<li class="menu_combined_inbox"><a class="unread_link" href="?page=message_list&amp;list_path=combined_inbox"><i class="bi bi-box2-fill fs-5 me-2"></i>Everything</a><span class="combined_inbox_count"></span></li><li class="menu_unread d-flex align-items-center"><a class="unread_link d-flex align-items-center" href="?page=message_list&amp;list_path=unread"><i class="bi bi-envelope-fill fs-5 me-2"></i>Unread</a><span class="total_unread_count badge bg-secondary ms-2 px-1"></span></li><li class="menu_flagged"><a class="unread_link" href="?page=message_list&amp;list_path=flagged"><i class="bi bi-flag-fill fs-5 me-2"></i>Flagged</a> <span class="flagged_count"></span></li><li class="menu_junk"><a class="unread_link" href="?page=message_list&amp;list_path=junk"><i class="bi bi-envelope-x-fill fs-5 me-2"></i>Junk</a></li><li class="menu_trash"><a class="unread_link" href="?page=message_list&amp;list_path=trash"><i class="bi bi-trash3-fill fs-5 me-2"></i>Trash</a></li><li class="menu_drafts"><a class="unread_link" href="?page=message_list&amp;list_path=drafts"><i class="bi bi-pencil-square fs-5 me-2"></i>Drafts</a></li>'), $res->output_response);
         $test->rtype = 'AJAX';
         $res = $test->run();
-        $this->assertEquals(array('folder_sources' => array(array('email_folders', 'baz')), 'formatted_folder_list' => '<li class="menu_combined_inbox"><a class="unread_link" href="?page=message_list&amp;list_path=combined_inbox"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%200v1h8v-1h-8zm0%202v5.906c0%20.06.034.094.094.094h7.813c.06%200%20.094-.034.094-.094v-5.906h-2.969v1.031h-2.031v-1.031h-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Everything</a><span class="combined_inbox_count"></span></li><li class="menu_unread"><a class="unread_link" href="?page=message_list&amp;list_path=unread"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%201v1l4%202%204-2v-1h-8zm0%202v4h8v-4l-4%202-4-2z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Unread</a><span class="total_unread_count"></span></li><li class="menu_flagged"><a class="unread_link" href="?page=message_list&amp;list_path=flagged"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M0%200v8h1v-8h-1zm2%200v4h2v1h4l-2-1.969%202-2.031h-3v-1h-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Flagged</a> <span class="flagged_count"></span></li><li class="menu_junk"><a class="unread_link" href="?page=message_list&amp;list_path=junk"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%3E%0A%20%20%3Cpath%20d%3D%22M1%204L1%205.5820312L11%2012L21%205.5820312L21%204L1%204%20z%20M%201%207.7519531L1%2010.552734L1%2020L12.421875%2020L14%2020L14.757812%2020L15.757812%2019L13.636719%2016.878906L17.878906%2012.636719L20%2014.757812L21%2013.757812L21%2013L21%209.1953125L21%207.7519531L11%2014L1%207.7519531%20z%20M%2017.878906%2015.464844L16.464844%2016.878906L18.585938%2019L16.464844%2021.121094L17.878906%2022.535156L20%2020.414062L22.121094%2022.535156L23.535156%2021.121094L21.414062%2019L23.535156%2016.878906L22.121094%2015.464844L20%2017.585938L17.878906%2015.464844%20z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Junk</a></li><li class="menu_trash"><a class="unread_link" href="?page=message_list&amp;list_path=trash"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2028%2028%22%3E%0A%20%20%3Cpath%20d%3D%22M6%208v16c0%201.1.9%202%202%202h14c1.1%200%202-.9%202-2V8H6zM24%204h-6c0-.6-.4-1-1-1h-4c-.6%200-1%20.4-1%201H6C5.4%204%205%204.4%205%205s.4%201%201%201h18c.6%200%201-.4%201-1S24.6%204%2024%204z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Trash</a></li><li class="menu_drafts"><a class="unread_link" href="?page=message_list&amp;list_path=drafts"><img class="account_icon" src="data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%0A%3C%21--%20Uploaded%20to%3A%20SVG%20Repo%2C%20www.svgrepo.com%2C%20Generator%3A%20SVG%20Repo%20Mixer%20Tools%20--%3E%0A%3C%21DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%0A%3Csvg%20fill%3D%22%23000000%22%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20%0A%09%20width%3D%22800px%22%20height%3D%22800px%22%20viewBox%3D%220%200%2031.854%2031.854%22%0A%09%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cg%3E%0A%09%3Cpath%20d%3D%22M15.94%2C11.735c0%2C0.588-0.476%2C1.064-1.065%2C1.064H5.298c-0.588%2C0-1.065-0.476-1.065-1.064c0-0.587%2C0.477-1.063%2C1.065-1.063%0A%09%09h9.577C15.465%2C10.672%2C15.94%2C11.148%2C15.94%2C11.735z%20M21.52%2C11.087l5.342%2C4.791L15.535%2C28.505l-5.34-4.791L21.52%2C11.087z%0A%09%09%20M20.008%2C16.188l-0.033-0.029c-0.127-0.114-0.293-0.172-0.461-0.163c-0.168%2C0.009-0.328%2C0.085-0.439%2C0.211l-6.079%2C6.776%0A%09%09c-0.253%2C0.281-0.229%2C0.713%2C0.052%2C0.965c0.126%2C0.115%2C0.291%2C0.174%2C0.461%2C0.164c0.168-0.01%2C0.327-0.086%2C0.44-0.213l6.108-6.81%0A%09%09C20.293%2C16.828%2C20.27%2C16.423%2C20.008%2C16.188z%20M21.27%2C13.751l-0.301%2C0.336c-0.111%2C0.126-0.17%2C0.292-0.162%2C0.461%0A%09%09c0.01%2C0.169%2C0.086%2C0.328%2C0.211%2C0.441l0.035%2C0.031c0.127%2C0.113%2C0.293%2C0.171%2C0.461%2C0.162c0.17-0.009%2C0.328-0.085%2C0.44-0.211%0A%09%09l0.728-0.811l-0.51-0.457C21.91%2C13.467%2C21.506%2C13.489%2C21.27%2C13.751z%20M22.035%2C10.51l5.341%2C4.791l1.312-1.462l-5.34-4.791%0A%09%09L22.035%2C10.51z%20M31.047%2C11.21l-1.877%2C2.093l-5.341-4.79l1.88-2.093c0.247-0.28%2C0.6-0.448%2C0.975-0.468%0A%09%09c0.375-0.021%2C0.742%2C0.109%2C1.021%2C0.359l3.234%2C2.903C31.52%2C9.735%2C31.569%2C10.629%2C31.047%2C11.21z%20M29.996%2C10.264l-3.233-2.902%0A%09%09l-0.937%2C1.042l3.233%2C2.903L29.996%2C10.264z%20M9.557%2C24.428l5.339%2C4.791l-6.31%2C2.586c-0.243%2C0.098-0.521%2C0.051-0.716-0.125%0A%09%09c-0.196-0.177-0.273-0.447-0.201-0.699L9.557%2C24.428z%20M10.045%2C26.13l-0.722%2C2.507l1.411%2C1.268l2.412-0.986L10.045%2C26.13z%0A%09%09%20M8.215%2C24.285l-0.623%2C2.162H2.859c-1.332%2C0-2.413-1.08-2.413-2.412V6.493c0-1.332%2C1.08-2.413%2C2.413-2.413h2.94V3.906%0A%09%09c0-0.492%2C0.399-0.89%2C0.89-0.89h0.74C7.414%2C2.909%2C7.406%2C2.781%2C7.406%2C2.661C7.406%2C1.194%2C8.599%2C0%2C10.067%2C0%0A%09%09c1.469%2C0%2C2.661%2C1.194%2C2.661%2C2.661c0%2C0.12-0.01%2C0.248-0.023%2C0.354h0.749c0.492%2C0%2C0.89%2C0.399%2C0.89%2C0.89v0.174h2.87%0A%09%09c1.332%2C0%2C2.412%2C1.081%2C2.412%2C2.413v4.63l-2.128%2C2.372V7.506c0-0.699-0.565-1.265-1.264-1.265h-1.891v1.201%0A%09%09c0%2C0.491-0.399%2C0.89-0.89%2C0.89H6.69c-0.492%2C0-0.89-0.399-0.89-0.89V6.241H3.874c-0.699%2C0-1.265%2C0.567-1.265%2C1.265V23.02%0A%09%09c0%2C0.701%2C0.567%2C1.266%2C1.265%2C1.266H8.215z%20M9.003%2C2.661c0%2C0.124%2C0.023%2C0.248%2C0.061%2C0.355h2.005c0.04-0.107%2C0.062-0.23%2C0.062-0.355%0A%09%09c0-0.587-0.477-1.065-1.064-1.065C9.479%2C1.596%2C9.003%2C2.074%2C9.003%2C2.661z%20M14.949%2C16.341l0.991-1.105%0A%09%09c-0.014-0.576-0.484-1.054-1.064-1.054H5.298c-0.588%2C0-1.065%2C0.493-1.065%2C1.082c0%2C0.587%2C0.477%2C1.082%2C1.065%2C1.082h9.577%0A%09%09C14.9%2C16.344%2C14.925%2C16.342%2C14.949%2C16.341z%20M4.233%2C18.791c0%2C0.588%2C0.477%2C1.062%2C1.065%2C1.062H11.8l1.907-2.127H5.298%0A%09%09C4.71%2C17.727%2C4.233%2C18.203%2C4.233%2C18.791z%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Drafts</a></li>'), $res->output_response);
+        $this->assertEquals(array('folder_sources' => array(array('email_folders', 'baz')), 'formatted_folder_list' => '<li class="menu_combined_inbox"><a class="unread_link" href="?page=message_list&amp;list_path=combined_inbox"><i class="bi bi-box2-fill fs-5 me-2"></i>Everything</a><span class="combined_inbox_count"></span></li><li class="menu_unread d-flex align-items-center"><a class="unread_link d-flex align-items-center" href="?page=message_list&amp;list_path=unread"><i class="bi bi-envelope-fill fs-5 me-2"></i>Unread</a><span class="total_unread_count badge bg-secondary ms-2 px-1"></span></li><li class="menu_flagged"><a class="unread_link" href="?page=message_list&amp;list_path=flagged"><i class="bi bi-flag-fill fs-5 me-2"></i>Flagged</a> <span class="flagged_count"></span></li><li class="menu_junk"><a class="unread_link" href="?page=message_list&amp;list_path=junk"><i class="bi bi-envelope-x-fill fs-5 me-2"></i>Junk</a></li><li class="menu_trash"><a class="unread_link" href="?page=message_list&amp;list_path=trash"><i class="bi bi-trash3-fill fs-5 me-2"></i>Trash</a></li><li class="menu_drafts"><a class="unread_link" href="?page=message_list&amp;list_path=drafts"><i class="bi bi-pencil-square fs-5 me-2"></i>Drafts</a></li>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1237,10 +1237,10 @@ public function test_main_menu_content() {
     public function test_logout_menu_item() {
         $test = new Output_Test('logout_menu_item', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<li class="menu_logout"><a class="unread_link logout_link" href="#"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M3%200v4h1v-4h-1zm-1.281%201.438l-.375.313c-.803.64-1.344%201.634-1.344%202.75%200%201.929%201.571%203.5%203.5%203.5s3.5-1.571%203.5-3.5c0-1.116-.529-2.11-1.344-2.75l-.375-.313-.625.781.375.313c.585.46.969%201.165.969%201.969%200%201.391-1.109%202.5-2.5%202.5s-2.5-1.109-2.5-2.5c0-.804.361-1.509.938-1.969l.406-.313-.625-.781z%22%0A%20%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Logout</a></li>'), $res->output_response);
+        $this->assertEquals(array('<li class="menu_logout"><a class="unread_link logout_link" href="#"><i class="bi bi-power fs-5 me-2"></i>Logout</a></li>'), $res->output_response);
         $test->rtype = 'AJAX';
         $res = $test->run();
-        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_logout"><a class="unread_link logout_link" href="#"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M3%200v4h1v-4h-1zm-1.281%201.438l-.375.313c-.803.64-1.344%201.634-1.344%202.75%200%201.929%201.571%203.5%203.5%203.5s3.5-1.571%203.5-3.5c0-1.116-.529-2.11-1.344-2.75l-.375-.313-.625.781.375.313c.585.46.969%201.165.969%201.969%200%201.391-1.109%202.5-2.5%202.5s-2.5-1.109-2.5-2.5c0-.804.361-1.509.938-1.969l.406-.313-.625-.781z%22%0A%20%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Logout</a></li>'), $res->output_response);
+        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_logout"><a class="unread_link logout_link" href="#"><i class="bi bi-power fs-5 me-2"></i>Logout</a></li>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1265,10 +1265,10 @@ public function test_email_menu_content() {
         $this->assertEquals(array('<div class="email_folders"><ul class="folders">baz</ul></div>'), $res->output_response);
         $test->handler_response = array('folder_sources' => array(array('email_folders', 'baz')));
         $res = $test->run();
-        $this->assertEquals(array('<div class="src_name" data-source=".email_folders">Email<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><div style="display: none;" class="email_folders"><ul class="folders"><li class="menu_email"><a class="unread_link" href="?page=message_list&amp;list_path=email"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.21%200-4%201.79-4%204s1.79%204%204%204%204-1.79%204-4-1.79-4-4-4zm0%201c.333%200%20.637.086.938.188-.214.197-.45.383-.406.563.04.18.688.13.688.5%200%20.27-.425.346-.125.656.35.35-.636.978-.656%201.438-.03.83.841.969%201.531.969.424%200%20.503.195.469.438-.546.758-1.438%201.25-2.438%201.25-.378%200-.729-.09-1.063-.219.224-.442-.313-1.344-.781-1.625-.226-.226-.689-.114-.969-.219-.092-.271-.178-.545-.188-.844.031-.05.081-.094.156-.094.19%200%20.454.374.594.344.18-.04-.742-1.313-.313-1.563.2-.12.609.394.469-.156-.12-.51.366-.276.656-.406.26-.11.455-.414.125-.594l-.219-.188c.45-.27.972-.438%201.531-.438zm2.313%201.094c.184.222.323.481.438.75l-.188.219c-.29.27-.327-.212-.438-.313-.13-.11-.638.025-.688-.125-.077-.181.499-.418.875-.531z%22%0A%20%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> All</a> <span class="unread_mail_count"></span></li>baz</ul></div>'), $res->output_response);
+        $this->assertEquals(array('<div class="src_name" data-source=".email_folders">Email<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><div style="display: none;" class="email_folders"><ul class="folders"><li class="menu_email"><a class="unread_link" href="?page=message_list&amp;list_path=email"><i class="bi bi-globe-americas fs-5 me-2"></i>All</a> <span class="unread_mail_count"></span></li>baz</ul></div>'), $res->output_response);
         $test->rtype = 'AJAX';
         $res = $test->run();
-        $this->assertEquals(array('folder_sources' => array(array('email_folders', 'baz')), 'formatted_folder_list' => '<div class="src_name" data-source=".email_folders">Email<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><div style="display: none;" class="email_folders"><ul class="folders"><li class="menu_email"><a class="unread_link" href="?page=message_list&amp;list_path=email"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200c-2.21%200-4%201.79-4%204s1.79%204%204%204%204-1.79%204-4-1.79-4-4-4zm0%201c.333%200%20.637.086.938.188-.214.197-.45.383-.406.563.04.18.688.13.688.5%200%20.27-.425.346-.125.656.35.35-.636.978-.656%201.438-.03.83.841.969%201.531.969.424%200%20.503.195.469.438-.546.758-1.438%201.25-2.438%201.25-.378%200-.729-.09-1.063-.219.224-.442-.313-1.344-.781-1.625-.226-.226-.689-.114-.969-.219-.092-.271-.178-.545-.188-.844.031-.05.081-.094.156-.094.19%200%20.454.374.594.344.18-.04-.742-1.313-.313-1.563.2-.12.609.394.469-.156-.12-.51.366-.276.656-.406.26-.11.455-.414.125-.594l-.219-.188c.45-.27.972-.438%201.531-.438zm2.313%201.094c.184.222.323.481.438.75l-.188.219c-.29.27-.327-.212-.438-.313-.13-.11-.638.025-.688-.125-.077-.181.499-.418.875-.531z%22%0A%20%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> All</a> <span class="unread_mail_count"></span></li>baz</ul></div>'), $res->output_response);
+        $this->assertEquals(array('folder_sources' => array(array('email_folders', 'baz')), 'formatted_folder_list' => '<div class="src_name" data-source=".email_folders">Email<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><div style="display: none;" class="email_folders"><ul class="folders"><li class="menu_email"><a class="unread_link" href="?page=message_list&amp;list_path=email"><i class="bi bi-globe-americas fs-5 me-2"></i>All</a> <span class="unread_mail_count"></span></li>baz</ul></div>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1277,10 +1277,10 @@ public function test_email_menu_content() {
     public function test_settings_menu_start() {
         $test = new Output_Test('settings_menu_start', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<div class="src_name" data-source=".settings">Settings<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><ul style="display: none;" class="settings folders"><li class="menu_home"><a class="unread_link" href="?page=home"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200l-4%203h1v4h2v-2h2v2h2v-4.031l1%20.031-4-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Home</a></li>'), $res->output_response);
+        $this->assertEquals(array('<div class="src_name" data-source=".settings">Settings<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><ul style="display: none;" class="settings folders"><li class="menu_home"><a class="unread_link" href="?page=home"><i class="bi bi-house-door-fill fs-5 me-2"></i>Home</a></li>'), $res->output_response);
         $test->rtype = 'AJAX';
         $res = $test->run();
-        $this->assertEquals(array('formatted_folder_list' => '<div class="src_name" data-source=".settings">Settings<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><ul style="display: none;" class="settings folders"><li class="menu_home"><a class="unread_link" href="?page=home"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M4%200l-4%203h1v4h2v-2h2v2h2v-4.031l1%20.031-4-3z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Home</a></li>'), $res->output_response);
+        $this->assertEquals(array('formatted_folder_list' => '<div class="src_name" data-source=".settings">Settings<img class="menu_caret" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M1.5%201l-1.5%201.5%204%204%204-4-1.5-1.5-2.5%202.5-2.5-2.5z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="8" height="8" /></div><ul style="display: none;" class="settings folders"><li class="menu_home"><a class="unread_link" href="?page=home"><i class="bi bi-house-door-fill fs-5 me-2"></i>Home</a></li>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1289,10 +1289,10 @@ public function test_settings_menu_start() {
     public function test_save_form() {
         $test = new Output_Test('save_form', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<div class="save_settings_page"><div class="content_title">Save Settings</div><div class="save_details">Settings are not saved permanently on the server unless you explicitly allow it. If you don\'t save your settings, any changes made since you last logged in will be deleted when your session expires or you logout. You must re-enter your password for security purposes to save your settings permanently.<div class="save_subtitle">Unsaved Changes</div><ul class="unsaved_settings"><li>No changes need to be saved</li></ul></div><div class="save_perm_form"><form method="post"><input type="hidden" name="hm_page_key" value="" /><input type="text" value="cypht_user" autocomplete="username" style="display: none;"/><label class="screen_reader" for="password">Password</label><input required id="password" name="password" autocomplete="current-password" class="save_settings_password" type="password" placeholder="Password" /><input class="save_settings" type="submit" name="save_settings_permanently" value="Save" /><input class="save_settings" type="submit" name="save_settings_permanently_then_logout" value="Save and Logout" /></form><form method="post"><input type="hidden" name="hm_page_key" value="" /><input class="save_settings" type="submit" name="logout" value="Just Logout" /></form></div></div>'), $res->output_response);
+        $this->assertEquals(array('<div class="save_settings_page p-0"><div class="content_title px-3">Save Settings</div><div class="save_details p-3">Settings are not saved permanently on the server unless you explicitly allow it. If you don\'t save your settings, any changes made since you last logged in will be deleted when your session expires or you logout. You must re-enter your password for security purposes to save your settings permanently.<div class="save_subtitle mt-3"><b>Unsaved Changes</b></div><ul class="unsaved_settings"><li>foo (1X)</li></ul></div><div class="save_perm_form px-3"><form method="post"><input type="hidden" name="hm_page_key" value="" /><input type="text" value="cypht_user" autocomplete="username" style="display: none;"/><label class="screen_reader" for="password">Password</label><input required id="password" name="password" autocomplete="current-password" class="save_settings_password form-control mb-2" type="password" placeholder="Password" /><input class="save_settings btn btn-success me-2" type="submit" name="save_settings_permanently" value="Save" /><input class="save_settings btn btn-outline-secondary me-2" type="submit" name="save_settings_permanently_then_logout" value="Save and Logout" /></form><form method="post"><input type="hidden" name="hm_page_key" value="" /><input class="save_settings btn btn-outline-secondary" type="submit" name="logout" value="Just Logout" /></form></div></div>'), $res->output_response);
         $test->handler_response = array('changed_settings' => array('foo'));
         $res = $test->run();
-        $this->assertEquals(array('<div class="save_settings_page"><div class="content_title">Save Settings</div><div class="save_details">Settings are not saved permanently on the server unless you explicitly allow it. If you don\'t save your settings, any changes made since you last logged in will be deleted when your session expires or you logout. You must re-enter your password for security purposes to save your settings permanently.<div class="save_subtitle">Unsaved Changes</div><ul class="unsaved_settings"><li>foo (1X)</li></ul></div><div class="save_perm_form"><form method="post"><input type="hidden" name="hm_page_key" value="" /><input type="text" value="cypht_user" autocomplete="username" style="display: none;"/><label class="screen_reader" for="password">Password</label><input required id="password" name="password" autocomplete="current-password" class="save_settings_password" type="password" placeholder="Password" /><input class="save_settings" type="submit" name="save_settings_permanently" value="Save" /><input class="save_settings" type="submit" name="save_settings_permanently_then_logout" value="Save and Logout" /></form><form method="post"><input type="hidden" name="hm_page_key" value="" /><input class="save_settings" type="submit" name="logout" value="Just Logout" /></form></div></div>'), $res->output_response);
+        $this->assertEquals(array('<div class="save_settings_page p-0"><div class="content_title px-3">Save Settings</div><div class="save_details p-3">Settings are not saved permanently on the server unless you explicitly allow it. If you don\'t save your settings, any changes made since you last logged in will be deleted when your session expires or you logout. You must re-enter your password for security purposes to save your settings permanently.<div class="save_subtitle mt-3"><b>Unsaved Changes</b></div><ul class="unsaved_settings"><li>foo (1X)</li></ul></div><div class="save_perm_form px-3"><form method="post"><input type="hidden" name="hm_page_key" value="" /><input type="text" value="cypht_user" autocomplete="username" style="display: none;"/><label class="screen_reader" for="password">Password</label><input required id="password" name="password" autocomplete="current-password" class="save_settings_password form-control mb-2" type="password" placeholder="Password" /><input class="save_settings btn btn-success me-2" type="submit" name="save_settings_permanently" value="Save" /><input class="save_settings btn btn-outline-secondary me-2" type="submit" name="save_settings_permanently_then_logout" value="Save and Logout" /></form><form method="post"><input type="hidden" name="hm_page_key" value="" /><input class="save_settings btn btn-outline-secondary" type="submit" name="logout" value="Just Logout" /></form></div></div>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1301,7 +1301,7 @@ public function test_save_form() {
     public function test_settings_servers_link() {
         $test = new Output_Test('settings_servers_link', 'core');
         $res = $test->run();
-        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_servers"><a class="unread_link" href="?page=servers"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M.344%200a.5.5%200%200%200-.344.5v5a.5.5%200%200%200%20.5.5h2.5v1h-1c-.55%200-1%20.45-1%201h6c0-.55-.45-1-1-1h-1v-1h2.5a.5.5%200%200%200%20.5-.5v-5a.5.5%200%200%200-.5-.5h-7a.5.5%200%200%200-.094%200%20.5.5%200%200%200-.063%200zm.656%201h6v4h-6v-4z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Servers</a></li>'), $res->output_response);
+        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_servers"><a class="unread_link" href="?page=servers"><i class="bi bi-pc-display-horizontal fs-5 me-2"></i>Servers</a></li>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1310,7 +1310,7 @@ public function test_settings_servers_link() {
     public function test_settings_site_link() {
         $test = new Output_Test('settings_site_link', 'core');
         $res = $test->run();
-        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_settings"><a class="unread_link" href="?page=settings"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M3.5%200l-.5%201.188-.281.125-1.188-.5-.719.719.5%201.188-.125.281-1.188.5v1l1.188.5.125.313-.5%201.156.719.719%201.188-.5.281.125.5%201.188h1l.5-1.188.281-.125%201.188.5.719-.719-.5-1.188.125-.281%201.188-.5v-1l-1.188-.5-.125-.281.469-1.188-.688-.719-1.188.5-.281-.125-.5-1.188h-1zm.5%202.5c.83%200%201.5.67%201.5%201.5s-.67%201.5-1.5%201.5-1.5-.67-1.5-1.5.67-1.5%201.5-1.5z%22%0A%20%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Site</a></li>'), $res->output_response);
+        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_settings"><a class="unread_link" href="?page=settings"><i class="bi bi-gear-wide-connected fs-5 me-2"></i>Site</a></li>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1319,7 +1319,7 @@ public function test_settings_site_link() {
     public function test_settings_save_link() {
         $test = new Output_Test('settings_save_link', 'core');
         $res = $test->run();
-        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_save"><a class="unread_link" href="?page=save"><img class="account_icon" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%0A%20%20%3Cpath%20d%3D%22M3%200v3h-2l3%203%203-3h-2v-3h-2zm-3%207v1h8v-1h-8z%22%20%2F%3E%0A%3C%2Fsvg%3E" alt="" width="16" height="16" /> Save</a></li>'), $res->output_response);
+        $this->assertEquals(array('formatted_folder_list' => '<li class="menu_save"><a class="unread_link" href="?page=save"><i class="bi bi-download fs-5 me-2"></i>Save</a></li>'), $res->output_response);
         $test->handler_response = array('single_server_mode' => true);
         $res = $test->run();
         $this->assertEquals(array('single_server_mode' => 1), $res->output_response);
@@ -1364,7 +1364,7 @@ public function test_folder_list_end() {
     public function test_content_section_start() {
         $test = new Output_Test('content_section_start', 'core');
         $res = $test->run();
-        $this->assertEquals(array('<main class="content_cell"><div class="offline">Offline</div>'), $res->output_response);
+        $this->assertEquals(array('<main class="container-fluid content_cell"><div class="offline">Offline</div><div class="row m-0 position-relative">'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1373,7 +1373,7 @@ public function test_content_section_start() {
     public function test_content_section_end() {
         $test = new Output_Test('content_section_end', 'core');
         $res = $test->run();
-        $this->assertEquals(array('</main>'), $res->output_response);
+        $this->assertEquals(array('</div></main>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1434,10 +1434,10 @@ public function test_message_list_start() {
         $test = new Output_Test('message_list_start', 'core');
         $test->handler_response = array('message_list_fields' => array('foo', 'bar'));
         $res = $test->run();
-        $this->assertEquals(array('<table class="message_table"><colgroup><col class="f"><col class="b"></colgroup><thead><tr><th class="o">o</th><th class="a">r</th></tr></thead><tbody class="message_table_body">'), $res->output_response);
+        $this->assertEquals(array('<div class="p-3"><table class="message_table table pt-5"><colgroup><col class="f"><col class="b"></colgroup><thead><tr><th class="o">o</th><th class="a">r</th></tr></thead><tbody class="message_table_body">'), $res->output_response);
         $test->handler_response = array('message_list_fields' => array(array(false, true, false)));
         $res = $test->run();
-        $this->assertEquals(array('<table class="message_table"><thead><tr><th></th></tr></thead><tbody class="message_table_body">'), $res->output_response);
+        $this->assertEquals(array('<div class="p-3"><table class="message_table table pt-5"><thead><tr><th></th></tr></thead><tbody class="message_table_body">'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1502,7 +1502,7 @@ public function test_message_list_heading() {
     public function test_message_list_end() {
         $test = new Output_Test('message_list_end', 'core');
         $res = $test->run();
-        $this->assertEquals(array('</tbody></table><div class="page_links"></div></div>'), $res->output_response);
+        $this->assertEquals(array('</tbody></table></div><div class="mb-5 page_links d-flex justify-content-center gap-3 align-content-center"></div></div>'), $res->output_response);
     }
 }
 class Hm_Test_Core_Output_Modules_Debug extends TestCase {
@@ -1520,7 +1520,7 @@ public function test_header_css_debug() {
         $test = new Output_Test('header_css', 'core');
         $test->handler_response = array('router_module_list' => array('core'));
         $res = $test->run();
-        $this->assertEquals(array('<link href="modules/core/site.css" media="all" rel="stylesheet" type="text/css" /><style type="text/css">@font-face {font-family:"Behdad";src:url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff2") format("woff2"),url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff") format("woff");</style>'), $res->output_response);
+        $this->assertEquals(array('<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" /><link href="vendor/twbs/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" type="text/css" /><link href="modules/core/site.css" media="all" rel="stylesheet" type="text/css" /><style type="text/css">@font-face {font-family:"Behdad";src:url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff2") format("woff2"),url("modules/core/assets/fonts/Behdad/Behdad-Regular.woff") format("woff");</style>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled
@@ -1530,10 +1530,10 @@ public function test_page_js_debug() {
         $test = new Output_Test('page_js', 'core');
         $test->handler_response = array('encrypt_ajax_requests' => true, 'router_module_list' => array('foo', 'core'));
         $res = $test->run();
-        $this->assertEquals(array('<script type="text/javascript" src="third_party/cash.min.js"></script><script type="text/javascript" src="third_party/resumable.min.js"></script><script type="text/javascript" src="third_party/tingle.min.js"></script><script type="text/javascript" src="third_party/ays-beforeunload-shim.js"></script><script type="text/javascript" src="third_party/jquery.are-you-sure.js"></script><script type="text/javascript" src="third_party/sortable.min.js"></script><script type="text/javascript" src="third_party/forge.min.js"></script><script type="text/javascript" src="modules/core/site.js"></script>'), $res->output_response);
+        $this->assertEquals(array('<script type="text/javascript" src="vendor/twbs/bootstrap/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="third_party/cash.min.js"></script><script type="text/javascript" src="third_party/resumable.min.js"></script><script type="text/javascript" src="third_party/tingle.min.js"></script><script type="text/javascript" src="third_party/ays-beforeunload-shim.js"></script><script type="text/javascript" src="third_party/jquery.are-you-sure.js"></script><script type="text/javascript" src="third_party/sortable.min.js"></script><script type="text/javascript" src="third_party/forge.min.js"></script><script type="text/javascript" src="modules/core/site.js"></script>'), $res->output_response);
         $test->handler_response = array('encrypt_ajax_requests' => true, 'router_module_list' => array('imap'));
         $res = $test->run();
-        $this->assertEquals(array('<script type="text/javascript" src="third_party/cash.min.js"></script><script type="text/javascript" src="third_party/resumable.min.js"></script><script type="text/javascript" src="third_party/tingle.min.js"></script><script type="text/javascript" src="third_party/ays-beforeunload-shim.js"></script><script type="text/javascript" src="third_party/jquery.are-you-sure.js"></script><script type="text/javascript" src="third_party/sortable.min.js"></script><script type="text/javascript" src="third_party/forge.min.js"></script><script type="text/javascript" src="modules/core/site.js"></script><script type="text/javascript" src="modules/imap/site.js"></script>'), $res->output_response);
+        $this->assertEquals(array('<script type="text/javascript" src="vendor/twbs/bootstrap/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="third_party/cash.min.js"></script><script type="text/javascript" src="third_party/resumable.min.js"></script><script type="text/javascript" src="third_party/tingle.min.js"></script><script type="text/javascript" src="third_party/ays-beforeunload-shim.js"></script><script type="text/javascript" src="third_party/jquery.are-you-sure.js"></script><script type="text/javascript" src="third_party/sortable.min.js"></script><script type="text/javascript" src="third_party/forge.min.js"></script><script type="text/javascript" src="modules/core/site.js"></script><script type="text/javascript" src="modules/imap/site.js"></script>'), $res->output_response);
     }
     /**
      * @preserveGlobalState disabled