mirror/php-adminer
1
0
Fork 0
mirror of https://github.com/vrana/adminer.git synced 2025-08-08 15:47:00 +02:00
Code Issues Releases Wiki Activity

CSS: Hide menu on mobile

Browse Source
This commit is contained in:
Jakub Vrana
2025-03-29 11:11:57 +01:00
parent 6cf3d5d2b8
commit 79fbf9c58a
6 changed files with 24 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@@ -1,6 +1,7 @@
## Adminer dev ## Adminer dev
Export: Fix tar (regression from 5.0.3) Export: Fix tar (regression from 5.0.3)
Elasticsearch: Make it work with Elasticsearch 8 Elasticsearch: Make it work with Elasticsearch 8
CSS: Hide menu on mobile
CSS: Invert icons in dark mode CSS: Invert icons in dark mode
## Adminer 5.1.0 (released 2025-03-24) ## Adminer 5.1.0 (released 2025-03-24)

7
adminer/include/design.inc.php
View File

@@ -86,6 +86,7 @@ const thousandsSeparator = '" . js_escape(lang(',')) . "';")
echo "<div id='help' class='jush-" . JUSH . " jsonly hidden'></div>\n"; echo "<div id='help' class='jush-" . JUSH . " jsonly hidden'></div>\n";
echo script("mixin(qs('#help'), {onmouseover: () => { helpOpen = 1; }, onmouseout: helpMouseout});"); echo script("mixin(qs('#help'), {onmouseover: () => { helpOpen = 1; }, onmouseout: helpMouseout});");
echo "<div id='content'>\n"; echo "<div id='content'>\n";
echo "<span id='menuopen' class='jsonly'>" . icon("move", "", "menu", "") . "</span>" . script("qs('#menuopen').onclick = event => { qs('#foot').classList.toggle('foot'); event.stopPropagation(); }");
if ($breadcrumb !== null) { if ($breadcrumb !== null) {
$link = substr(preg_replace('~\b(username|db|ns)=[^&]*&~', '', ME), 0, -1); $link = substr(preg_replace('~\b(username|db|ns)=[^&]*&~', '', ME), 0, -1);
echo '<p id="breadcrumb"><a href="' . h($link ?: ".") . '">' . get_driver(DRIVER) . '</a> » '; echo '<p id="breadcrumb"><a href="' . h($link ?: ".") . '">' . get_driver(DRIVER) . '</a> » ';
@@ -193,9 +194,9 @@ function page_messages(string $error): void {
*/ */
function page_footer(string $missing = ""): void { function page_footer(string $missing = ""): void {
global $adminer; global $adminer;
echo "</div>\n\n<div id='menu'>\n"; echo "</div>\n\n<div id='foot' class='foot'>\n<div id='menu'>\n";
$adminer->navigation($missing); $adminer->navigation($missing);
echo "</div>\n\n"; echo "</div>\n";
if ($missing != "auth") { if ($missing != "auth") {
?> ?>
<form action="" method="post"> <form action="" method="post">
@@ -203,9 +204,9 @@ function page_footer(string $missing = ""): void {
<span><?php echo h($_GET["username"]) . "\n"; ?></span> <span><?php echo h($_GET["username"]) . "\n"; ?></span>
<input type="submit" name="logout" value="<?php echo lang('Logout'); ?>" id="logout"> <input type="submit" name="logout" value="<?php echo lang('Logout'); ?>" id="logout">
<?php echo input_token(); ?> <?php echo input_token(); ?>
</p>
</form> </form>
<?php <?php
} }
echo "</div>\n\n";
echo script("setupSubmitHighlight(document);"); echo script("setupSubmitHighlight(document);");
} }

2
adminer/include/html.inc.php
View File

@@ -353,7 +353,7 @@ function search_tables(): void {
/** Return events to display help on mouse over /** Return events to display help on mouse over
* @param string $command JS expression * @param string $command JS expression
* @param int $side JS expression * @param int $side 0 top, 1 left
*/ */
function on_help(string $command, int $side = 0): string { function on_help(string $command, int $side = 0): string {
return script("mixin(qsl('select, input'), {onmouseover: function (event) { helpMouseover.call(this, event, $command, $side) }, onmouseout: helpMouseout});", ""); return script("mixin(qsl('select, input'), {onmouseover: function (event) { helpMouseover.call(this, event, $command, $side) }, onmouseout: helpMouseout});", "");

4
adminer/static/dark.css
View File

@@ -44,3 +44,7 @@ input.required, input.maxlength { box-shadow: 1px 1px 1px red; }
#schema div.table a { color: #3c7bb3; } #schema div.table a { color: #3c7bb3; }
#menu .active { color: #398c8d; } #menu .active { color: #398c8d; }
#edit-fields tbody tr:hover td, #edit-fields tbody tr:hover th { background: #3b6f9d; } #edit-fields tbody tr:hover td, #edit-fields tbody tr:hover th { background: #3b6f9d; }
@media all and (max-width: 880px) {
#menu { background: #002240; border-color: #a3bdd3; }
}

11
adminer/static/default.css
View File

@@ -81,6 +81,7 @@ input.wayoff { left: -1000px; position: absolute; }
#logins a, #tables a, #tables span { background: #fff; } #logins a, #tables a, #tables span { background: #fff; }
#content { margin: 2em 0 0 21em; padding: 10px 20px 20px 0; } #content { margin: 2em 0 0 21em; padding: 10px 20px 20px 0; }
#lang { position: absolute; top: -2.6em; left: 0; padding: .3em 1em; } #lang { position: absolute; top: -2.6em; left: 0; padding: .3em 1em; }
#menuopen { display: none; }
#breadcrumb { white-space: nowrap; position: absolute; top: 0; left: 21em; background: #eee; height: 2em; line-height: 1.8em; padding: 0 1em; margin: 0 0 0 -18px; } #breadcrumb { white-space: nowrap; position: absolute; top: 0; left: 21em; background: #eee; height: 2em; line-height: 1.8em; padding: 0 1em; margin: 0 0 0 -18px; }
#h1 { color: #777; text-decoration: none; font-style: italic; } #h1 { color: #777; text-decoration: none; font-style: italic; }
#version { color: red; } #version { color: red; }
@@ -94,6 +95,7 @@ input.wayoff { left: -1000px; position: absolute; }
.icon-down { background-image: url(data:image/gif;base64,R0lGODlhEgASAIEAMe7u7gAAgJmZmQAAACH5BAEAAAEALAAAAAASABIAAQIghI+py+0PTQjxzCopvltX/lyix0wm2ZwdxraVAMfyHBcAOw==); } .icon-down { background-image: url(data:image/gif;base64,R0lGODlhEgASAIEAMe7u7gAAgJmZmQAAACH5BAEAAAEALAAAAAASABIAAQIghI+py+0PTQjxzCopvltX/lyix0wm2ZwdxraVAMfyHBcAOw==); }
.icon-plus { background-image: url(data:image/gif;base64,R0lGODlhEgASAIEAMe7u7gAAgJmZmQAAACH5BAEAAAEALAAAAAASABIAAQIhhI+py+0PTQjxzCopvm/6rykgCHGVGaFliLXuI8TyTMsFADs=); } .icon-plus { background-image: url(data:image/gif;base64,R0lGODlhEgASAIEAMe7u7gAAgJmZmQAAACH5BAEAAAEALAAAAAASABIAAQIhhI+py+0PTQjxzCopvm/6rykgCHGVGaFliLXuI8TyTMsFADs=); }
.icon-cross { background-image: url(data:image/gif;base64,R0lGODlhEgASAIEAMe7u7gAAgJmZmQAAACH5BAEAAAEALAAAAAASABIAAQIjhI+py+0PIwph1kZvfnnDLoFfd2GU4THnsUruC0fCTNc2XQAAOw==); } .icon-cross { background-image: url(data:image/gif;base64,R0lGODlhEgASAIEAMe7u7gAAgJmZmQAAACH5BAEAAAEALAAAAAASABIAAQIjhI+py+0PIwph1kZvfnnDLoFfd2GU4THnsUruC0fCTNc2XQAAOw==); }
.icon-move { background-image: url(data:image/gif;base64,R0lGODlhEgASAJEAAO7u7gAAAJmZmQAAACH5BAEAAAEALAAAAAASABIAAAIfhI+py+3vgpyU0Rug3gnX5U3cqIWSZZLqigjuC8dvAQA7); }
#schema .arrow { height: 1.25em; background: url(data:image/gif;base64,R0lGODlhCAAKAIAAAICAgP///yH5BAEAAAEALAAAAAAIAAoAAAIPBIJplrGLnpQRqtOy3rsAADs=) no-repeat right center; } #schema .arrow { height: 1.25em; background: url(data:image/gif;base64,R0lGODlhCAAKAIAAAICAgP///yH5BAEAAAEALAAAAAAIAAoAAAIPBIJplrGLnpQRqtOy3rsAADs=) no-repeat right center; }
.rtl h2 { margin: 0 -18px 20px 0; } .rtl h2 { margin: 0 -18px 20px 0; }
@@ -108,11 +110,14 @@ input.wayoff { left: -1000px; position: absolute; }
@media all and (max-width: 880px) { @media all and (max-width: 880px) {
.pages { left: auto; } .pages { left: auto; }
.logout { position: static; padding: 1em; } .logout { padding: 1em; top: 3em; }
#menu { position: static; width: auto; } #menu { width: auto; background: #fff; border: 1px solid #000; }
#content { margin-left: 10px; } #content { margin-left: 10px; }
#lang { position: static; } #lang { position: static; }
#breadcrumb { left: auto; } #breadcrumb { left: 48px; }
.js .foot { display: none; }
.js #menuopen { display: block; position: absolute; top: 3px; left: 6px; }
.nojs .logout, .nojs #menu { position: static; }
.rtl .pages { right: auto; } .rtl .pages { right: auto; }
.rtl #content { margin-right: 10px; } .rtl #content { margin-right: 10px; }
.rtl #breadcrumb { right: auto; } .rtl #breadcrumb { right: auto; }

6
adminer/static/functions.js
View File

@@ -849,3 +849,9 @@ oninput = event => {
const maxLength = target.getAttribute('data-maxlength'); const maxLength = target.getAttribute('data-maxlength');
alterClass(target, 'maxlength', target.value && maxLength != null && target.value.length > maxLength); // maxLength could be 0 alterClass(target, 'maxlength', target.value && maxLength != null && target.value.length > maxLength); // maxLength could be 0
}; };
addEvent(document, 'click', event => {
if (!qs('#foot').contains(event.target)) {
alterClass(qs('#foot'), 'foot', true);
}
});