Miko/dokuwiki-plugin-botmon
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Admin UI fixes

Browse Source
This commit is contained in:
Sascha Leib
2025-10-26 11:50:26 +01:00
parent cc330e684d
commit cef3810678
6 changed files with 45 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
admin.css
View File

@@ -7,24 +7,29 @@
/* icon items */ /* icon items */
.has_icon { .has_icon {
display: inline-flex; display: inline-flex;
align-items: center;
width: auto;
white-space: nowrap;
} }
.icon_only { .icon_only {
display: inline-grid; display: inline-grid;
grid-template-columns: 20px max-content; grid-template-columns: 20px max-content;
overflow: hidden; width: 20px; max-width: 20px;
width: 20px;
} }
.has_icon, .icon_only { .has_icon, .icon_only {
& { & {
align-items: center; align-items: center;
column-gap: .25em; overflow: hidden;
column-gap: .2em;
min-width: 20px;
} }
&::before { &::before {
content: ''; content: '';
display: inline-block; display: inline-block;
width: 20px; height: 20px; width: 20px; min-width: 20px; max-width: 20px;
height: 20px;
background: transparent none center no-repeat; background: transparent none center no-repeat;
background-position: 0 0; background-position: 0 0;
background-size: 20px; background-size: 20px;
@@ -534,14 +539,15 @@
color: #333; color: #333;
cursor: pointer; cursor: pointer;
} }
&::marker, &::before { &::marker {
content: none; content: none;
display: none; display: none;
} }
&::before { &::before {
content: ''; content: '';
display: inline-block; display: inline-block;
width: 1.25em; height: 1.25em; width: 1.25em; min-width: 1.25em; max-width: 1.25em;
height: 1.25em;
background: transparent url('img/chevron.svg') center no-repeat; background: transparent url('img/chevron.svg') center no-repeat;
background-size: 1.25em; background-size: 1.25em;
transform: rotate(-90deg); transform: rotate(-90deg);
@@ -607,8 +613,10 @@
border-radius: .5em; border-radius: .5em;
} }
details ul > li > details > summary { details ul > li > details > summary {
display: flex; display: grid;
justify-content: space-between; grid-template-columns: 1.25em minmax(calc(100px + 4em), auto) max-content;
justify-items: stretch;
justify-content: stretch;
align-items: center; align-items: center;
column-gap: .5em; column-gap: .5em;
font-weight: normal; font-weight: normal;
@@ -617,6 +625,7 @@
background-color: #F0F0F0; background-color: #F0F0F0;
border-bottom: #CCC solid 1px; border-bottom: #CCC solid 1px;
border-radius: .7em; border-radius: .7em;
overflow: auto;
} }
details ul > li > details > summary.noServer { details ul > li > details > summary.noServer {
opacity: 67%; opacity: 67%;
@@ -627,7 +636,10 @@
column-gap: .25em; column-gap: .25em;
} }
details ul > li > details > summary > span:first-child { details ul > li > details > summary > span:first-child {
flex-grow: 1; justify-content: flex-start;
}
details ul > li > details > summary > span:last-child {
justify-content: flex-end;
} }
details ul > li > details > summary > span > span[title] { details ul > li > details > summary > span > span[title] {
cursor: help; cursor: help;
@@ -744,11 +756,12 @@
font-size: smaller; font-size: smaller;
border-radius: .5em; border-radius: .5em;
margin-right: .25em; margin-right: .25em;
min-width: fit-content;
} }
span.pageseen::before { span.pageseen::before {
content : ''; content : '';
display: inline-block; display: inline-block;
width: 1.25em; height: 1.25em; width: 1.25em; min-width: 1.25em; max-width: 1.25em; height: 1.25em;
background: transparent url('img/page.svg') center no-repeat; background: transparent url('img/page.svg') center no-repeat;
background-size: 1.25em; background-size: 1.25em;
} }
@@ -980,3 +993,9 @@
} }
} }
} }
@media (max-width: 440px) {
#botmon__admin #botmon__latest #botmon__today__content details > div { padding: .25em; }
#botmon__admin #botmon__latest #botmon__today__visitorlists details ul > li { margin-left: 0; }
#botmon__admin #botmon__latest #botmon__today__visitorlists details ul > li > details > summary { column-gap: .1em; }
}

10
admin.js
View File

