From 0b1a743fa0944bf5ff26be7bfce5034835139bf1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maur=C3=ADcio=20Meneghini=20Fauth?= Date: Fri, 16 Jun 2023 18:24:20 -0300 Subject: [PATCH] Fix select all arrow image dark color issue with Bootstrap theme MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replaces RTL images with CSS transformation. - Fixes https://github.com/phpmyadmin/phpmyadmin/issues/18368 Co-authored-by: Liviu-Mihail Concioiu Signed-off-by: Maurício Meneghini Fauth --- public/themes/bootstrap/img/arrow_rtl.png | Bin 102 -> 0 bytes .../bootstrap/img/dark/select-all-arrow.svg | 1 + .../themes/bootstrap/img/select-all-arrow.svg | 1 + public/themes/bootstrap/scss/_common.scss | 5 ----- public/themes/bootstrap/scss/_icons.scss | 16 ++++++++++++++++ public/themes/metro/img/arrow_rtl.png | Bin 145 -> 0 bytes .../img/{arrow_ltr.png => select-all-arrow.png} | Bin public/themes/metro/scss/_common.scss | 5 ----- public/themes/metro/scss/_icons.scss | 12 ++++++++++++ public/themes/original/img/arrow_rtl.png | Bin 102 -> 0 bytes .../img/select-all-arrow.png} | Bin public/themes/original/scss/_common.scss | 5 ----- public/themes/original/scss/_icons.scss | 12 ++++++++++++ public/themes/pmahomme/img/arrow_ltr.png | Bin 101 -> 0 bytes public/themes/pmahomme/img/arrow_rtl.png | Bin 102 -> 0 bytes .../img/select-all-arrow.png} | Bin public/themes/pmahomme/scss/_common.scss | 5 ----- public/themes/pmahomme/scss/_icons.scss | 12 ++++++++++++ templates/database/privileges/index.twig | 3 +-- .../database/structure/check_all_tables.twig | 2 +- templates/display/results/table.twig | 2 +- templates/select_all.twig | 3 +-- templates/server/privileges/users_overview.twig | 3 +-- templates/table/privileges/index.twig | 3 +-- 24 files changed, 60 insertions(+), 30 deletions(-) delete mode 100644 public/themes/bootstrap/img/arrow_rtl.png create mode 100644 public/themes/bootstrap/img/dark/select-all-arrow.svg create mode 100644 public/themes/bootstrap/img/select-all-arrow.svg delete mode 100644 public/themes/metro/img/arrow_rtl.png rename public/themes/metro/img/{arrow_ltr.png => select-all-arrow.png} (100%) delete mode 100644 public/themes/original/img/arrow_rtl.png rename public/themes/{bootstrap/img/arrow_ltr.png => original/img/select-all-arrow.png} (100%) delete mode 100644 public/themes/pmahomme/img/arrow_ltr.png delete mode 100644 public/themes/pmahomme/img/arrow_rtl.png rename public/themes/{original/img/arrow_ltr.png => pmahomme/img/select-all-arrow.png} (100%) diff --git a/public/themes/bootstrap/img/arrow_rtl.png b/public/themes/bootstrap/img/arrow_rtl.png deleted file mode 100644 index d035b9d9bafeaacccfe344089d74c223836c0f89..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 102 zcmeAS@N?(olHy`uVBq!ia0vp^YCtT;!2%@N{M0&tl&+_XV@L&KvP9bhd(mDd$5oQ9 zx{v=UI|FIk^Z(?3+>kNNxw7HE%Atd7Zj20v{Vk90;}T5*YGm+q^>bP0l+XkKx(6KT diff --git a/public/themes/bootstrap/img/dark/select-all-arrow.svg b/public/themes/bootstrap/img/dark/select-all-arrow.svg new file mode 100644 index 0000000000..95ff9c425a --- /dev/null +++ b/public/themes/bootstrap/img/dark/select-all-arrow.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/themes/bootstrap/img/select-all-arrow.svg b/public/themes/bootstrap/img/select-all-arrow.svg new file mode 100644 index 0000000000..bd3fa07057 --- /dev/null +++ b/public/themes/bootstrap/img/select-all-arrow.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/themes/bootstrap/scss/_common.scss b/public/themes/bootstrap/scss/_common.scss index b68b15e007..0a5bd64c8f 100644 --- a/public/themes/bootstrap/scss/_common.scss +++ b/public/themes/bootstrap/scss/_common.scss @@ -153,11 +153,6 @@ td .icon { margin: 0; } -.selectallarrow { - margin-right: 0.3em; - margin-left: 0.6em; -} - .with-selected { margin-left: 2em; } diff --git a/public/themes/bootstrap/scss/_icons.scss b/public/themes/bootstrap/scss/_icons.scss index ac18d57616..4e87129847 100644 --- a/public/themes/bootstrap/scss/_icons.scss +++ b/public/themes/bootstrap/scss/_icons.scss @@ -4,6 +4,7 @@ padding: 0 !important; width: 16px; height: 16px; + background-repeat: no-repeat; } .icon_fulltext { @@ -11,6 +12,17 @@ height: 19px; } +.ic_select_all_arrow { + width: 38px; + height: 22px; + margin-right: 1rem; + background-image: url('../img/select-all-arrow.svg'); + + &[dir=rtl] { + transform: scaleX(-1); + } +} + .ic_asc_order { background-image: url('../img/asc_order.png'); } @@ -682,6 +694,10 @@ } @include color-mode(dark) { + .ic_select_all_arrow { + background-image: url('../img/dark/select-all-arrow.svg'); + } + .ic_asc_order { background-image: url('../img/asc_order.png'); } diff --git a/public/themes/metro/img/arrow_rtl.png b/public/themes/metro/img/arrow_rtl.png deleted file mode 100644 index 5005524788b73c0d917b63a534ef106976e24f05..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 145 zcmeAS@N?(olHy`uVBq!ia0vp^YCtT;!2~3gRVzb)6kADYQr;B4q z#jWH73D%URHEVQiHuY@ToPTRe=9djZXX_(!Q%q$kI^IAH-J!_po6m(OU~egm28>FVdQ&MBb@0QEU8=>Px# diff --git a/public/themes/metro/img/arrow_ltr.png b/public/themes/metro/img/select-all-arrow.png similarity index 100% rename from public/themes/metro/img/arrow_ltr.png rename to public/themes/metro/img/select-all-arrow.png diff --git a/public/themes/metro/scss/_common.scss b/public/themes/metro/scss/_common.scss index c35f3f9c98..62d3868043 100644 --- a/public/themes/metro/scss/_common.scss +++ b/public/themes/metro/scss/_common.scss @@ -472,11 +472,6 @@ img.lightbulb { color: inherit !important; } -.selectallarrow { - margin-right: 0.3em; - margin-left: 0.6em; -} - .with-selected { margin-left: 2em; } diff --git a/public/themes/metro/scss/_icons.scss b/public/themes/metro/scss/_icons.scss index ae6a62681a..6b74201a63 100644 --- a/public/themes/metro/scss/_icons.scss +++ b/public/themes/metro/scss/_icons.scss @@ -4,6 +4,7 @@ padding: 0 !important; width: 16px; height: 16px; + background-repeat: no-repeat; } .icon_fulltext { @@ -11,6 +12,17 @@ height: 19px; } +.ic_select_all_arrow { + width: 38px; + height: 22px; + margin-right: 1rem; + background-image: url('../img/select-all-arrow.png'); + + &[dir=rtl] { + transform: scaleX(-1); + } +} + .ic_asc_order { background-image: url('../img/asc_order.png'); } diff --git a/public/themes/original/img/arrow_rtl.png b/public/themes/original/img/arrow_rtl.png deleted file mode 100644 index d035b9d9bafeaacccfe344089d74c223836c0f89..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 102 zcmeAS@N?(olHy`uVBq!ia0vp^YCtT;!2%@N{M0&tl&+_XV@L&KvP9bhd(mDd$5oQ9 zx{v=UI|FIk^Z(?3+>kNNxw7HE%Atd7Zj20v{Vk90;}T5*YGm+q^>bP0l+XkKx(6KT diff --git a/public/themes/bootstrap/img/arrow_ltr.png b/public/themes/original/img/select-all-arrow.png similarity index 100% rename from public/themes/bootstrap/img/arrow_ltr.png rename to public/themes/original/img/select-all-arrow.png diff --git a/public/themes/original/scss/_common.scss b/public/themes/original/scss/_common.scss index e0e3b97c4a..a1265ef261 100644 --- a/public/themes/original/scss/_common.scss +++ b/public/themes/original/scss/_common.scss @@ -177,11 +177,6 @@ img.lightbulb { background-position: center; } -.selectallarrow { - margin-right: 0.3em; - margin-left: 0.6em; -} - .with-selected { margin-left: 2em; } diff --git a/public/themes/original/scss/_icons.scss b/public/themes/original/scss/_icons.scss index c71a86c55a..9735a03fde 100644 --- a/public/themes/original/scss/_icons.scss +++ b/public/themes/original/scss/_icons.scss @@ -4,6 +4,7 @@ padding: 0 !important; width: 16px; height: 16px; + background-repeat: no-repeat; } .icon_fulltext { @@ -11,6 +12,17 @@ height: 19px; } +.ic_select_all_arrow { + width: 38px; + height: 22px; + margin-right: 1rem; + background-image: url('../img/select-all-arrow.png'); + + &[dir=rtl] { + transform: scaleX(-1); + } +} + .ic_asc_order { background-image: url('../../pmahomme/img/asc_order.png'); } diff --git a/public/themes/pmahomme/img/arrow_ltr.png b/public/themes/pmahomme/img/arrow_ltr.png deleted file mode 100644 index cd79ab42f04a594dbf727e34795009f3e99fb62e..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 101 zcmeAS@N?(olHy`uVBq!ia0vp^YCtT;!2%@N{M0&tl#Zv1V@L&KvP94Wd(mDdM=eR# z<`9#vqR0OhJFjv(Fu^eA%7(zh9xctRJxmPTewN2A?=GnX>SOS9^>bP0l+XkKYlIuC diff --git a/public/themes/pmahomme/img/arrow_rtl.png b/public/themes/pmahomme/img/arrow_rtl.png deleted file mode 100644 index d035b9d9bafeaacccfe344089d74c223836c0f89..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 102 zcmeAS@N?(olHy`uVBq!ia0vp^YCtT;!2%@N{M0&tl&+_XV@L&KvP9bhd(mDd$5oQ9 zx{v=UI|FIk^Z(?3+>kNNxw7HE%Atd7Zj20v{Vk90;}T5*YGm+q^>bP0l+XkKx(6KT diff --git a/public/themes/original/img/arrow_ltr.png b/public/themes/pmahomme/img/select-all-arrow.png similarity index 100% rename from public/themes/original/img/arrow_ltr.png rename to public/themes/pmahomme/img/select-all-arrow.png diff --git a/public/themes/pmahomme/scss/_common.scss b/public/themes/pmahomme/scss/_common.scss index 399cbe3226..4c1905e796 100644 --- a/public/themes/pmahomme/scss/_common.scss +++ b/public/themes/pmahomme/scss/_common.scss @@ -354,11 +354,6 @@ img.lightbulb { color: inherit !important; } -.selectallarrow { - margin-right: 0.3em; - margin-left: 0.6em; -} - .with-selected { margin-left: 2em; } diff --git a/public/themes/pmahomme/scss/_icons.scss b/public/themes/pmahomme/scss/_icons.scss index d87b79098d..3ee3880be5 100644 --- a/public/themes/pmahomme/scss/_icons.scss +++ b/public/themes/pmahomme/scss/_icons.scss @@ -4,6 +4,7 @@ padding: 0 !important; width: 16px; height: 16px; + background-repeat: no-repeat; } .icon_fulltext { @@ -11,6 +12,17 @@ height: 19px; } +.ic_select_all_arrow { + width: 38px; + height: 22px; + margin-right: 1rem; + background-image: url('../img/select-all-arrow.png'); + + &[dir=rtl] { + transform: scaleX(-1); + } +} + .ic_asc_order { background-image: url('../img/asc_order.png'); } diff --git a/templates/database/privileges/index.twig b/templates/database/privileges/index.twig index b3a38ad106..5fb6705d44 100644 --- a/templates/database/privileges/index.twig +++ b/templates/database/privileges/index.twig @@ -108,8 +108,7 @@
- - {%- trans 'With selected:' %} + {{ get_image('select_all_arrow', 'With selected:'|trans, { 'dir': text_dir, 'width': '38', 'height': '22' }) }} {% trans 'With selected:' %} diff --git a/templates/database/structure/check_all_tables.twig b/templates/database/structure/check_all_tables.twig index 3a5a0c68c7..92b3539696 100644 --- a/templates/database/structure/check_all_tables.twig +++ b/templates/database/structure/check_all_tables.twig @@ -1,5 +1,5 @@
- {% trans 'With selected:' %} + {{ get_image('select_all_arrow', 'With selected:'|trans, { 'dir': text_dir, 'width': '38', 'height': '22' }) }} {% if overhead_check != '' %} diff --git a/templates/display/results/table.twig b/templates/display/results/table.twig index 24d13ed343..cbcb006390 100644 --- a/templates/display/results/table.twig +++ b/templates/display/results/table.twig @@ -311,7 +311,7 @@ {% if has_bulk_links %}
- {% trans 'With selected:' %} + {{ get_image('select_all_arrow', 'With selected:'|trans, { 'dir': text_dir, 'width': '38', 'height': '22' }) }} {% trans 'With selected:' %} diff --git a/templates/select_all.twig b/templates/select_all.twig index 11ef160954..e9e1e708fd 100644 --- a/templates/select_all.twig +++ b/templates/select_all.twig @@ -1,5 +1,4 @@ -{% trans 'With selected:' %} +{{ get_image('select_all_arrow', 'With selected:'|trans, { 'dir': text_dir, 'width': '38', 'height': '22' }) }} diff --git a/templates/server/privileges/users_overview.twig b/templates/server/privileges/users_overview.twig index c509438050..9c26a7fa57 100644 --- a/templates/server/privileges/users_overview.twig +++ b/templates/server/privileges/users_overview.twig @@ -116,8 +116,7 @@
- {% trans 'With selected:' %} + {{ get_image('select_all_arrow', 'With selected:'|trans, { 'dir': text_dir, 'width': '38', 'height': '22' }) }} {% trans 'With selected:' %} diff --git a/templates/table/privileges/index.twig b/templates/table/privileges/index.twig index 393f743ba3..5bef29e515 100644 --- a/templates/table/privileges/index.twig +++ b/templates/table/privileges/index.twig @@ -112,8 +112,7 @@
- - {%- trans 'With selected:' %} + {{ get_image('select_all_arrow', 'With selected:'|trans, { 'dir': text_dir, 'width': '38', 'height': '22' }) }} {% trans 'With selected:' %}