webapp/phpmyadmin
1
0
Fork 0
mirror of https://github.com/phpmyadmin/phpmyadmin.git synced 2026-10-23 18:29:15 +03:00
Code Activity

Change recent/favorite buttons to use Bootstrap dropdowns

Browse Source 
This removes a lot of custom CSS.

Signed-off-by: Maurício Meneghini Fauth <mauricio@fauth.dev>
This commit is contained in:
Maurício Meneghini Fauth
2024-04-13 01:41:27 -03:00
parent 89619f386b
commit a921326245
10 changed files with 50 additions and 383 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
public/themes/bootstrap/scss/_navigation.scss
View File

@@ -37,8 +37,6 @@
#pmalogo,
#serverChoice,
#navipanellinks,
#recentTableList,
#favoriteTableList,
#databaseList,
div.pageselector.dbselector {
text-align: center;
@@ -64,15 +62,6 @@
#navipanellinks .icon {
margin: 0;
}
#recentTable,
#favoriteTable {
width: 200px;
}
#favoriteTableList select {
width: 80%;
}
}
@include color-mode(dark) {
@@ -405,70 +394,6 @@ li.fast_filter {
}
}
// Quick warp links
.pma_quick_warp {
margin-top: 5px;
margin-left: 2px;
position: relative;
.drop_list {
float: left;
margin-left: 3px;
padding: 2px 0;
&:hover {
ul {
display: block;
}
}
ul {
position: absolute;
margin: 0;
padding: 0;
overflow: hidden;
overflow-y: auto;
list-style: none;
background: $white;
border: 1px solid #ddd;
border-radius: 0.3em;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
box-shadow: 0 0 5px #ccc;
top: 100%;
left: 3px;
right: 0;
display: none;
z-index: 802;
}
li {
white-space: nowrap;
padding: 0;
border-radius: 0;
img {
vertical-align: sub;
}
&:hover {
background: #f2f2f2;
}
}
a {
display: block;
padding: 0.2em 0.3em;
&.favorite_table_anchor {
clear: left;
float: left;
padding: 0.1em 0.3em 0;
}
}
}
}
@include color-mode(dark) {
#pma_navigation_tree {
li {
@@ -479,18 +404,6 @@ li.fast_filter {
}
}
}
.pma_quick_warp {
ul {
background-color: var(--#{$prefix}body-bg);
}
li {
&:hover {
background: $gray-800;
}
}
}
}
#floating_menubar {

81
public/themes/metro/scss/_navigation.scss
View File

@@ -90,15 +90,6 @@
display: none;
}
#recentTableList {
text-align: center;
padding: 10px;
select {
min-width: 100%;
}
}
#databaseList {
text-align: center;
margin: 10px;
@@ -458,78 +449,6 @@ li.fast_filter {
z-index: 801;
}
/* Quick warp links */
.pma_quick_warp {
margin-top: 5px;
margin-left: 10px;
position: relative;
.drop_list {
float: left;
margin-left: 3px;
padding: 2px 0;
}
.drop_button {
padding: 0.2em 0.5em;
border: 1px solid #ddd;
background: #f2f2f2;
cursor: pointer;
color: #333;
}
.drop_list {
&:hover .drop_button {
background: #fff;
color: #333;
}
ul {
position: absolute;
margin: 0;
padding: 0;
overflow: hidden;
overflow-y: auto;
list-style: none;
background: #fff;
border: 1px solid #ddd;
top: 100%;
left: 3px;
right: 0;
display: none;
z-index: 802;
}
&:hover ul {
display: block;
}
li {
white-space: nowrap;
padding: 0;
img {
vertical-align: sub;
}
&:hover {
background: #f2f2f2;
}
}
a {
display: block;
padding: 0.2em 0.3em;
&.favorite_table_anchor {
clear: left;
float: left;
padding: 0.1em 0.3em 0;
}
}
}
}
#floating_menubar {
z-index: 99;
}

91
public/themes/original/scss/_navigation.scss
View File

