diff --git a/js/src/server/privileges.js b/js/src/server/privileges.js
index 5bfc50ca32..ef7954fa15 100644
--- a/js/src/server/privileges.js
+++ b/js/src/server/privileges.js
@@ -54,7 +54,6 @@ AJAX.registerTeardown('server/privileges.js', function () {
$(document).off('click', 'a.edit_user_group_anchor.ajax');
$(document).off('click', 'button.mult_submit[value=export]');
$(document).off('click', 'a.export_user_anchor.ajax');
- $(document).off('click', '#initials_table a.ajax');
$('#dropUsersDbCheckbox').off('click');
$(document).off('click', '.checkall_box');
$(document).off('change', '#checkbox_SSL_priv');
@@ -166,9 +165,13 @@ AJAX.registerOnload('server/privileges.js', function () {
var thisUserInitial = $(this).find('input:checkbox').val().charAt(0).toUpperCase();
$(this).remove();
- // If this is the last user with this_user_initial, remove the link from #initials_table
+ // If this is the last user with thisUserInitial, remove the link from #userAccountsPagination
if ($('#userRightsTable').find('input:checkbox[value^="' + thisUserInitial + '"], input:checkbox[value^="' + thisUserInitial.toLowerCase() + '"]').length === 0) {
- $('#initials_table').find('td > a:contains(' + thisUserInitial + ')').parent('td').html(thisUserInitial);
+ $('#userAccountsPagination')
+ .find('.page-item > .page-link:contains(' + thisUserInitial + ')')
+ .parent('.page-item')
+ .addClass('disabled')
+ .html('' + thisUserInitial + '');
}
// Re-check the classes of each row
@@ -339,40 +342,6 @@ AJAX.registerOnload('server/privileges.js', function () {
}); // end $.get
}); // end export privileges
- /**
- * AJAX handler to Paginate the Users Table
- *
- * @see Functions.ajaxShowMessage()
- * @name paginate_users_table_click
- * @memberOf jQuery
- */
- $(document).on('click', '#initials_table a.ajax', function (event) {
- event.preventDefault();
- var $msgbox = Functions.ajaxShowMessage();
- $.get($(this).attr('href'), { 'ajax_request' : true }, function (data) {
- if (typeof data !== 'undefined' && data.success === true) {
- Functions.ajaxRemoveMessage($msgbox);
- // This form is not on screen when first entering Privileges
- // if there are more than 50 users
- $('.alert-primary').remove();
- $('#usersForm').hide('medium').remove();
- $('#fieldset_add_user').hide('medium').remove();
- $('#initials_table')
- .prop('id', 'initials_table_old')
- .after(data.message).show('medium')
- .siblings('h2').not($('#initials_table')
- .prop('id', 'initials_table_old')
- .after(data.message).show('medium')
- .siblings('h2').first())
- .remove();
- // prevent double initials table
- $('#initials_table_old').remove();
- } else {
- Functions.ajaxShowMessage(data.error, false);
- }
- }); // end $.get
- }); // end of the paginate users table
-
$(document).on('change', 'input[name="ssl_type"]', function () {
var $div = $('#specified_div');
if ($('#ssl_type_SPECIFIED').is(':checked')) {
diff --git a/libraries/classes/Server/Privileges.php b/libraries/classes/Server/Privileges.php
index cd4f4b4755..49d234243f 100644
--- a/libraries/classes/Server/Privileges.php
+++ b/libraries/classes/Server/Privileges.php
@@ -2229,6 +2229,7 @@ class Privileges
return $this->template->render('server/privileges/initials_row', [
'array_initials' => $array_initials,
'initial' => $_GET['initial'] ?? null,
+ 'viewing_mode' => $_GET['viewing_mode'] ?? null,
]);
}
diff --git a/templates/server/privileges/initials_row.twig b/templates/server/privileges/initials_row.twig
index f5ebbe2e18..622310d65b 100644
--- a/templates/server/privileges/initials_row.twig
+++ b/templates/server/privileges/initials_row.twig
@@ -1,24 +1,20 @@
-
-
- {% for tmp_initial, initial_was_found in array_initials %}
- {% if tmp_initial is not same as(null) %}
- {% if initial_was_found %}
- |
-
- {{- tmp_initial|raw -}}
-
- |
- {% else %}
- {{ tmp_initial|raw }} |
- {% endif %}
- {% endif %}
- {% endfor %}
-
-
- {% trans 'Show all' %}
-
- |
-
-
+
diff --git a/test/classes/Server/PrivilegesTest.php b/test/classes/Server/PrivilegesTest.php
index 61e9d9cf0e..80bcb46b8d 100644
--- a/test/classes/Server/PrivilegesTest.php
+++ b/test/classes/Server/PrivilegesTest.php
@@ -1984,16 +1984,22 @@ class PrivilegesTest extends AbstractTestCase
->will($this->onConsecutiveCalls(['-']));
$this->serverPrivileges->dbi = $GLOBALS['dbi'];
$actual = $this->serverPrivileges->getHtmlForInitials(['"' => true]);
- $this->assertStringContainsString('A | ', $actual);
- $this->assertStringContainsString('Z | ', $actual);
$this->assertStringContainsString(
- 'A',
+ $actual
+ );
+ $this->assertStringContainsString(
+ 'Z',
+ $actual
+ );
+ $this->assertStringContainsString(
+ '-',
$actual
);
$this->assertStringContainsString(
- '"',
+ '"',
$actual
);
$this->assertStringContainsString('Show all', $actual);
diff --git a/themes/bootstrap/scss/_common.scss b/themes/bootstrap/scss/_common.scss
index 003c7e6b71..edff2cb4b7 100644
--- a/themes/bootstrap/scss/_common.scss
+++ b/themes/bootstrap/scss/_common.scss
@@ -35,31 +35,6 @@ button.mult_submit {
display: none;
}
-#initials_table {
- background: #f3f3f3;
- border: 1px solid #aaa;
- margin-bottom: 10px;
- border-radius: 5px;
-
- td {
- padding: 8px !important;
- }
-
- a {
- border: 1px solid #aaa;
- background-color: #fff;
- padding: 4px 8px;
- border-radius: 5px;
- background-image: linear-gradient(#fff, #e0e0e0);
-
- &.active {
- border: 1px solid #666;
- box-shadow: 0 0 2px #999;
- background: linear-gradient(#bbb, #fff);
- }
- }
-}
-
.pma-table th {
font-weight: bold;
color: $th-color;
diff --git a/themes/metro/scss/_common.scss b/themes/metro/scss/_common.scss
index 19bcd8a175..4fdf86f2d9 100644
--- a/themes/metro/scss/_common.scss
+++ b/themes/metro/scss/_common.scss
@@ -184,22 +184,6 @@ button.mult_submit {
color: #235a81;
}
-#initials_table {
- background: $th-background;
- border: 1px solid $border-color;
- margin-bottom: 10px;
-
- td {
- padding: 8px !important;
- }
-
- a {
- border: 1px solid $border-color;
- background: $body-bg;
- padding: 4px 8px;
- }
-}
-
dfn:hover {
cursor: help;
}
diff --git a/themes/metro/scss/_variables.scss b/themes/metro/scss/_variables.scss
index 26193ec75c..e154ce8bc3 100644
--- a/themes/metro/scss/_variables.scss
+++ b/themes/metro/scss/_variables.scss
@@ -159,6 +159,10 @@ $link-decoration: none;
$link-hover-color: $browse-pointer-color;
$link-hover-decoration: underline;
+// Components
+
+$border-radius: 0;
+
// Typography
$font-family-base: "Open Sans", "Segoe UI", sans-serif;
@@ -221,6 +225,15 @@ $navbar-light-hover-color: #333;
$navbar-light-active-color: #666;
$navbar-light-disabled-color: #666;
+// Pagination
+
+$pagination-bg: $th-background;
+$pagination-hover-bg: $browse-marker-background;
+$pagination-border-color: $border-color;
+$pagination-hover-border-color: $border-color;
+$pagination-active-border-color: $border-color;
+$pagination-disabled-border-color: $border-color;
+
// Card
$card-border-radius: 0;
diff --git a/themes/original/scss/_variables.scss b/themes/original/scss/_variables.scss
index 05e7d90855..0af7146260 100644
--- a/themes/original/scss/_variables.scss
+++ b/themes/original/scss/_variables.scss
@@ -63,6 +63,10 @@ $link-decoration: none;
$link-hover-color: #f00;
$link-hover-decoration: underline;
+// Components
+
+$border-radius: 0;
+
// Typography
$font-family-base: sans-serif;
@@ -107,6 +111,13 @@ $navbar-light-hover-color: #f00;
$navbar-light-active-color: #00f;
$navbar-light-disabled-color: #00f;
+// Pagination
+
+$pagination-border-color: $main-color;
+$pagination-hover-border-color: $main-color;
+$pagination-active-border-color: $main-color;
+$pagination-disabled-border-color: $main-color;
+
// Card
$card-border-radius: 0;
diff --git a/themes/pmahomme/scss/_common.scss b/themes/pmahomme/scss/_common.scss
index 9cc5ac4d5b..ffb97f5da9 100644
--- a/themes/pmahomme/scss/_common.scss
+++ b/themes/pmahomme/scss/_common.scss
@@ -42,31 +42,6 @@ button.mult_submit {
color: #235a81;
}
-#initials_table {
- background: #f3f3f3;
- border: 1px solid #aaa;
- margin-bottom: 10px;
- border-radius: 5px;
-
- td {
- padding: 8px !important;
- }
-
- a {
- border: 1px solid #aaa;
- background-color: #fff;
- padding: 4px 8px;
- border-radius: 5px;
- background-image: linear-gradient(#fff, #e0e0e0);
-
- &.active {
- border: 1px solid #666;
- box-shadow: 0 0 2px #999;
- background: linear-gradient(#bbb, #fff);
- }
- }
-}
-
dfn {
font-style: normal;
diff --git a/themes/pmahomme/scss/_pagination.scss b/themes/pmahomme/scss/_pagination.scss
new file mode 100644
index 0000000000..e89431d13d
--- /dev/null
+++ b/themes/pmahomme/scss/_pagination.scss
@@ -0,0 +1,17 @@
+.page-link {
+ background-image: linear-gradient(#fff, #e0e0e0);
+
+ &:hover {
+ text-decoration: $link-hover-decoration;
+ }
+}
+
+.page-item {
+ &.active .page-link {
+ background-image: linear-gradient(#bbb, #fff);
+ }
+
+ &.disabled .page-link {
+ background-image: none;
+ }
+}
diff --git a/themes/pmahomme/scss/_variables.scss b/themes/pmahomme/scss/_variables.scss
index 15d8ce9b28..4b423c6def 100644
--- a/themes/pmahomme/scss/_variables.scss
+++ b/themes/pmahomme/scss/_variables.scss
@@ -117,6 +117,14 @@ $navbar-light-hover-color: #235a81;
$navbar-light-active-color: #235a81;
$navbar-light-disabled-color: #235a81;
+// Pagination
+
+$pagination-active-color: #235a81;
+$pagination-border-color: #aaa;
+$pagination-hover-border-color: #aaa;
+$pagination-active-border-color: #aaa;
+$pagination-disabled-border-color: #aaa;
+
// Card
$card-border-color: #aaa;
diff --git a/themes/pmahomme/scss/theme.scss b/themes/pmahomme/scss/theme.scss
index 99d9f218d2..b16eddf702 100644
--- a/themes/pmahomme/scss/theme.scss
+++ b/themes/pmahomme/scss/theme.scss
@@ -18,6 +18,7 @@
@import "navbar";
@import "card";
@import "breadcrumb";
+@import "pagination";
@import "alert";
@import "list-group";
@import "modal";