diff --git a/js/config.js b/js/config.js index c7c6c7a4d9..d94f886ebb 100644 --- a/js/config.js +++ b/js/config.js @@ -785,7 +785,7 @@ AJAX.registerOnload('config.js', function () { $(document).on('click', 'div.click-hide-message', function () { $(this) .hide() - .parent('.group') + .parent('.card-body') .css('height', '') .next('form') .show(); @@ -818,7 +818,7 @@ function savePrefsToLocalStorage (form) { updatePrefsDate(); $('div.localStorage-empty').hide(); $('div.localStorage-exists').show(); - var group = $form.parent('.group'); + var group = $form.parent('.card-body'); group.css('height', group.height() + 'px'); $form.hide('fast'); $form.prev('.click-hide-message').show('fast'); diff --git a/templates/home/index.twig b/templates/home/index.twig index a24bbd9a6f..f136bc0b85 100644 --- a/templates/home/index.twig +++ b/templates/home/index.twig @@ -10,23 +10,28 @@ {{ sync_favorite_tables|raw }}
-
+
{% if has_server %} {% if is_demo %} -
-

{% trans 'phpMyAdmin Demo Server' %}

-

+

+
+ {% trans 'phpMyAdmin Demo Server' %} +
+
{% filter format('demo.phpmyadmin.net')|raw %} {% trans %} You are using the demo server. You can do anything here, but please do not change root, debian-sys-maint and pma users. More information is available at %s. {% endtrans %} {% endfilter %} -

+
{% endif %} -
-

{% trans 'General settings' %}

+
+
+ {% trans 'General settings' %} +
+
    {% if has_server_selection %}
  • @@ -66,11 +71,15 @@ {% endif %} {{ user_preferences is not empty ? user_preferences|raw }}
+
{% endif %} -
-

{% trans 'Appearance settings' %}

+
+
+ {% trans 'Appearance settings' %} +
+
    {% if language_selector is not empty %}
  • @@ -86,13 +95,17 @@
    • {% endif %}
+
-
+
{% if database_server is not empty %} -
-

{% trans 'Database server' %}

+
+
+ {% trans 'Database server' %} +
+
  • {% trans 'Server:' %} @@ -125,12 +138,16 @@
+
{% endif %} {% if web_server is not empty or php_info is not empty %} -
-

{% trans 'Web server' %}

+
+
+ {% trans 'Web server' %} +
+
    {% if web_server is not empty %}
  • @@ -156,11 +173,15 @@ {{ php_info|raw }} {% endif %}
+
{% endif %} -
-

phpMyAdmin

+
+
+ phpMyAdmin +
+
  • {% trans 'Version information:' %} @@ -197,6 +218,7 @@
+
diff --git a/templates/preferences/manage/main.twig b/templates/preferences/manage/main.twig index 4b9dba48a2..b72e0a8e12 100644 --- a/templates/preferences/manage/main.twig +++ b/templates/preferences/manage/main.twig @@ -5,10 +5,13 @@
-
-
-

{% trans 'Import' %}

-
+
+
+ {% trans 'Import' %} +
+
+ {{ generate_hidden_max_file_size(max_upload_size) }} {{ get_hidden_inputs() }} @@ -42,27 +45,33 @@

+
{% if exists_setup_and_not_exists_config %} {# show only if setup script is available, allows to disable this message #} {# by simply removing setup directory #} {# Also do not show in config exists (and setup would refuse to work) #} -
-

{% trans 'More settings' %}

-
- {{ 'You can set more settings by modifying config.inc.php, eg. by using %sSetup script%s.'|trans|format('','')|raw }} - {{ show_docu('setup', 'setup-script') }} -
+
+
+ {% trans 'More settings' %} +
+
+ {{ 'You can set more settings by modifying config.inc.php, eg. by using %sSetup script%s.'|trans|format('','')|raw }} + {{ show_docu('setup', 'setup-script') }} +
{% endif %}
-
-
-

{% trans 'Export' %}

-
+
+
+
+ {% trans 'Export' %} +
+
+
{{ 'Configuration has been saved.'|trans|raw_success }}
-
{{ get_hidden_inputs() }}
@@ -98,16 +107,21 @@
+
-
-

{% trans 'Reset' %}

-
+
+ {% trans 'Reset' %} +
+
+ {{ get_hidden_inputs() }} {% trans 'You can reset all your settings and restore them to default values.' %}

+
diff --git a/templates/preferences/two_factor/configure.twig b/templates/preferences/two_factor/configure.twig index 6bf74a309b..064145bb39 100644 --- a/templates/preferences/two_factor/configure.twig +++ b/templates/preferences/two_factor/configure.twig @@ -1,11 +1,17 @@ -
-

{% trans "Configure two-factor authentication" %}

-
-
-{{ get_hidden_inputs() }} - -{{ form|raw }} - -
-
+
+
+
+
+ {% trans "Configure two-factor authentication" %} +
+
+
+ {{ get_hidden_inputs() }} + + {{ form|raw }} + +
+
+
+
diff --git a/templates/preferences/two_factor/confirm.twig b/templates/preferences/two_factor/confirm.twig index 6ebbbf7809..a5b013c9ac 100644 --- a/templates/preferences/two_factor/confirm.twig +++ b/templates/preferences/two_factor/confirm.twig @@ -1,12 +1,18 @@ -
-

{% trans "Confirm disabling two-factor authentication" %}

-
-
-{{ "By disabling two factor authentication you will be again able to login using password only."|trans|notice }} -{{ get_hidden_inputs() }} -{{ form|raw }} - - -
-
+
+
+
+
+ {% trans "Confirm disabling two-factor authentication" %} +
+
+
+ {{ "By disabling two factor authentication you will be again able to login using password only."|trans|notice }} + {{ get_hidden_inputs() }} + {{ form|raw }} + + +
+
+
+
diff --git a/templates/preferences/two_factor/main.twig b/templates/preferences/two_factor/main.twig index 95da6679d2..2b2b12fbaf 100644 --- a/templates/preferences/two_factor/main.twig +++ b/templates/preferences/two_factor/main.twig @@ -1,9 +1,11 @@ -
-

- {% trans "Two-factor authentication status" %} - {{ show_docu('two_factor') }} -

-
+
+
+
+
+ {% trans "Two-factor authentication status" %} + {{ show_docu('two_factor') }} +
+
{% if enabled %} {% if num_backends == 0 %}

{% trans "Two-factor authentication is not available, please install optional dependencies to enable authentication backends." %}

@@ -23,13 +25,19 @@ {% else %}

{% trans "Two-factor authentication is not available, enable phpMyAdmin configuration storage to use it." %}

{% endif %} +
+
{% if backend_id %} -
-

{{ backend_name }}

-
+
+
+
+
+ {{ backend_name }} +
+

{% trans "You have enabled two factor authentication." %}

{{ backend_description }}

@@ -37,12 +45,18 @@
+
+
{% elseif num_backends > 0 %} -
-

{% trans "Configure two-factor authentication" %}

-
+
+
+
+
+ {% trans "Configure two-factor authentication" %} +
+
{{ get_hidden_inputs() }} {% for backend in backends %} @@ -55,6 +69,8 @@ {% endfor %}
+
+
{% endif %} diff --git a/themes/bootstrap/scss/_common.scss b/themes/bootstrap/scss/_common.scss index e42cbe9512..8bea2bb484 100644 --- a/themes/bootstrap/scss/_common.scss +++ b/themes/bootstrap/scss/_common.scss @@ -1020,10 +1020,6 @@ label.col-3.d-flex.align-items-center { margin: 5px 2px; } -.cfg_dbg_demo { - margin: 0.5em 1em 0.5em 1em; -} - .central_columns_navigation { padding: 1.5% 0 !important; } @@ -2035,60 +2031,6 @@ div.sqlvalidate { background: $bg-one; } -#main_pane_left { - width: 60%; - min-width: 260px; - float: $left; - padding-top: 1em; -} - -#main_pane_right { - overflow: hidden; - min-width: 160px; - padding-top: 1em; -} - -.group { - border: 1px solid #999; - background: #f3f3f3; - -moz-border-radius: 4px; - -webkit-border-radius: 4px; - border-radius: 4px; - - @if $direction == rtl { - -moz-box-shadow: -2px 2px 5px #ccc; - -webkit-box-shadow: -2px 2px 5px #ccc; - box-shadow: -2px 2px 5px #ccc; - } @else { - -moz-box-shadow: 2px 2px 5px #ccc; - -webkit-box-shadow: 2px 2px 5px #ccc; - box-shadow: 2px 2px 5px #ccc; - } - - margin-bottom: 1em; - padding-bottom: 1em; - - h2 { - background-color: #bbb; - padding: 0.1em 0.3em; - margin-top: 0; - color: #fff; - font-size: 1.6em; - font-weight: normal; - text-shadow: 0 1px 0 #777; - -moz-box-shadow: 1px 1px 15px #999 inset; - -webkit-box-shadow: 1px 1px 15px #999 inset; - box-shadow: 1px 1px 15px #999 inset; - } -} - -.group-cnt { - padding: 0; - padding-#{$left}: 0.5em; - display: inline-block; - width: 98%; -} - textarea#partitiondefinition { height: 3em; } @@ -4132,11 +4074,6 @@ body .ui-dialog { } @media only screen and (max-width: 768px) { - // For mobile phones: - #main_pane_left { - width: 100%; - } - ul { &#topmenu, &.tabs { diff --git a/themes/metro/scss/_common.scss b/themes/metro/scss/_common.scss index cd94b590f8..3d2ed045ed 100644 --- a/themes/metro/scss/_common.scss +++ b/themes/metro/scss/_common.scss @@ -2195,44 +2195,6 @@ div.sqlvalidate, direction: ltr; } -#main_pane_left { - width: 60%; - min-width: 260px; - float: $left; - padding-top: 1em; -} - -#main_pane_right { - overflow: hidden; - min-width: 160px; - padding-top: 1em; - padding-#{$left}: 3em; -} - -.group { - margin-bottom: 1em; - padding-bottom: 1em; - - input[type="submit"] { - margin-#{$left}: 0; - } - - h2 { - color: $navi-background; - font-size: 2.8em; - font-weight: normal; - font-family: $font-family-light; - margin-top: 0; - margin-bottom: 0.6em; - } -} - -.group-cnt { - padding: 0 0 0 0.5em; - display: inline-block; - width: 98%; -} - textarea#partitiondefinition { height: 3em; } @@ -4306,3 +4268,15 @@ body { float: left; } } + +// Bootstrap + +.card-header { + font-size: 2.8em; + font-family: $font-family-light; + padding: 0; +} + +.card-body ul { + padding-#{$left}: 0; +} diff --git a/themes/metro/scss/_variables.scss b/themes/metro/scss/_variables.scss index 907ae8e5d6..6a3c95088a 100644 --- a/themes/metro/scss/_variables.scss +++ b/themes/metro/scss/_variables.scss @@ -162,3 +162,7 @@ $font-size-base: 0.8rem; $btn-border-radius: 0; $btn-line-height: 1; $btn-padding-x: 0.5rem; + +$card-border-width: 0; +$card-cap-color: $navi-background; +$card-cap-bg: $main-background; diff --git a/themes/original/scss/_common.scss b/themes/original/scss/_common.scss index 6fdb428c6c..7968609d2d 100644 --- a/themes/original/scss/_common.scss +++ b/themes/original/scss/_common.scss @@ -765,10 +765,6 @@ form.login label { margin: 5px 2px; } -.cfg_dbg_demo { - margin: 0.5em 1em 0.5em 1em; -} - .central_columns_navigation { padding: 1.5% 0 !important; } @@ -1623,37 +1619,6 @@ div.sqlvalidate { background: $bg-one; } -#main_pane_left { - width: 60%; - min-width: 260px; - float: $left; - padding-top: 1em; -} - -#main_pane_right { - overflow: hidden; - min-width: 160px; - padding-top: 1em; - padding-#{$left}: 1em; -} - -.group { - border-#{$left}: 0.3em solid $th-background; - margin-bottom: 1em; - - h2 { - background: $th-background; - padding: 0.1em 0.3em; - margin-top: 0; - } -} - -.group-cnt { - padding: 0 0 0 0.5em; - display: inline-block; - width: 98%; -} - textarea#partitiondefinition { height: 3em; } @@ -3687,16 +3652,6 @@ body { } @media only screen and (max-width: 768px) { - #main_pane_left { - width: 100%; - } - - #main_pane_right { - padding-top: 0; - padding-#{$left}: 1px; - padding-#{$right}: 1px; - } - ul { &#topmenu, &.tabs { @@ -3806,3 +3761,19 @@ body { #filter_query_text { vertical-align: baseline; } + +// Bootstrap + +.card { + border-top: none; + border-bottom: none; + border-#{$right}: none; +} + +.card-header { + padding-top: 0.1em; + padding-bottom: 0.1em; + font-weight: bold; + font-size: 120%; + border: 0; +} diff --git a/themes/original/scss/_variables.scss b/themes/original/scss/_variables.scss index adaadd81f0..3a2e5e2872 100644 --- a/themes/original/scss/_variables.scss +++ b/themes/original/scss/_variables.scss @@ -58,3 +58,11 @@ $th-color: #000; $bg-one: #e5e5e5; // table data row background, alternate $bg-two: #d5d5d5; + +// Bootstrap + +$card-border-radius: 0; +$card-border-width: 0.3em; +$card-border-color: $th-background; +$card-cap-bg: $th-background; +$card-bg: $main-background; diff --git a/themes/pmahomme/scss/_common.scss b/themes/pmahomme/scss/_common.scss index e622bded19..a1aa58d500 100644 --- a/themes/pmahomme/scss/_common.scss +++ b/themes/pmahomme/scss/_common.scss @@ -1040,10 +1040,6 @@ label.col-3.d-flex.align-items-center { margin: 5px 2px; } -.cfg_dbg_demo { - margin: 0.5em 1em 0.5em 1em; -} - .central_columns_navigation { padding: 1.5% 0 !important; } @@ -2063,60 +2059,6 @@ div.sqlvalidate { background: $bg-one; } -#main_pane_left { - width: 60%; - min-width: 260px; - float: $left; - padding-top: 1em; -} - -#main_pane_right { - overflow: hidden; - min-width: 160px; - padding-top: 1em; -} - -.group { - border: 1px solid #999; - background: #f3f3f3; - -moz-border-radius: 4px; - -webkit-border-radius: 4px; - border-radius: 4px; - - @if $direction == rtl { - -moz-box-shadow: -2px 2px 5px #ccc; - -webkit-box-shadow: -2px 2px 5px #ccc; - box-shadow: -2px 2px 5px #ccc; - } @else { - -moz-box-shadow: 2px 2px 5px #ccc; - -webkit-box-shadow: 2px 2px 5px #ccc; - box-shadow: 2px 2px 5px #ccc; - } - - margin-bottom: 1em; - padding-bottom: 1em; - - h2 { - background-color: #bbb; - padding: 0.1em 0.3em; - margin-top: 0; - color: #fff; - font-size: 1.6em; - font-weight: normal; - text-shadow: 0 1px 0 #777; - -moz-box-shadow: 1px 1px 15px #999 inset; - -webkit-box-shadow: 1px 1px 15px #999 inset; - box-shadow: 1px 1px 15px #999 inset; - } -} - -.group-cnt { - padding: 0; - padding-#{$left}: 0.5em; - display: inline-block; - width: 98%; -} - textarea#partitiondefinition { height: 3em; } @@ -4159,29 +4101,7 @@ body .ui-dialog { overflow: hidden; } -// Bootstrap - -.btn-primary { - font-weight: $font-weight-bold; -} - -.btn-primary, -.btn-secondary { - border-color: #aaa; - text-shadow: 0 1px 0 #fff; - background-image: linear-gradient(#f8f8f8, #d8d8d8); - - &:hover { - background-image: linear-gradient(#fff, #ddd); - } -} - @media only screen and (max-width: 768px) { - // For mobile phones: - #main_pane_left { - width: 100%; - } - ul { &#topmenu, &.tabs { @@ -4287,3 +4207,42 @@ body .ui-dialog { #filter_query_text { vertical-align: baseline; } + +// Bootstrap + +.btn-primary { + font-weight: $font-weight-bold; +} + +.btn-primary, +.btn-secondary { + border-color: #aaa; + text-shadow: 0 1px 0 #fff; + background-image: linear-gradient(#f8f8f8, #d8d8d8); + + &:hover { + background-image: linear-gradient(#fff, #ddd); + } +} + +.card { + @if $direction == rtl { + -moz-box-shadow: -2px 2px 5px #ccc; + -webkit-box-shadow: -2px 2px 5px #ccc; + box-shadow: -2px 2px 5px #ccc; + } @else { + -moz-box-shadow: 2px 2px 5px #ccc; + -webkit-box-shadow: 2px 2px 5px #ccc; + box-shadow: 2px 2px 5px #ccc; + } +} + +.card-header { + padding-top: 0.1em; + padding-bottom: 0.1em; + font-size: 1.6em; + text-shadow: 0 1px 0 #777; + -moz-box-shadow: 1px 1px 15px #999 inset; + -webkit-box-shadow: 1px 1px 15px #999 inset; + box-shadow: 1px 1px 15px #999 inset; +} diff --git a/themes/pmahomme/scss/_variables.scss b/themes/pmahomme/scss/_variables.scss index 4503352380..eba6dc8dd1 100644 --- a/themes/pmahomme/scss/_variables.scss +++ b/themes/pmahomme/scss/_variables.scss @@ -70,3 +70,8 @@ $secondary: #ddd; $btn-border-radius: 0.85rem; $btn-line-height: 1.15; + +$card-border-color: #999; +$card-bg: #f3f3f3; +$card-cap-bg: #bbb; +$card-cap-color: #fff;