@@ -51,24 +51,11 @@
background-color: $navi-background;
padding: 0.3em;
}
&#recentTableList,
&#FavoriteTableList {
text-align: center;
margin-bottom: 0.5em;
}
}
#recentTable,
#FavoriteTable {
width: 200px;
}
#pmalogo,
#serverChoice,
#navipanellinks,
#recentTableList,
#FavoriteTableList,
#databaseList,
div.pageselector.dbselector {
text-align: center;
@@ -81,17 +68,9 @@
margin: 0;
}
#recentTableList select,
#FavoriteTableList select,
#serverChoice select {
width: 80%;
}
#recentTableList,
#FavoriteTableList {
margin-bottom: 0;
padding-bottom: 0;
}
}
#pma_navigation_content > img.throbber {
@@ -387,76 +366,6 @@ li.fast_filter {
padding-right: 23px;
}
.pma_quick_warp {
margin-top: 5px;
margin-left: 2px;
position: relative;
.drop_list {
float: left;
margin-left: 3px;
padding: 2px 0;
}
.drop_button {
padding: 0 0.3em;
border: 1px solid #ddd;
background: #f2f2f2;
cursor: pointer;
}
.drop_list {
&:hover .drop_button {
background: #fff;
}
ul {
position: absolute;
margin: 0;
padding: 0;
overflow: hidden;
overflow-y: auto;
list-style: none;
background: #fff;
border: 1px solid #ddd;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
top: 100%;
left: 3px;
right: 0;
display: none;
z-index: 802;
}
&:hover ul {
display: block;
}
li {
white-space: nowrap;
img {
vertical-align: sub;
}
&:hover {
background: #f2f2f2;
}
}
a {
display: block;
padding: 0.1em 0.3em;
&.favorite_table_anchor {
clear: left;
float: left;
padding: 0.1em 0.3em 0;
}
}
}
}
#floating_menubar {
z-index: 99;
}

84
public/themes/pmahomme/scss/_navigation.scss
View File

@@ -38,8 +38,6 @@
#pmalogo,
#serverChoice,
#navipanellinks,
#recentTableList,
#favoriteTableList,
#databaseList,
div.pageselector.dbselector {
text-align: center;
@@ -51,12 +49,6 @@
margin: 0;
}
#recentTable,
#favoriteTable {
width: 200px;
}
#favoriteTableList select,
#serverChoice select {
width: 80%;
}
@@ -386,82 +378,6 @@ li.fast_filter {
border: 1px solid #888;
}
// Quick warp links
.pma_quick_warp {
margin-top: 5px;
margin-left: 2px;
position: relative;
.drop_list {
float: left;
margin-left: 3px;
padding: 2px 0;
&:hover {
.drop_button {
background: #fff;
}
ul {
display: block;
}
}
ul {
position: absolute;
margin: 0;
padding: 0;
overflow: hidden;
overflow-y: auto;
list-style: none;
background: #fff;
border: 1px solid #ddd;
border-radius: 0.3em;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
box-shadow: 0 0 5px #ccc;
top: 100%;
left: 3px;
right: 0;
display: none;
z-index: 802;
}
li {
white-space: nowrap;
padding: 0;
border-radius: 0;
img {
vertical-align: sub;
}
&:hover {
background: #f2f2f2;
}
}
a {
display: block;
padding: 0.2em 0.3em;
&.favorite_table_anchor {
clear: left;
float: left;
padding: 0.1em 0.3em 0;
}
}
}
.drop_button {
padding: 0.3em;
border: 1px solid #ddd;
border-radius: 0.3em;
background: #f2f2f2;
cursor: pointer;
}
}
#floating_menubar {
z-index: 99;
}

4
resources/js/src/modules/functions.ts
View File

@@ -3133,7 +3133,7 @@ function onloadRecentFavoriteTables (): void {
{ 'no_debug': true },
function (data) {
if (typeof data !== 'undefined' && data.success === true) {
$('#pma_recent_list').html(data.list);
$('#recentTableList').html(data.list);
}
}
);
@@ -3170,7 +3170,7 @@ function onloadRecentFavoriteTables (): void {
window.localStorage.favoriteTables = data.favoriteTables;
}
$('#pma_favorite_list').html(data.list);
$('#favoriteTableList').html(data.list);
}
});
}

2
resources/js/src/modules/navigation/event-loader.ts
View File

