IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2024-11-27 19:20:21 -06:00
Code Issues Packages Projects Releases Wiki Activity

Ensure the dashboard tabs are styles correctly. Fixes #3824

Browse Source
This commit is contained in:
Murtuza Zabuawala 2018-12-20 09:53:35 +00:00 committed by Dave Page
parent cb880678cc
commit ed01dbd0ef
3 changed files with 27 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/pgadmin/dashboard/templates/dashboard/database_dashboard.html
View File

@ -65,14 +65,17 @@
<div class="dashboard-tab-container"> <div class="dashboard-tab-container">
<!-- Nav tabs --> <!-- Nav tabs -->
<ul class="nav nav-tabs dashboard-tab-panel" role="tablist"> <ul class="nav nav-tabs dashboard-tab-panel" role="tablist">
<li role="presentation" class="active dashboard-tab"><a href="#tab_panel_database_activity" <li role="presentation" class="nav-item dashboard-tab"><a href="#tab_panel_database_activity"
class="nav-link active"
aria-controls="tab_database_activity" aria-controls="tab_database_activity"
role="tab" data-toggle="tab">{{ _('Sessions') }}</a> role="tab" data-toggle="tab">{{ _('Sessions') }}</a>
</li> </li>
<li role="presentation" class="dashboard-tab"><a href="#tab_panel_database_locks" <li role="presentation" class="nav-item dashboard-tab"><a href="#tab_panel_database_locks"
class="nav-link"
aria-controls="tab_database_locks" role="tab" aria-controls="tab_database_locks" role="tab"
data-toggle="tab">{{ _('Locks') }}</a></li> data-toggle="tab">{{ _('Locks') }}</a></li>
<li role="presentation" class="dashboard-tab"><a href="#tab_panel_database_prepared" <li role="presentation" class="nav-item dashboard-tab"><a href="#tab_panel_database_prepared"
class="nav-link"
aria-controls="tab_database_prepared" role="tab" aria-controls="tab_database_prepared" role="tab"
data-toggle="tab">{{ _('Prepared Transactions') }}</a></li> data-toggle="tab">{{ _('Prepared Transactions') }}</a></li>
</ul> </ul>

12
web/pgadmin/dashboard/templates/dashboard/server_dashboard.html
View File

@ -65,17 +65,21 @@
<div class="dashboard-tab-container"> <div class="dashboard-tab-container">
<!-- Nav tabs --> <!-- Nav tabs -->
<ul class="nav nav-tabs dashboard-tab-panel" role="tablist"> <ul class="nav nav-tabs dashboard-tab-panel" role="tablist">
<li role="presentation" class="active dashboard-tab"><a href="#tab_panel_server_activity" <li role="presentation" class="nav-item dashboard-tab"><a href="#tab_panel_server_activity"
class="nav-link active"
aria-controls="tab_server_activity" aria-controls="tab_server_activity"
role="tab" data-toggle="tab">{{ _('Sessions') }}</a> role="tab" data-toggle="tab">{{ _('Sessions') }}</a>
</li> </li>
<li role="presentation" class="dashboard-tab"><a href="#tab_panel_server_locks" <li role="presentation" class="nav-item dashboard-tab"><a href="#tab_panel_server_locks"
class="nav-link"
aria-controls="tab_server_locks" role="tab" aria-controls="tab_server_locks" role="tab"
data-toggle="tab">{{ _('Locks') }}</a></li> data-toggle="tab">{{ _('Locks') }}</a></li>
<li role="presentation" class="dashboard-tab"><a href="#tab_panel_server_prepared" <li role="presentation" class="nav-item dashboard-tab"><a href="#tab_panel_server_prepared"
class="nav-link"
aria-controls="tab_server_prepared" role="tab" aria-controls="tab_server_prepared" role="tab"
data-toggle="tab">{{ _('Prepared Transactions') }}</a></li> data-toggle="tab">{{ _('Prepared Transactions') }}</a></li>
<li role="presentation" class="dashboard-tab"><a href="#tab_panel_server_config" <li role="presentation" class="nav-item dashboard-tab"><a href="#tab_panel_server_config"
class="nav-link"
aria-controls="tab_server_config" role="tab" aria-controls="tab_server_config" role="tab"
data-toggle="tab">{{ _('Configuration') }}</a></li> data-toggle="tab">{{ _('Configuration') }}</a></li>
</ul> </ul>

15
web/pgadmin/static/scss/_bootstrap.overrides.scss
View File

@ -219,8 +219,11 @@ td.switch-cell > div.bootstrap-switch {
} }
} }
.nav-tabs>.nav-item>.nav-link.active { /* If Bootstrap tab is already active then don't show pointer cursor */
.nav-tabs > .nav-item > .nav-link.active {
color: $color-fg; color: $color-fg;
background-color: $color-fg-inverse;
cursor: default;
} }
.bootstrap-datetimepicker-widget td, .bootstrap-datetimepicker-widget th { .bootstrap-datetimepicker-widget td, .bootstrap-datetimepicker-widget th {
@ -257,4 +260,12 @@ td.switch-cell > div.bootstrap-switch {
.bootstrap-datetimepicker-widget thead th { .bootstrap-datetimepicker-widget thead th {
background-color: $color-fg-inverse; background-color: $color-fg-inverse;
} }
.nav-tabs {
background-color: $color-gray-lighter;
}
.nav-tabs > .nav-item > .nav-link:hover:not(.active) {
background-color: $color-gray-white;
}