@@ -182,7 +182,7 @@ const BotMon = {
} }
}; };
/* everything specific to the "Latest" tab is self-contained in the "live" object: */ /* everything specific to the 'Latest' tab is self-contained in the 'live' object: */
BotMon.live = { BotMon.live = {
init: function() { init: function() {
//console.info('BotMon.live.init()'); //console.info('BotMon.live.init()');
@@ -2306,15 +2306,15 @@ BotMon.live = {
} else { /* others */ } else { /* others */
/*span1.appendChild(make('span', { // IP-Address span1.appendChild(make('span', { // IP-Address
'class': 'has_icon ipaddr ip' + ipType, 'class': 'has_icon ipaddr ip' + ipType,
'title': "IP-Address: " + data.ip 'title': "IP-Address: " + data.ip
}, data.ip));*/ }, data.ip));
span1.appendChild(make('span', { /* Internal ID */ /*span1.appendChild(make('span', { // Internal ID
'class': 'has_icon session typ_' + data.typ, 'class': 'has_icon session typ_' + data.typ,
'title': "ID: " + data.id 'title': "ID: " + data.id
}, data.id)); }, data.id));*/
} }
span1.appendChild(make('span', { /* page views */ span1.appendChild(make('span', { /* page views */

2
admin.php
View File

@@ -107,7 +107,7 @@ class admin_plugin_botmon extends AdminPlugin {
echo '</article>' . NL; echo '</article>' . NL;
echo '<script> echo '<script>
BMSettings = { BMSettings = {
showDay: ' . json_encode($this->getConf('showDay')) . ' showday: ' . json_encode($this->getConf('showday')) . '
}; };
</script>'; </script>';
echo '</div><!-- End of BotMon Admin Tool -->'; echo '</div><!-- End of BotMon Admin Tool -->';

5
captcha.js
View File

@@ -27,12 +27,15 @@ const $BMCaptcha = {
const dlg = document.createElement('dialog'); const dlg = document.createElement('dialog');
dlg.setAttribute('closedby', 'none'); dlg.setAttribute('closedby', 'none');
dlg.setAttribute('open', 'open'); dlg.setAttribute('open', 'open');
dlg.setAttribute('role', 'alertdialog');
dlg.setAttribute('aria-labelledby', 'botmon_captcha_title');
dlg.classList.add('checking'); dlg.classList.add('checking');
dlg.id = 'botmon_captcha_box'; dlg.id = 'botmon_captcha_box';
dlg.innerHTML = '<h2>' + _loc('dlgTitle', 'Title') + '</h2><p>' + _loc('dlgSubtitle', 'Subtitle') + '</p>'; dlg.innerHTML = '<h2 id="botmon_captcha_title">' + _loc('dlgTitle', 'Title') + '</h2><p>' + _loc('dlgSubtitle', 'Subtitle') + '</p>';
// Checkbox: // Checkbox:
const lbl = document.createElement('label'); const lbl = document.createElement('label');
lbl.setAttribute('aria-live', 'assertive');
lbl.innerHTML = '<span class="confirm">' + _loc('dlgConfirm', "Confirm.") + '</span>' + lbl.innerHTML = '<span class="confirm">' + _loc('dlgConfirm', "Confirm.") + '</span>' +
'<span class="busy"></span><span class="checking">' + _loc('dlgChecking', "Checking") + '</span>' + '<span class="busy"></span><span class="checking">' + _loc('dlgChecking', "Checking") + '</span>' +
'<span class="loading">' + _loc('dlgLoading', "Loading") + '</span>' + '<span class="loading">' + _loc('dlgLoading', "Loading") + '</span>' +

6
lang/en/settings.php
View File

@@ -14,4 +14,8 @@ $lang['geoiplib'] = 'Add GeoIP Information<br><small>(requires PHP module to b
$lang['geoiplib_o_phpgeoip'] = 'Use GeoIP Module'; $lang['geoiplib_o_phpgeoip'] = 'Use GeoIP Module';
$lang['useCaptcha'] = 'Enable Captcha<br><small>(Experimental, read the manual first!)</small>'; $lang['useCaptcha'] = 'Enable Captcha<br><small>(Experimental, read the manual first!)</small>';
$lang['captchaSeed'] = 'Captcha Seed<br><small>(Best use a random number, e.g. <a href="https://www.browserling.com/tools/random-hex" target="_blank">here</a> )</small>'; $lang['useCaptcha_o_disabled'] = 'Disabled';
$lang['useCaptcha_o_blank'] = 'Show empty background';
$lang['useCaptcha_o_dada'] = 'Show placeholder text';
$lang['captchaSeed'] = 'Captcha Seed<br><small>(Best use a random number, e.g. <a href="https://www.browserling.com/tools/random-hex" target="_blank">here</a> )</small>';

2
style.less
View File

@@ -30,6 +30,7 @@ body.botmon_captcha {
font-family: system-ui, sans-serif; font-family: system-ui, sans-serif;
box-shadow: .25rem .25rem .5rem rgba(0,0,0,.5); box-shadow: .25rem .25rem .5rem rgba(0,0,0,.5);
box-sizing: border-box; box-sizing: border-box;
z-index: 10001;
} }
& * { & * {
color: #EDEDF5; color: #EDEDF5;
@@ -112,7 +113,6 @@ body.botmon_captcha {
height: auto; height: auto;
left: 0; top: 80px; left: 0; top: 80px;
border-radius: 2px; border-radius: 2px;
z-index: 10001;
} }
} }