@@ -282,7 +282,7 @@ export default function onloadNavigation () {
},
success: function (data) {
if (data.changes) {
$('#pma_favorite_list').html(data.list);
$('#favoriteTableList').html(data.list);
$('#' + anchorId).parent().html(data.anchor);
tooltip($('#' + anchorId), 'a', $('#' + anchorId).attr('title'));
// Update localStorage.

44
resources/templates/navigation/tree/quick_warp.twig
View File

@@ -1,21 +1,25 @@
<div class="pma_quick_warp">
{% if recent is not empty %}
<div class="drop_list">
<button title="{{ 'Recent tables'|trans }}" class="drop_button btn btn-sm btn-outline-secondary">{{ 'Recent'|trans }}</button>
<ul id="pma_recent_list">
{{ recent|raw }}
</ul>
</div>
{% endif %}
{% if recent is not empty or favorite is not empty %}
<div class="row g-1 my-3 mx-1" id="recentFavoriteTablesWrapper">
{% if recent is not empty %}
<div class="col-auto dropdown">
<button title="{{ 'Recently visited tables'|trans }}" class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
{{- 'Recent'|trans -}}
</button>
<ul class="dropdown-menu" id="recentTableList">
{{ recent|raw }}
</ul>
</div>
{% endif %}
{% if favorite is not empty %}
<div class="drop_list">
<button title="{{ 'Favorite tables'|trans }}" class="drop_button btn btn-sm btn-outline-secondary">{{ 'Favorites'|trans }}</button>
<ul id="pma_favorite_list">
{{ favorite|raw }}
</ul>
</div>
{% endif %}
<div class="clearfloat"></div>
</div>
{% if favorite is not empty %}
<div class="col-auto dropdown">
<button title="{{ 'Favorite tables'|trans }}" class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
{{- 'Favorites'|trans -}}
</button>
<ul class="dropdown-menu" id="favoriteTableList">
{{ favorite|raw }}
</ul>
</div>
{% endif %}
</div>
{% endif %}

30
resources/templates/recent_favorite_table_favorite.twig
View File

@@ -1,19 +1,23 @@
{% if tables is empty %}
{{ 'There are no favorite tables.'|trans }}
<li>
<span class="dropdown-item-text">{{ 'There are no favorite tables.'|trans }}</span>
</li>
{% else %}
{% for table in tables %}
<li class="warp_link">
<a
class="ajax favorite_table_anchor"
href="{{ url('/database/structure/favorite-table', table.remove_parameters) }}"
title="{% trans 'Remove from Favorites' %}"
data-favtargetn="{{ table.table_parameters.md5 }}"
>
{{ get_icon('b_favorite') }}
</a>
<a class="disableAjax" href="{{ url('/table/recent-favorite', table.table_parameters) }}">
`{{ table.table_parameters.db }}`.`{{ table.table_parameters.table }}`
</a>
<li>
<span class="dropdown-item">
<a
class="ajax favorite_table_anchor me-2"
href="{{ url('/database/structure/favorite-table', table.remove_parameters) }}"
title="{% trans 'Remove from Favorites' %}"
data-favtargetn="{{ table.table_parameters.md5 }}"
>
{{ get_icon('b_favorite') }}
</a>
<a class="disableAjax" href="{{ url('/table/recent-favorite', table.table_parameters) }}">
`{{ table.table_parameters.db }}`.`{{ table.table_parameters.table }}`
</a>
</span>
</li>
{% endfor %}
{% endif %}

8
resources/templates/recent_favorite_table_recent.twig
View File

@@ -1,9 +1,11 @@
{% if tables is empty %}
{{ 'There are no recent tables.'|trans }}
<li>
<span class="dropdown-item-text">{{ 'There are no recent tables.'|trans }}</span>
</li>
{% else %}
{% for table in tables %}
<li class="warp_link">
<a class="disableAjax" href="{{ url('/table/recent-favorite', table) }}">
<li>
<a class="dropdown-item disableAjax" href="{{ url('/table/recent-favorite', table) }}">
`{{ table.db }}`.`{{ table.table }}`
</a>
</li>

2
tests/unit/Navigation/NavigationTreeTest.php
View File

@@ -62,7 +62,7 @@ class NavigationTreeTest extends AbstractTestCase
public function testRenderState(): void
{
$result = $this->object->renderState(new UserPrivileges());
self::assertStringContainsString('pma_quick_warp', $result);
self::assertStringContainsString('recentFavoriteTablesWrapper', $result);
}
/**