IT-Works/Wegwichtel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix mobile browser view
All checks were successful
Sonarqube Scanner / Build and analyze (push) Successful in 1m36s
Details

Browse Source
This commit is contained in:
Florian Zumpe 2026-06-17 16:27:56 +02:00
parent 32f161483d
commit 13770f21e3
5 changed files with 33 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "wegwichtel-next", "name": "wegwichtel-next",
"version": "0.12.9", "version": "0.12.10",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "wegwichtel-next", "name": "wegwichtel-next",
"version": "0.12.9", "version": "0.12.10",
"hasInstallScript": true, "hasInstallScript": true,
"dependencies": { "dependencies": {
"@file-type/av": "0.2.0", "@file-type/av": "0.2.0",

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "wegwichtel-next", "name": "wegwichtel-next",
"version": "0.12.9", "version": "0.12.10",
"private": true, "private": true,
"description": "GPS-gestützte Lern- und Wanderwege mit GPX, POIs, Bildern und Audioansagen.", "description": "GPS-gestützte Lern- und Wanderwege mit GPX, POIs, Bildern und Audioansagen.",
"type": "module", "type": "module",

21
public/css/app.css
View File

@ -406,21 +406,26 @@ button,
} }
#slideshow > fieldset { #slideshow > fieldset {
display: grid; display: flex;
margin: 0; flex-flow: row nowrap;
grid-template-columns: var(--icon-button-size) minmax(0, 1fr) var(--icon-button-size); align-items: center;
align-items: stretch;
gap: .5rem; gap: .5rem;
width: 100%; width: 100%;
min-width: 0;
box-sizing: border-box; box-sizing: border-box;
margin: 0;
padding: .65rem; padding: .65rem;
} }
#slideshow > fieldset .ui-button { #slideshow > fieldset > button.ui-button {
display: grid; display: grid;
flex: 0 0 var(--icon-button-size);
align-self: center;
place-items: center; place-items: center;
min-width: 0; width: var(--icon-button-size);
min-height: 100%; height: var(--icon-button-size);
min-width: var(--icon-button-size);
min-height: var(--icon-button-size);
margin: 0; margin: 0;
padding: .45rem; padding: .45rem;
} }
@ -433,6 +438,8 @@ button,
#slideshow > fieldset > div { #slideshow > fieldset > div {
display: flex; display: flex;
flex: 1 1 0;
align-self: stretch;
min-width: 0; min-width: 0;
min-height: var(--icon-button-size); min-height: var(--icon-button-size);
padding: .25rem .4rem; padding: .25rem .4rem;

12
src/services/routes-service.js
View File

@ -21,11 +21,21 @@ const UPDATE_METRICS_SQL = `UPDATE routes SET
start_lat=?, start_lon=?, center_lat=?, center_lon=?, min_lat=?, min_lon=?, max_lat=?, max_lon=?, start_lat=?, start_lon=?, center_lat=?, center_lon=?, min_lat=?, min_lon=?, max_lat=?, max_lon=?,
distance_m=?, elevation_gain_m=?, point_count=?, updated_at=CURRENT_TIMESTAMP WHERE id=?`; distance_m=?, elevation_gain_m=?, point_count=?, updated_at=CURRENT_TIMESTAMP WHERE id=?`;
function trimEdgeHyphens(value) {
let start = 0;
let end = value.length;
while (start < end && value[start] === '-') start += 1;
while (end > start && value[end - 1] === '-') end -= 1;
return value.slice(start, end);
}
function slugify(value) { function slugify(value) {
const normalized = String(value).toLowerCase().normalize('NFKD'); const normalized = String(value).toLowerCase().normalize('NFKD');
const withoutMarks = normalized.replaceAll(/[\u0300-\u036f]/g, ''); const withoutMarks = normalized.replaceAll(/[\u0300-\u036f]/g, '');
const separated = withoutMarks.replaceAll(/[^a-z0-9]+/g, '-'); const separated = withoutMarks.replaceAll(/[^a-z0-9]+/g, '-');
const trimmed = separated.replaceAll(/(?:^-+|-+$)/g, ''); const trimmed = trimEdgeHyphens(separated);
return trimmed.slice(0, 80) || `route-${Date.now()}`; return trimmed.slice(0, 80) || `route-${Date.now()}`;
} }

6
test/mobile-navigation-ui.test.js
View File

@ -182,7 +182,11 @@ test('POI page uses icon-based back and slideshow controls in a single responsiv
assert.match(html, /id="slide-prev"[\s\S]*images\/icons\/chevron-left\.svg/); assert.match(html, /id="slide-prev"[\s\S]*images\/icons\/chevron-left\.svg/);
assert.match(html, /id="slide-next"[\s\S]*images\/icons\/chevron-right\.svg/); assert.match(html, /id="slide-next"[\s\S]*images\/icons\/chevron-right\.svg/);
assert.match(html, /<fieldset>[\s\S]*<legend>Bildnavigation<\/legend>/); assert.match(html, /<fieldset>[\s\S]*<legend>Bildnavigation<\/legend>/);
assert.match(css, /#slideshow > fieldset[\s\S]*grid-template-columns:\s*var\(--icon-button-size\) minmax\(0, 1fr\) var\(--icon-button-size\)/); assert.match(css, /#slideshow > fieldset[\s\S]*display:\s*flex/);
assert.match(css, /#slideshow > fieldset[\s\S]*flex-flow:\s*row nowrap/);
assert.match(css, /#slideshow > fieldset[\s\S]*align-items:\s*center/);
assert.match(css, /#slideshow > fieldset > button\.ui-button[\s\S]*flex:\s*0 0 var\(--icon-button-size\)/);
assert.match(css, /#slideshow > fieldset > div[\s\S]*flex:\s*1 1 0/);
assert.match(css, /#slideshow > fieldset > div[\s\S]*justify-content:\s*center/); assert.match(css, /#slideshow > fieldset > div[\s\S]*justify-content:\s*center/);
assert.match(css, /#slide-caption[\s\S]*overflow-wrap:\s*anywhere/); assert.match(css, /#slide-caption[\s\S]*overflow-wrap:\s*anywhere/);
assert.doesNotMatch(loader, /controlgroup/); assert.doesNotMatch(loader, /controlgroup/);