Compare commits

..

No commits in common. "main" and "v0.5.1" have entirely different histories.
main ... v0.5.1

24 changed files with 569 additions and 1126 deletions

View file

@ -6,12 +6,7 @@
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="style.css" rel="stylesheet">
<link rel="icon" type="image/png" sizes="512" href="/icons/512.png">
<link rel="icon" type="image/png" sizes="192" href="/icons/192.png">
<link rel="shortcut icon" href="/icons/favicon.svg">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/icons/favicon-transparent.svg" color="#65a30d">
<title>hvvstuhl.de | Was ist das?</title>
<title>Barrierefreie Aufzugs-Liste | Was ist das?</title>
</head>
<body>
<h1>Barrierefreie Aufzugs-Liste</h1>
@ -30,19 +25,18 @@
</ul>
</nav>
<main>
<section>
<section>
<h2>Worum geht's hier?</h2>
<p>
Diese Seite ermöglicht einen barrierefreien Zugang zu den Aufzugs-Informationen im HVV.
Der HVV selbst zeigt diese Informationen nur auf einer (vor allem ohne Ortskenntnis) schwer zu navigierenden
Karte an:
Diese Seite ermöglicht einen barrierefreien Zugang zu den Aufzugs informationen im HVV.
Der HVV selbst zeigt diese Informationen nur auf einer (vor allem ohne Ortskenntnis) schwer zu navigierenden Karte an:
<a href="https://www.hvv.de/de/aufzuege">HVV Webseite zu Aufzügen</a>
</p>
<p>
Dieses Projekt wurde unter der AGPL-3 Lizenz entwickelt und ist hier zu finden:
Dieses Projekt wurde unter AGPL-3 entwickelt und ist hier zu finden:
<a href="https://git.kritzl.dev/kritzl/hvvstuhl.de" target="_blank">git.kritzl.dev</a>
</p>
</section>
</section>
</main>
</body>
</html>

View file

@ -1,3 +0,0 @@
/*# sourceMappingURL=colors.css.map */

View file

@ -1 +0,0 @@
{"version":3,"sourceRoot":"","sources":[],"names":[],"mappings":"","file":"colors.css"}

View file

@ -1,271 +0,0 @@
@mixin tailwindColors {
/* Colors from Tailwind CSS: https://github.com/tailwindlabs/tailwindcss
MIT License
Copyright (c) Tailwind Labs, Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/
--color-black: #000;
--color-white: #fff;
--color-slate-50: #f8fafc;
--color-slate-100: #f1f5f9;
--color-slate-200: #e2e8f0;
--color-slate-300: #cbd5e1;
--color-slate-400: #94a3b8;
--color-slate-500: #64748b;
--color-slate-600: #475569;
--color-slate-700: #334155;
--color-slate-800: #1e293b;
--color-slate-900: #0f172a;
--color-slate-950: #020617;
--color-gray-50: #f9fafb;
--color-gray-100: #f3f4f6;
--color-gray-200: #e5e7eb;
--color-gray-300: #d1d5db;
--color-gray-400: #9ca3af;
--color-gray-500: #6b7280;
--color-gray-600: #4b5563;
--color-gray-700: #374151;
--color-gray-800: #1f2937;
--color-gray-900: #111827;
--color-gray-950: #030712;
--color-zinc-50: #fafafa;
--color-zinc-100: #f4f4f5;
--color-zinc-200: #e4e4e7;
--color-zinc-300: #d4d4d8;
--color-zinc-400: #a1a1aa;
--color-zinc-500: #71717a;
--color-zinc-600: #52525b;
--color-zinc-700: #3f3f46;
--color-zinc-800: #27272a;
--color-zinc-900: #18181b;
--color-zinc-950: #09090b;
--color-neutral-50: #fafafa;
--color-neutral-100: #f5f5f5;
--color-neutral-200: #e5e5e5;
--color-neutral-300: #d4d4d4;
--color-neutral-400: #a3a3a3;
--color-neutral-500: #737373;
--color-neutral-600: #525252;
--color-neutral-700: #404040;
--color-neutral-800: #262626;
--color-neutral-900: #171717;
--color-neutral-950: #0a0a0a;
--color-stone-50: #fafaf9;
--color-stone-100: #f5f5f4;
--color-stone-200: #e7e5e4;
--color-stone-300: #d6d3d1;
--color-stone-400: #a8a29e;
--color-stone-500: #78716c;
--color-stone-600: #57534e;
--color-stone-700: #44403c;
--color-stone-800: #292524;
--color-stone-900: #1c1917;
--color-stone-950: #0c0a09;
--color-red-50: #fef2f2;
--color-red-100: #fee2e2;
--color-red-200: #fecaca;
--color-red-300: #fca5a5;
--color-red-400: #f87171;
--color-red-500: #ef4444;
--color-red-600: #dc2626;
--color-red-700: #b91c1c;
--color-red-800: #991b1b;
--color-red-900: #7f1d1d;
--color-red-950: #450a0a;
--color-orange-50: #fff7ed;
--color-orange-100: #ffedd5;
--color-orange-200: #fed7aa;
--color-orange-300: #fdba74;
--color-orange-400: #fb923c;
--color-orange-500: #f97316;
--color-orange-600: #ea580c;
--color-orange-700: #c2410c;
--color-orange-800: #9a3412;
--color-orange-900: #7c2d12;
--color-orange-950: #431407;
--color-amber-50: #fffbeb;
--color-amber-100: #fef3c7;
--color-amber-200: #fde68a;
--color-amber-300: #fcd34d;
--color-amber-400: #fbbf24;
--color-amber-500: #f59e0b;
--color-amber-600: #d97706;
--color-amber-700: #b45309;
--color-amber-800: #92400e;
--color-amber-900: #78350f;
--color-amber-950: #451a03;
--color-yellow-50: #fefce8;
--color-yellow-100: #fef9c3;
--color-yellow-200: #fef08a;
--color-yellow-300: #fde047;
--color-yellow-400: #facc15;
--color-yellow-500: #eab308;
--color-yellow-600: #ca8a04;
--color-yellow-700: #a16207;
--color-yellow-800: #854d0e;
--color-yellow-900: #713f12;
--color-yellow-950: #422006;
--color-lime-50: #f7fee7;
--color-lime-100: #ecfccb;
--color-lime-200: #d9f99d;
--color-lime-300: #bef264;
--color-lime-400: #a3e635;
--color-lime-500: #84cc16;
--color-lime-600: #65a30d;
--color-lime-700: #4d7c0f;
--color-lime-800: #3f6212;
--color-lime-900: #365314;
--color-lime-950: #1a2e05;
--color-green-50: #f0fdf4;
--color-green-100: #dcfce7;
--color-green-200: #bbf7d0;
--color-green-300: #86efac;
--color-green-400: #4ade80;
--color-green-500: #22c55e;
--color-green-600: #16a34a;
--color-green-700: #15803d;
--color-green-800: #166534;
--color-green-900: #14532d;
--color-green-950: #052e16;
--color-emerald-50: #ecfdf5;
--color-emerald-100: #d1fae5;
--color-emerald-200: #a7f3d0;
--color-emerald-300: #6ee7b7;
--color-emerald-400: #34d399;
--color-emerald-500: #10b981;
--color-emerald-600: #059669;
--color-emerald-700: #047857;
--color-emerald-800: #065f46;
--color-emerald-900: #064e3b;
--color-emerald-950: #022c22;
--color-teal-50: #f0fdfa;
--color-teal-100: #ccfbf1;
--color-teal-200: #99f6e4;
--color-teal-300: #5eead4;
--color-teal-400: #2dd4bf;
--color-teal-500: #14b8a6;
--color-teal-600: #0d9488;
--color-teal-700: #0f766e;
--color-teal-800: #115e59;
--color-teal-900: #134e4a;
--color-teal-950: #042f2e;
--color-cyan-50: #ecfeff;
--color-cyan-100: #cffafe;
--color-cyan-200: #a5f3fc;
--color-cyan-300: #67e8f9;
--color-cyan-400: #22d3ee;
--color-cyan-500: #06b6d4;
--color-cyan-600: #0891b2;
--color-cyan-700: #0e7490;
--color-cyan-800: #155e75;
--color-cyan-900: #164e63;
--color-cyan-950: #083344;
--color-sky-50: #f0f9ff;
--color-sky-100: #e0f2fe;
--color-sky-200: #bae6fd;
--color-sky-300: #7dd3fc;
--color-sky-400: #38bdf8;
--color-sky-500: #0ea5e9;
--color-sky-600: #0284c7;
--color-sky-700: #0369a1;
--color-sky-800: #075985;
--color-sky-900: #0c4a6e;
--color-sky-950: #082f49;
--color-blue-50: #eff6ff;
--color-blue-100: #dbeafe;
--color-blue-200: #bfdbfe;
--color-blue-300: #93c5fd;
--color-blue-400: #60a5fa;
--color-blue-500: #3b82f6;
--color-blue-600: #2563eb;
--color-blue-700: #1d4ed8;
--color-blue-800: #1e40af;
--color-blue-900: #1e3a8a;
--color-blue-950: #172554;
--color-indigo-50: #eef2ff;
--color-indigo-100: #e0e7ff;
--color-indigo-200: #c7d2fe;
--color-indigo-300: #a5b4fc;
--color-indigo-400: #818cf8;
--color-indigo-500: #6366f1;
--color-indigo-600: #4f46e5;
--color-indigo-700: #4338ca;
--color-indigo-800: #3730a3;
--color-indigo-900: #312e81;
--color-indigo-950: #1e1b4b;
--color-violet-50: #f5f3ff;
--color-violet-100: #ede9fe;
--color-violet-200: #ddd6fe;
--color-violet-300: #c4b5fd;
--color-violet-400: #a78bfa;
--color-violet-500: #8b5cf6;
--color-violet-600: #7c3aed;
--color-violet-700: #6d28d9;
--color-violet-800: #5b21b6;
--color-violet-900: #4c1d95;
--color-violet-950: #2e1065;
--color-purple-50: #faf5ff;
--color-purple-100: #f3e8ff;
--color-purple-200: #e9d5ff;
--color-purple-300: #d8b4fe;
--color-purple-400: #c084fc;
--color-purple-500: #a855f7;
--color-purple-600: #9333ea;
--color-purple-700: #7e22ce;
--color-purple-800: #6b21a8;
--color-purple-900: #581c87;
--color-purple-950: #3b0764;
--color-fuchsia-50: #fdf4ff;
--color-fuchsia-100: #fae8ff;
--color-fuchsia-200: #f5d0fe;
--color-fuchsia-300: #f0abfc;
--color-fuchsia-400: #e879f9;
--color-fuchsia-500: #d946ef;
--color-fuchsia-600: #c026d3;
--color-fuchsia-700: #a21caf;
--color-fuchsia-800: #86198f;
--color-fuchsia-900: #701a75;
--color-fuchsia-950: #4a044e;
--color-pink-50: #fdf2f8;
--color-pink-100: #fce7f3;
--color-pink-200: #fbcfe8;
--color-pink-300: #f9a8d4;
--color-pink-400: #f472b6;
--color-pink-500: #ec4899;
--color-pink-600: #db2777;
--color-pink-700: #be185d;
--color-pink-800: #9d174d;
--color-pink-900: #831843;
--color-pink-950: #500724;
--color-rose-50: #fff1f2;
--color-rose-100: #ffe4e6;
--color-rose-200: #fecdd3;
--color-rose-300: #fda4af;
--color-rose-400: #fb7185;
--color-rose-500: #f43f5e;
--color-rose-600: #e11d48;
--color-rose-700: #be123c;
--color-rose-800: #9f1239;
--color-rose-900: #881337;
--color-rose-950: #4c0519;
/* End: Colors from Tailwind CSS */
}

View file

@ -6,6 +6,11 @@ let geolocationPermission = false;
let geolocation = null;
const openStations = new Set();
let sortByDistance = false;
const version = '0.5.1'
const minorVersion = version.split('.').splice(0, 2).join('.');
const numberFormat = new Intl.NumberFormat('de-DE', {
maximumFractionDigits: 1
});
const substituteData = [
{
@ -82,6 +87,14 @@ const substituteData = [
},
]
Object.defineProperty(String.prototype, 'capitalize', {
value: function () {
return this.charAt(0).toUpperCase() + this.toLowerCase().slice(1);
},
enumerable: false
});
async function loadElevators() {
document.querySelector('#errorMessage').classList.add('hidden');
const res = await fetch('https://www.hvv.de/elevators', {
@ -190,6 +203,12 @@ async function loadElevators() {
}));
}
const dateTimeStyle = new Intl.DateTimeFormat('de-DE', {
dateStyle: 'medium',
timeStyle: 'medium',
timeZone: 'Europe/Berlin',
})
async function loadOsmData() {
const nodeIdList = [];
for (const station of internalData.stations) {
@ -232,8 +251,7 @@ async function loadOsmData() {
if (!internalData.stations[stationIndex].hasOwnProperty('coordinates')) {
const substitute = substituteData.filter(subs => subs.name === internalData.stations[stationIndex].name)
console.log(substitute)
if (substitute.length && substitute[0].hasOwnProperty('coordinates')) {
if (substitute.length && substitute.hasOwnProperty('coordinates')) {
internalData.stations[stationIndex]['coordinates'] = substitute[0].coordinates;
}
}
@ -317,23 +335,9 @@ function sortStations(stationA, stationB) {
return 0;
}
function sortInt(valueA, valueB) {
const a = parseInt(valueA)
const b = parseInt(valueB)
if (a < b) {
return -1;
}
if (a > b) {
return 1;
}
// names must be equal
return 0;
}
function sortStationsByDistance(stationA, stationB) {
const distanceA = stationA.distance ?? 0; // ignore upper and lowercase
const distanceB = stationB.distance ?? 0; // ignore upper and lowercase
const distanceA = stationA.distance; // ignore upper and lowercase
const distanceB = stationB.distance; // ignore upper and lowercase
if (distanceA < distanceB) {
return -1;
}
@ -430,9 +434,7 @@ function renderData(location = null) {
}
}
if (sortByDistance) {
stations = stations.sort(sortStationsByDistance);
}
for (const stationIndex in stations) {
const station = stations[stationIndex];
@ -495,7 +497,7 @@ function renderData(location = null) {
osmTemplate += `<div><dt><span data-icon="info" class="size-l"></span>Beschreibung</dt><dd>${node.tags['description']}</dd></div>`;
}
if (node.tags.hasOwnProperty('level')) {
osmTemplate += `<div><dt><span data-icon="up-down" class="size-l"></span>Ebenen</dt><dd>${node.tags['level'].split(';').sort(sortInt).join(', ')}</dd></div>`;
osmTemplate += `<div><dt><span data-icon="up-down" class="size-l"></span>Ebenen</dt><dd>${node.tags['level'].split(';').sort().join(', ')}</dd></div>`;
}
if (node.tags.hasOwnProperty('wheelchair')) {
osmTemplate += `<div><dt><span data-icon="wheelchair" class="size-l"></span>Rollstühle</dt><dd>${node.tags['wheelchair'] === 'yes' ? 'Ja' : 'Nein'}</dd></div>`;
@ -568,11 +570,7 @@ function renderData(location = null) {
<div class="typeList">
${station.types.sort().map(t => `<span class="typeChip" data-type="${t}">${t}</span>`).join('')}
</div>
${sortByDistance
? typeof station.distance !== 'undefined'
? `<div class="distance"><b>${Math.round(station.distance / 100) / 10}</b><br>km</div>`
: '<div class="distance">? km</div>'
: ''}
${typeof station.distance !== 'undefined' ? `<div class="distance"><b>${Math.round(station.distance / 100) / 10}</b><br>km</div>` : ''}
</div>
<div class="stationTitle">
<h3>${station.name}</h3>
@ -667,13 +665,12 @@ document.querySelector('#stationsNearMe')
if (geolocationPermission !== 'granted') {
allowGeolocation();
} else {
sortByDistance = e.target.ariaPressed = true;
// If geolocation is already set.
// If not the location watcher will re-render our data.
if (geolocation !== null) {
renderData(geolocation)
}
sortByDistance = e.target.ariaPressed = true;
}
}
} else {
@ -729,6 +726,21 @@ document.querySelectorAll('button.typeChip').forEach(e => {
})
})
function openDialog(selector) {
document.querySelector('body').classList.add('has-dialog')
document.querySelector('#dialog_layer').classList.add('active')
document.querySelector(selector).classList.remove('hidden')
}
function closeDialog(selector) {
document.querySelector('body').classList.remove('has-dialog')
document.querySelector('#dialog_layer').classList.remove('active')
document.querySelector(selector).classList.add('hidden')
}
// set version
document.querySelector('#version').innerHTML = `v${version}`;
// data api version check
const check_internal = JSON.parse(localStorage.getItem("internal_data"));
const check_osm = JSON.parse(localStorage.getItem("osm_data"));

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

View file

@ -1,58 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="100mm"
height="100mm"
viewBox="0 0 100 100"
version="1.1"
id="svg1"
xml:space="preserve"
inkscape:version="1.3 (1:1.3+202307231459+0e150ed6c4)"
sodipodi:docname="favicon_source.svg"
inkscape:export-filename="favicon-transparent.png"
inkscape:export-xdpi="130.048"
inkscape:export-ydpi="130.048"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
inkscape:zoom="0.9145201"
inkscape:cx="549.46851"
inkscape:cy="179.87576"
inkscape:window-width="1920"
inkscape:window-height="1085"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1"><inkscape:page
x="0"
y="0"
width="100"
height="100"
id="page3"
margin="0"
bleed="0" /></sodipodi:namedview><defs
id="defs1" /><g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-104.49603,0.25552651)"><rect
style="fill:#65a30d;fill-opacity:1;stroke:none;stroke-width:0.499507;stroke-linejoin:round;paint-order:markers stroke fill"
id="rect1-1"
width="100"
height="100.00012"
x="104.49603"
y="-0.25558716" /><path
d="m 142.75747,64.972903 h 7.61422 V 54.820616 h 2.53804 V 48.47544 q 0,-2.093907 -1.49109,-3.585027 -1.49109,-1.49111 -3.58499,-1.49111 h -2.53813 q -2.0939,0 -3.58499,1.49111 -1.49109,1.49112 -1.49109,3.585027 v 6.345176 h 2.53803 z m 3.80716,-24.111679 q 1.33243,0 2.25246,-0.920037 0.91995,-0.920037 0.91995,-2.252542 0,-1.332485 -0.91995,-2.252532 -0.91993,-0.920036 -2.25246,-0.920036 -1.33252,0 -2.25256,0.920036 -0.91994,0.920037 -0.91994,2.252532 0,1.332495 0.91994,2.252542 0.91994,0.920037 2.25256,0.920037 z m 9.96184,6.345176 h 12.6904 l -6.3452,-10.152274 z m 6.3452,15.228432 6.3452,-10.152284 h -12.6904 z m -25.38069,12.309636 q -3.36291,0 -5.67889,-2.315986 -2.31606,-2.315986 -2.31606,-5.678936 V 32.7394 q 0,-3.362945 2.31606,-5.678933 2.31598,-2.315988 5.67889,-2.315988 h 34.01019 q 3.36292,0 5.67889,2.315988 2.31597,2.315988 2.31597,5.678933 v 34.010146 q 0,3.36295 -2.31597,5.678936 -2.31597,2.315986 -5.67889,2.315986 z"
id="path1-3-2"
style="fill:#ffffff;fill-opacity:1;stroke-width:0.0634518" /></g></svg>

Before

Width:  |  Height:  |  Size: 2.8 KiB

View file

@ -1,55 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="100mm"
height="100mm"
viewBox="0 0 100 100"
version="1.1"
id="svg1"
xml:space="preserve"
inkscape:version="1.3 (1:1.3+202307231459+0e150ed6c4)"
sodipodi:docname="favicon_source.svg"
inkscape:export-filename="favicon-transparent.png"
inkscape:export-xdpi="130.048"
inkscape:export-ydpi="130.048"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
inkscape:zoom="0.9145201"
inkscape:cx="549.46851"
inkscape:cy="179.87576"
inkscape:window-width="1920"
inkscape:window-height="1085"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1"><inkscape:page
x="0"
y="0"
width="100"
height="100"
id="page4"
inkscape:export-filename="favicon-maskable.svg"
inkscape:export-xdpi="130.048"
inkscape:export-ydpi="130.048"
margin="0"
bleed="0" /></sodipodi:namedview><defs
id="defs1" /><g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-214.49603)"><path
d="m 249.23591,69.79696 h 9.89848 V 56.598986 h 3.29945 v -8.248729 q 0,-2.722078 -1.93842,-4.660534 -1.93841,-1.938444 -4.66048,-1.938444 h -3.29958 q -2.72207,0 -4.66048,1.938444 -1.93842,1.938456 -1.93842,4.660534 v 8.248729 h 3.29945 z m 4.9493,-31.345184 q 1.73216,0 2.9282,-1.196048 1.19593,-1.196047 1.19593,-2.928304 0,-1.73223 -1.19593,-2.928291 -1.19591,-1.196048 -2.9282,-1.196048 -1.73228,0 -2.92832,1.196048 -1.19593,1.196048 -1.19593,2.928291 0,1.732244 1.19593,2.928304 1.19591,1.196048 2.92832,1.196048 z m 12.9504,8.24873 h 16.49751 l -8.24876,-13.197957 z m 8.24875,19.796961 8.24876,-13.19797 h -16.49751 z m -32.9949,16.002526 q -4.37178,0 -7.38255,-3.010781 -3.01088,-3.010782 -3.01088,-7.382617 V 27.893406 q 0,-4.37183 3.01088,-7.382614 3.01077,-3.010784 7.38255,-3.010784 h 44.21326 q 4.37179,0 7.38255,3.010784 3.01076,3.010784 3.01076,7.382614 v 44.213189 q 0,4.371835 -3.01076,7.382617 -3.01076,3.010781 -7.38255,3.010781 z"
id="path1-3"
style="fill:#000000;fill-opacity:1;stroke-width:0.0824873" /></g></svg>

Before

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.7 KiB

View file

@ -1,58 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="100mm"
height="100mm"
viewBox="0 0 100 100"
version="1.1"
id="svg1"
xml:space="preserve"
inkscape:version="1.3 (1:1.3+202307231459+0e150ed6c4)"
sodipodi:docname="favicon_source.svg"
inkscape:export-filename="favicon-transparent.png"
inkscape:export-xdpi="130.048"
inkscape:export-ydpi="130.048"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
inkscape:zoom="0.9145201"
inkscape:cx="549.46851"
inkscape:cy="179.87576"
inkscape:window-width="1920"
inkscape:window-height="1085"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1"><inkscape:page
x="0"
y="0"
width="100"
height="100"
id="page2"
margin="0"
bleed="0" /></sodipodi:namedview><defs
id="defs1" /><g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"><rect
style="fill:#65a30d;fill-opacity:1;stroke:#ffffff;stroke-width:9.49992e-05;stroke-linecap:round;stroke-linejoin:round;-inkscape-stroke:none;paint-order:stroke fill markers"
id="rect1"
width="94.999908"
height="94.999908"
x="2.5000463"
y="2.5000463"
ry="31.407814" /><path
d="m 34.739876,69.796959 h 9.898488 V 56.598987 h 3.299445 v -8.248731 q 0,-2.722078 -1.93842,-4.660533 -1.938411,-1.938445 -4.660481,-1.938445 H 38.03933 q -2.72207,0 -4.66048,1.938445 -1.93842,1.938455 -1.93842,4.660533 v 8.248731 h 3.299446 z M 39.68918,38.451776 q 1.732156,0 2.928204,-1.196048 1.195925,-1.196048 1.195925,-2.928304 0,-1.732231 -1.195925,-2.928292 -1.195916,-1.196048 -2.928204,-1.196048 -1.732278,0 -2.928325,1.196048 -1.195925,1.196049 -1.195925,2.928292 0,1.732244 1.195925,2.928304 1.195916,1.196048 2.928325,1.196048 z m 12.950396,8.24873 H 69.137087 L 60.888325,33.502549 Z m 8.248749,19.796962 8.248762,-13.197971 H 52.639576 Z M 27.893434,82.499994 q -4.371788,0 -7.382551,-3.010781 Q 17.5,76.478431 17.5,72.106595 V 27.893406 q 0,-4.37183 3.010883,-7.382615 3.010763,-3.010784 7.382551,-3.010784 h 44.213252 q 4.371798,0 7.382553,3.010784 Q 82.5,23.521576 82.5,27.893406 v 44.213189 q 0,4.371836 -3.010761,7.382618 -3.010755,3.010781 -7.382553,3.010781 z"
id="path1-3-7"
style="fill:#ffffff;fill-opacity:1;stroke-width:0.0824873" /></g></svg>

Before

Width:  |  Height:  |  Size: 2.9 KiB

View file

@ -1,85 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="100mm"
height="100mm"
viewBox="0 0 100 100"
version="1.1"
id="svg1"
xml:space="preserve"
inkscape:version="1.3 (1:1.3+202307231459+0e150ed6c4)"
sodipodi:docname="favicon_source.svg"
inkscape:export-filename="favicon-transparent.png"
inkscape:export-xdpi="130.048"
inkscape:export-ydpi="130.048"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
inkscape:zoom="0.9145201"
inkscape:cx="549.46851"
inkscape:cy="179.87576"
inkscape:window-width="1920"
inkscape:window-height="1085"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1"><inkscape:page
x="0"
y="0"
width="100"
height="100"
id="page2"
margin="0"
bleed="0" /><inkscape:page
x="104.49603"
y="-0.25552651"
width="100"
height="100"
id="page3"
margin="0"
bleed="0" /><inkscape:page
x="214.49603"
y="0"
width="100"
height="100"
id="page4"
inkscape:export-filename="favicon-transparent.svg"
inkscape:export-xdpi="130.048"
inkscape:export-ydpi="130.048" /></sodipodi:namedview><defs
id="defs1" /><g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"><rect
style="fill:#65a30d;fill-opacity:1;stroke:#ffffff;stroke-width:9.49992e-05;stroke-linecap:round;stroke-linejoin:round;-inkscape-stroke:none;paint-order:stroke fill markers"
id="rect1"
width="94.999908"
height="94.999908"
x="2.5000463"
y="2.5000463"
ry="31.407814" /><rect
style="fill:#65a30d;fill-opacity:1;stroke:none;stroke-width:0.499507;stroke-linejoin:round;paint-order:markers stroke fill"
id="rect1-1"
width="100"
height="100.00012"
x="104.49603"
y="-0.25558716" /><path
d="m 249.23591,69.79696 h 9.89848 V 56.598986 h 3.29945 v -8.248729 q 0,-2.722078 -1.93842,-4.660534 -1.93841,-1.938444 -4.66048,-1.938444 h -3.29958 q -2.72207,0 -4.66048,1.938444 -1.93842,1.938456 -1.93842,4.660534 v 8.248729 h 3.29945 z m 4.9493,-31.345184 q 1.73216,0 2.9282,-1.196048 1.19593,-1.196047 1.19593,-2.928304 0,-1.73223 -1.19593,-2.928291 -1.19591,-1.196048 -2.9282,-1.196048 -1.73228,0 -2.92832,1.196048 -1.19593,1.196048 -1.19593,2.928291 0,1.732244 1.19593,2.928304 1.19591,1.196048 2.92832,1.196048 z m 12.9504,8.24873 h 16.49751 l -8.24876,-13.197957 z m 8.24875,19.796961 8.24876,-13.19797 h -16.49751 z m -32.9949,16.002526 q -4.37178,0 -7.38255,-3.010781 -3.01088,-3.010782 -3.01088,-7.382617 V 27.893406 q 0,-4.37183 3.01088,-7.382614 3.01077,-3.010784 7.38255,-3.010784 h 44.21326 q 4.37179,0 7.38255,3.010784 3.01076,3.010784 3.01076,7.382614 v 44.213189 q 0,4.371835 -3.01076,7.382617 -3.01076,3.010781 -7.38255,3.010781 z"
id="path1-3"
style="fill:#000000;fill-opacity:1;stroke-width:0.0824873" /><path
d="m 34.739876,69.796959 h 9.898488 V 56.598987 h 3.299445 v -8.248731 q 0,-2.722078 -1.93842,-4.660533 -1.938411,-1.938445 -4.660481,-1.938445 H 38.03933 q -2.72207,0 -4.66048,1.938445 -1.93842,1.938455 -1.93842,4.660533 v 8.248731 h 3.299446 z M 39.68918,38.451776 q 1.732156,0 2.928204,-1.196048 1.195925,-1.196048 1.195925,-2.928304 0,-1.732231 -1.195925,-2.928292 -1.195916,-1.196048 -2.928204,-1.196048 -1.732278,0 -2.928325,1.196048 -1.195925,1.196049 -1.195925,2.928292 0,1.732244 1.195925,2.928304 1.195916,1.196048 2.928325,1.196048 z m 12.950396,8.24873 H 69.137087 L 60.888325,33.502549 Z m 8.248749,19.796962 8.248762,-13.197971 H 52.639576 Z M 27.893434,82.499994 q -4.371788,0 -7.382551,-3.010781 Q 17.5,76.478431 17.5,72.106595 V 27.893406 q 0,-4.37183 3.010883,-7.382615 3.010763,-3.010784 7.382551,-3.010784 h 44.213252 q 4.371798,0 7.382553,3.010784 Q 82.5,23.521576 82.5,27.893406 v 44.213189 q 0,4.371836 -3.010761,7.382618 -3.010755,3.010781 -7.382553,3.010781 z"
id="path1-3-7"
style="fill:#ffffff;fill-opacity:1;stroke-width:0.0824873" /><path
d="m 142.75747,64.972903 h 7.61422 V 54.820616 h 2.53804 V 48.47544 q 0,-2.093907 -1.49109,-3.585027 -1.49109,-1.49111 -3.58499,-1.49111 h -2.53813 q -2.0939,0 -3.58499,1.49111 -1.49109,1.49112 -1.49109,3.585027 v 6.345176 h 2.53803 z m 3.80716,-24.111679 q 1.33243,0 2.25246,-0.920037 0.91995,-0.920037 0.91995,-2.252542 0,-1.332485 -0.91995,-2.252532 -0.91993,-0.920036 -2.25246,-0.920036 -1.33252,0 -2.25256,0.920036 -0.91994,0.920037 -0.91994,2.252532 0,1.332495 0.91994,2.252542 0.91994,0.920037 2.25256,0.920037 z m 9.96184,6.345176 h 12.6904 l -6.3452,-10.152274 z m 6.3452,15.228432 6.3452,-10.152284 h -12.6904 z m -25.38069,12.309636 q -3.36291,0 -5.67889,-2.315986 -2.31606,-2.315986 -2.31606,-5.678936 V 32.7394 q 0,-3.362945 2.31606,-5.678933 2.31598,-2.315988 5.67889,-2.315988 h 34.01019 q 3.36292,0 5.67889,2.315988 2.31597,2.315988 2.31597,5.678933 v 34.010146 q 0,3.36295 -2.31597,5.678936 -2.31597,2.315986 -5.67889,2.315986 z"
id="path1-3-2"
style="fill:#ffffff;stroke-width:0.0634518;fill-opacity:1" /></g></svg>

Before

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 101 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 78 KiB

View file

@ -6,12 +6,7 @@
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="style.css" rel="stylesheet">
<link rel="icon" type="image/png" sizes="512" href="/icons/512.png">
<link rel="icon" type="image/png" sizes="192" href="/icons/192.png">
<link rel="shortcut icon" href="/icons/favicon.svg">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/icons/favicon-transparent.svg" color="#65a30d">
<title>hvvstuhl.de</title>
<title>Barrierefreie Aufzugs-Liste</title>
</head>
<body>
<h1>Barrierefreie Aufzugs-Liste</h1>
@ -37,14 +32,15 @@
<button id="loadElevators" class="hidden">
Aktualisieren
<span data-icon="load" class="size-s spinner hidden"></span>
</button>
</button><br>
</div>
<br>
<div class="hidden" id="filters">
<input placeholder="Station suchen" id="searchStation">
<button id="stationsNearMe" aria-pressed="false">
<span data-icon="location-searching" class="size-m"></span>
Standort
Nach Entfernung sortieren
<span data-icon="load" class="size-m spinner hidden"></span>
</button>
<div id="typeFilter">
@ -79,14 +75,11 @@
<div id="dialog_layer" class="dialogs">
<div role="dialog" id="dialog_osm" aria-labelledby="dialog_osm_label" aria-modal="true" class="">
<h2 id="dialog_osm_label">
Fehlende Daten abrufen
</h2>
<button onclick="closeDialog('#dialog_osm')" class="close-modal">
<span data-icon="close" class="size-m"></span>
</button>
<h2 id="dialog_osm_label" class="dialog_label">IPv4 RDAP Info</h2>
<button onclick="closeDialog('#dialog_osm')" class="close-modal">x</button>
<hr>
<p>
Um die Stationen nach Entfernung sortieren zu können, müssen zusätzliche Daten von OpenStreetMap geladen
Um die Stationen nach Entfernung sortieren zu können müssen zusätzliche Daten von OpenStreetMap geladen
werden.
</p>
<button id="loadOsm">
@ -95,7 +88,6 @@
</button>
</div>
</div>
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript" src="elevators.js"></script>
</body>
</html>

51
main.js
View file

@ -1,51 +0,0 @@
const version = '0.6.4'
const minorVersion = version.split('.').splice(0, 2).join('.');
const numberFormat = new Intl.NumberFormat('de-DE', {
maximumFractionDigits: 1
});
Object.defineProperty(String.prototype, 'capitalize', {
value: function () {
return this.charAt(0).toUpperCase() + this.toLowerCase().slice(1);
},
enumerable: false
});
const dateTimeStyle = new Intl.DateTimeFormat('de-DE', {
dateStyle: 'medium',
timeStyle: 'medium',
timeZone: 'Europe/Berlin',
})
// set version
document.querySelector('#version').innerHTML = `v${version}`;
function openDialog(selector) {
document.querySelector('body').classList.add('has-dialog')
document.querySelector('#dialog_layer').classList.add('active')
document.querySelector(selector).classList.remove('hidden')
}
function closeDialog(selector) {
document.querySelector('body').classList.remove('has-dialog')
document.querySelector('#dialog_layer').classList.remove('active')
document.querySelector(selector).classList.add('hidden')
}
if ("serviceWorker" in navigator) {
navigator.serviceWorker.register("/sw.js")
.then((registration) => {
if (registration.installing) {
console.log('New Service Worker is installing...');
} else if (registration.waiting) {
console.log('Installed new service worker. Waiting for Update (up to 24h).');
} else if (registration.active) {
console.log('Service Worker is up to date.');
}
})
.catch((error) => {
// registration failed
console.error(`Registration failed with ${error}`);
});
}

View file

@ -1,49 +0,0 @@
{
"name": "hvvstuhl.de",
"short_name": "hvvstuhl",
"start_url": ".",
"display": "standalone",
"background_color": "#030712",
"theme_color": "#65a30d",
"description": "Barrierefreie Aufzugs-Liste",
"icons": [
{
"src": "/icons/192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icons/512.png",
"sizes": "512x512",
"type": "image/png"
},
{
"src": "/icons/512-maskable.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/icons/512-transparent.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "monochrome"
}
],
"screenshots" : [
{
"src": "images/screenshot-mobile.png",
"sizes": "430x900",
"type": "image/png",
"form_factor": "narrow",
"label": "Stationsliste"
},
{
"src": "images/screenshot-desktop.png",
"sizes": "1280x720",
"type": "image/png",
"form_factor": "wide",
"label": "Stationsliste"
}
]
}

View file

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="m256-168-88-88 224-224-224-224 88-88 224 224 224-224 88 88-224 224 224 224-88 88-224-224-224 224Z"/></svg>

Before

Width:  |  Height:  |  Size: 222 B

251
style.css
View file

@ -268,6 +268,9 @@
--color-rose-900: #881337;
--color-rose-950: #4c0519;
/* End: Colors from Tailwind CSS */
--color-red: #971616;
--color-orange: #cc6300;
--color-green: #19942e;
--bg-type-u: #006ab3;
--bg-type-s: #1a962b;
--bg-type-a: #f39100;
@ -277,31 +280,22 @@
--bg-type-a-disabled: #dfd8cf;
--bg-type-r-disabled: #b3b3b3;
--color-type-disabled: var(--color-gray-400);
--color-line-U1: #006ab3;
--color-line-U2: #e2001a;
--color-line-U3: #ffdd00;
--color-line-U4: #0098a1;
--color-line-S1: #1a962b;
--color-line-S2: #b51143;
--color-line-S3: #622181;
--color-line-S4: #be148e;
--color-line-S5: #0089bb;
--color-line-S6: #d3da00;
--bg: var(--color-gray-50);
--text: var(--color-gray-950);
--text-secondary: var(--color-gray-700);
--nav-bg: var(--color-indigo-400);
--nav-bg-hover: var(--color-indigo-200);
--nav-bg-visited: var(--color-purple-400);
--link: var(--color-indigo-600);
--link-hover: var(--color-indigo-800);
--link-visited: var(--color-purple-600);
--nav-bg: hsl(210, 60%, 50%);
--nav-bg-hover: hsl(210, 60%, 30%);
--nav-bg-visited: hsl(250, 60%, 50%);
--nav-text-visited: hsl(250, 60%, 93%);
--nav-text: hsl(210, 60%, 93%);
--link: hsl(210, 60%, 30%);
--link-hover: hsl(210, 60%, 10%);
--link-visited: hsl(250, 60%, 30%);
--station-bg: var(--color-gray-50);
--station-bg-hover: var(--color-gray-400);
--station-border: var(--color-gray-400);
--station-border-hover: var(--color-gray-600);
--elevator-bg: var(--color-gray-100);
--backdrop: rgb(0 0 0 / 20%);
--elevator-list-gap: 3rem;
--item-radius: 1.5rem;
--btn-radius: 0.8rem;
@ -314,26 +308,25 @@
}
@media (prefers-color-scheme: dark) {
:root {
--bg-type-u-disabled: #627f93;
--bg-type-s-disabled: #688b6d;
--bg-type-a-disabled: #aa987f;
--bg-type-r-disabled: #333333;
--color-type-disabled: var(--color-gray-200);
--bg: var(--color-gray-950);
--text: var(--color-gray-50);
--text-secondary: var(--color-gray-400);
--nav-bg: var(--color-indigo-800);
--nav-bg-hover: var(--color-indigo-950);
--nav-bg-visited: var(--color-purple-800);
--link: var(--color-indigo-400);
--link-hover: var(--color-indigo-200);
--link-visited: var(--color-purple-400);
--nav-bg: hsl(210, 60%, 30%);
--nav-bg-hover: hsl(210, 60%, 10%);
--nav-bg-visited: hsl(250, 60%, 30%);
--link: hsl(210, 60%, 60%);
--link-hover: hsl(210, 60%, 60%);
--link-visited: hsl(250, 60%, 70%);
--station-bg: var(--color-gray-950);
--station-bg-hover: var(--color-gray-600);
--station-border: var(--color-gray-600);
--station-border-hover: var(--color-gray-400);
--elevator-bg: var(--color-gray-900);
--backdrop: rgb(100% 100% 100% / 20%);
--bg-type-u-disabled: #627f93;
--bg-type-s-disabled: #688b6d;
--bg-type-a-disabled: #aa987f;
--bg-type-r-disabled: #333333;
--color-type-disabled: var(--color-gray-200);
}
}
@ -351,39 +344,26 @@ body.has-dialog {
right: 0;
bottom: 0;
left: 0;
z-index: 99;
background: var(--backdrop);
background: rgba(0, 0, 0, 0.3);
}
.dialogs.active {
display: block;
}
.dialogs [role=dialog] {
[role=dialog] {
box-sizing: border-box;
max-width: 800px;
margin: 0 auto;
padding: var(--space-xl);
padding-bottom: var(--space-2xl);
background-color: var(--bg);
color: var(--text);
overflow: hidden;
position: absolute;
right: 0;
bottom: 0;
left: 0;
border-radius: var(--item-radius) var(--item-radius) 0 0;
}
@media screen and (min-width: 576px) {
.dialogs [role=dialog] {
padding: 15px;
border-radius: 1rem;
background-color: var(--background);
color: var(--color);
position: relative;
border-radius: var(--item-radius);
}
}
.dialogs [role=dialog] button.close-modal {
[role=dialog] button.close-modal {
position: absolute;
top: 0;
right: 0;
border-radius: 0 0 0 var(--btn-radius);
border: none;
}
.hidden {
@ -391,20 +371,20 @@ body.has-dialog {
}
.text-red {
color: var(--color-red-800);
color: var(--color-red);
}
.text-orange {
color: var(--color-orange-500);
color: var(--color-orange);
}
.text-green {
color: var(--color-green-600);
color: var(--color-green);
}
body {
font-family: system-ui, ui-sans-serif, sans-serif;
font-size: 1rem;
font-size: 1.2rem;
background-color: var(--bg);
color: var(--text);
}
@ -417,7 +397,7 @@ a {
color: var(--link);
text-decoration: none;
}
a:hover, a:visited:hover {
a:hover {
text-decoration: underline;
color: var(--link-hover);
}
@ -435,18 +415,18 @@ nav ul {
}
nav ul li a {
font-weight: bold;
color: var(--text);
color: var(--nav-text);
text-decoration: none;
background-color: var(--nav-bg);
padding: var(--space-m) var(--space-l);
cursor: pointer;
}
nav ul li a:hover, nav ul li a:visited:hover {
nav ul li a:hover {
text-decoration: underline;
background-color: var(--nav-bg-hover);
}
nav ul li a:visited {
color: var(--text);
color: var(--nav-text-visited);
background-color: var(--nav-bg-visited);
}
@ -500,13 +480,6 @@ div#updateInfo {
align-items: center;
gap: var(--space-m);
justify-content: end;
flex-direction: column;
margin-bottom: var(--space-l);
}
@media screen and (min-width: 576px) {
div#updateInfo {
flex-direction: row;
}
}
div#updateInfo #oldDataWarning {
color: var(--color-red-600);
@ -517,7 +490,10 @@ div#filters {
display: flex;
flex-wrap: wrap;
gap: var(--space-m);
justify-content: center;
justify-content: stretch;
}
div#filters button, div#filters input {
font-size: 1.5rem;
}
div#filters > * {
width: 100%;
@ -527,63 +503,8 @@ div#filters > * {
@media screen and (min-width: 576px) {
div#filters > * {
width: auto;
min-width: 0;
}
}
div#filters input#searchStation {
flex-grow: 1;
font-size: 1.5rem;
min-width: 10ch;
}
div#filters button#stationsNearMe {
font-size: 1.5rem;
}
div#filters div#typeFilter {
font-size: 1.5rem;
display: flex;
justify-content: center;
flex-shrink: 0;
min-height: var(--space-2xl);
gap: var(--space-m);
}
div#filters div#typeFilter button.typeChip {
flex-shrink: 0;
padding: 0;
height: var(--space-2xl);
aspect-ratio: 1/1;
justify-content: center;
align-items: center;
position: relative;
overflow: hidden;
border-radius: 9999px;
}
div#filters div#typeFilter button.typeChip[data-type=U], div#filters div#typeFilter button.typeChip[data-type=S], div#filters div#typeFilter button.typeChip[data-type=A], div#filters div#typeFilter button.typeChip[data-type=R] {
border: solid 2px var(--text);
}
div#filters div#typeFilter button.typeChip[data-type=U][data-pressed=false], div#filters div#typeFilter button.typeChip[data-type=S][data-pressed=false], div#filters div#typeFilter button.typeChip[data-type=A][data-pressed=false], div#filters div#typeFilter button.typeChip[data-type=R][data-pressed=false] {
background-color: var(--color-gray-500);
color: var(--color-type-disabled);
}
div#filters div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=U], div#filters div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=U], div#filters div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=U], div#filters div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=U] {
background-color: var(--bg-type-u-disabled);
}
div#filters div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=S], div#filters div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=S], div#filters div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=S], div#filters div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=S] {
background-color: var(--bg-type-s-disabled);
}
div#filters div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=A], div#filters div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=A], div#filters div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=A], div#filters div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=A] {
background-color: var(--bg-type-a-disabled);
}
div#filters div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=R], div#filters div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=R], div#filters div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=R], div#filters div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=R] {
background-color: var(--bg-type-r-disabled);
}
div#filters div#typeFilter button.typeChip[data-type=U][data-pressed=false]::after, div#filters div#typeFilter button.typeChip[data-type=S][data-pressed=false]::after, div#filters div#typeFilter button.typeChip[data-type=A][data-pressed=false]::after, div#filters div#typeFilter button.typeChip[data-type=R][data-pressed=false]::after {
position: absolute;
content: "";
width: 144%;
height: 0.4rem;
background-color: var(--color-gray-700);
transform: rotate(-45deg);
}
button#initialLoad {
font-size: 1.5rem;
@ -594,7 +515,7 @@ button.loadOSM {
}
div#errorMessage {
border: solid 2px var(--color-red-600);
border: solid 2px var(--color-red);
border-radius: var(--item-radius);
padding: var(--space-xl) var(--space-xl);
margin-top: var(--space-l);
@ -917,61 +838,104 @@ span.lineChip, span.typeChip, button.typeChip {
}
span.lineChip[data-type=U], span.typeChip[data-type=U], button.typeChip[data-type=U] {
background-color: var(--bg-type-u);
color: var(--color-white);
color: #ffffff;
}
span.lineChip[data-type=U][data-line=U1], span.typeChip[data-type=U][data-line=U1], button.typeChip[data-type=U][data-line=U1] {
background-color: var(--color-line-U1);
background-color: #006ab3;
}
span.lineChip[data-type=U][data-line=U2], span.typeChip[data-type=U][data-line=U2], button.typeChip[data-type=U][data-line=U2] {
background-color: var(--color-line-U2);
background-color: #e2001a;
}
span.lineChip[data-type=U][data-line=U3], span.typeChip[data-type=U][data-line=U3], button.typeChip[data-type=U][data-line=U3] {
background-color: var(--color-line-U3);
color: var(--color-black);
background-color: #ffdd00;
color: #000000;
}
span.lineChip[data-type=U][data-line=U4], span.typeChip[data-type=U][data-line=U4], button.typeChip[data-type=U][data-line=U4] {
background-color: var(--color-line-U4);
}
span.lineChip[data-type=U][data-line=U5], span.typeChip[data-type=U][data-line=U5], button.typeChip[data-type=U][data-line=U5] {
background-color: var(--color-line-U5);
background-color: #0098a1;
}
span.lineChip[data-type=S], span.typeChip[data-type=S], button.typeChip[data-type=S] {
background-color: var(--bg-type-s);
color: var(--color-white);
color: #ffffff;
}
span.lineChip[data-type=S][data-line=S1], span.typeChip[data-type=S][data-line=S1], button.typeChip[data-type=S][data-line=S1] {
background-color: var(--color-line-S1);
background-color: #1a962b;
}
span.lineChip[data-type=S][data-line=S2], span.typeChip[data-type=S][data-line=S2], button.typeChip[data-type=S][data-line=S2] {
background-color: var(--color-line-S2);
background-color: #b51143;
}
span.lineChip[data-type=S][data-line=S3], span.typeChip[data-type=S][data-line=S3], button.typeChip[data-type=S][data-line=S3] {
background-color: var(--color-line-S3);
background-color: #622181;
}
span.lineChip[data-type=S][data-line=S4], span.typeChip[data-type=S][data-line=S4], button.typeChip[data-type=S][data-line=S4] {
background-color: var(--color-line-S4);
background-color: #be148e;
}
span.lineChip[data-type=S][data-line=S5], span.typeChip[data-type=S][data-line=S5], button.typeChip[data-type=S][data-line=S5] {
background-color: var(--color-line-S5);
background-color: #0089bb;
}
span.lineChip[data-type=S][data-line=S6], span.typeChip[data-type=S][data-line=S6], button.typeChip[data-type=S][data-line=S6] {
background-color: var(--color-line-S6);
color: var(--color-black);
background-color: #d3da00;
color: #000000;
}
span.lineChip[data-type=A], span.typeChip[data-type=A], button.typeChip[data-type=A] {
background-color: var(--bg-type-a);
color: var(--color-white);
color: #ffffff;
}
span.lineChip[data-type=R], span.typeChip[data-type=R], button.typeChip[data-type=R] {
background-color: var(--bg-type-r);
color: var(--color-white);
color: #ffffff;
}
@media (prefers-color-scheme: dark) {
span.lineChip[data-type=R], span.typeChip[data-type=R], button.typeChip[data-type=R] {
border: solid 2px var(--color-white);
border: solid 2px #ffffff;
}
}
div#typeFilter {
display: flex;
flex-grow: 1;
flex-wrap: nowrap;
flex-shrink: 0;
min-height: var(--space-2xl);
gap: var(--space-m);
}
div#typeFilter button.typeChip {
padding: 0;
height: 100%;
aspect-ratio: 1/1;
justify-content: center;
align-items: center;
position: relative;
overflow: hidden;
}
div#typeFilter button.typeChip[data-type=U], div#typeFilter button.typeChip[data-type=S], div#typeFilter button.typeChip[data-type=A], div#typeFilter button.typeChip[data-type=R] {
border: solid 2px var(--station-border);
}
div#typeFilter button.typeChip[data-type=U][data-pressed=false], div#typeFilter button.typeChip[data-type=S][data-pressed=false], div#typeFilter button.typeChip[data-type=A][data-pressed=false], div#typeFilter button.typeChip[data-type=R][data-pressed=false] {
background-color: var(--color-gray-500);
color: var(--color-type-disabled);
}
div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=U], div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=U], div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=U], div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=U] {
background-color: var(--bg-type-u-disabled);
}
div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=S], div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=S], div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=S], div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=S] {
background-color: var(--bg-type-s-disabled);
}
div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=A], div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=A], div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=A], div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=A] {
background-color: var(--bg-type-a-disabled);
}
div#typeFilter button.typeChip[data-type=U][data-pressed=false][data-type=R], div#typeFilter button.typeChip[data-type=S][data-pressed=false][data-type=R], div#typeFilter button.typeChip[data-type=A][data-pressed=false][data-type=R], div#typeFilter button.typeChip[data-type=R][data-pressed=false][data-type=R] {
background-color: var(--bg-type-r-disabled);
}
div#typeFilter button.typeChip[data-type=U][data-pressed=false]::after, div#typeFilter button.typeChip[data-type=S][data-pressed=false]::after, div#typeFilter button.typeChip[data-type=A][data-pressed=false]::after, div#typeFilter button.typeChip[data-type=R][data-pressed=false]::after {
position: absolute;
content: "";
width: 144%;
height: 0.4rem;
background-color: var(--color-gray-500);
opacity: 80%;
transform: rotate(-45deg);
}
span.lineChip {
padding: 0.3em 0.6em;
min-width: 4ch;
@ -1081,9 +1045,6 @@ span[data-icon][data-icon=location-searching] {
span[data-icon][data-icon=load] {
mask-image: url(/md_icons/load.svg);
}
span[data-icon][data-icon=close] {
mask-image: url(/md_icons/close.svg);
}
span[data-icon].spinner {
animation-delay: 0s;
animation-direction: normal;

View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["style.scss","colors.scss"],"names":[],"mappings":"AAMA;ACLE;;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAwBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;ED/PA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAIA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EAgCA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAtCA;EApDF;IAsDI;IACA;IACA;IACA;IACA;IAGA;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;IAEA;IACA;IACA;IACA;IACA;IAEA;;;;AAeF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAfF;IAgBI;IACA;;;AAIA;EACE;EACA;EACA;EACA;EACA;;;AAMR;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EAGA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGE;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AAOV;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;;;AAGF;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AACA;EAJF;IAKI;IACA;;;AAIJ;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAQZ;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAKJ;EACE;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EAEA;;AAEA;EAPF;IAQI;;;AAIJ;EACE;EAEA;EACA;EACA;EACA;;AAEA;EARF;IASI;IACA;IACA;;;AAMR;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EAjCF;IAkCI;;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;;AACA;EATF;IAUI;IACA;IACA;;;AAIF;EACE;EACA;;AACA;EAHF;IAII;;;AAKJ;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EAEA;;AACA;EARF;IASI;;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAGE;EADF;IAEI;;;AAKF;EADF;IAEI;;;AAKJ;EACE;EACA;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAOA;EACE;;AAMR;EACE;EACA;EACA;EAEA;EACA;;AAEA;EACE;EAEA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAKF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;;;AAIJ;EACE;EACA;EAEA;;AAEA;EANF;IAOI;;;;AAYpB;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;AAEA;EAJF;IAKI;;;;AAMN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EAMA;EACA;EACA;EACA;EACA;EACA;EACA;;AAVA;EACE;;AAWF;EAIE;EACA;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;IACE","file":"style.css"}
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAMA;AAEE;;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAwBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EAEA;EACA;EACA;EAOA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EA0BA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAhCA;EArTF;IAsTI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAEA;IACA;IACA;IACA;IACA;;;;AAgBF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGE;EACE;EACA;EACA;;;AAKN;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EAGA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGE;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AAOV;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AACA;EAJF;IAKI;;;;AAKN;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAKJ;EACE;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EAEA;;AAEA;EAPF;IAQI;;;AAIJ;EACE;EAEA;EACA;EACA;EACA;;AAEA;EARF;IASI;IACA;IACA;;;AAMR;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EAjCF;IAkCI;;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;;AACA;EATF;IAUI;IACA;IACA;;;AAIF;EACE;EACA;;AACA;EAHF;IAII;;;AAKJ;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EAEA;;AACA;EARF;IASI;;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAGE;EADF;IAEI;;;AAKF;EADF;IAEI;;;AAKJ;EACE;EACA;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAOA;EACE;;AAMR;EACE;EACA;EACA;EAEA;EACA;;AAEA;EACE;EAEA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAKF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;;;AAIJ;EACE;EACA;EAEA;;AAEA;EANF;IAOI;;;;AAYpB;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAIJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;AAEA;EAJF;IAKI;;;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAQV;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EAMA;EACA;EACA;EACA;EACA;EACA;EACA;;AAVA;EACE;;AAWF;EAIE;EACA;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;IACE","file":"style.css"}

View file

@ -1,13 +1,287 @@
@import "colors";
@use 'sass:color';
$mobileBreakpoint: 576px;
$smallBreakpoint: 400px;
$mediumBreakpoint: 800px;
:root {
@include tailwindColors();
// LineType Colors
/* Colors from Tailwind CSS: https://github.com/tailwindlabs/tailwindcss
MIT License
Copyright (c) Tailwind Labs, Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/
--color-black: #000;
--color-white: #fff;
--color-slate-50: #f8fafc;
--color-slate-100: #f1f5f9;
--color-slate-200: #e2e8f0;
--color-slate-300: #cbd5e1;
--color-slate-400: #94a3b8;
--color-slate-500: #64748b;
--color-slate-600: #475569;
--color-slate-700: #334155;
--color-slate-800: #1e293b;
--color-slate-900: #0f172a;
--color-slate-950: #020617;
--color-gray-50: #f9fafb;
--color-gray-100: #f3f4f6;
--color-gray-200: #e5e7eb;
--color-gray-300: #d1d5db;
--color-gray-400: #9ca3af;
--color-gray-500: #6b7280;
--color-gray-600: #4b5563;
--color-gray-700: #374151;
--color-gray-800: #1f2937;
--color-gray-900: #111827;
--color-gray-950: #030712;
--color-zinc-50: #fafafa;
--color-zinc-100: #f4f4f5;
--color-zinc-200: #e4e4e7;
--color-zinc-300: #d4d4d8;
--color-zinc-400: #a1a1aa;
--color-zinc-500: #71717a;
--color-zinc-600: #52525b;
--color-zinc-700: #3f3f46;
--color-zinc-800: #27272a;
--color-zinc-900: #18181b;
--color-zinc-950: #09090b;
--color-neutral-50: #fafafa;
--color-neutral-100: #f5f5f5;
--color-neutral-200: #e5e5e5;
--color-neutral-300: #d4d4d4;
--color-neutral-400: #a3a3a3;
--color-neutral-500: #737373;
--color-neutral-600: #525252;
--color-neutral-700: #404040;
--color-neutral-800: #262626;
--color-neutral-900: #171717;
--color-neutral-950: #0a0a0a;
--color-stone-50: #fafaf9;
--color-stone-100: #f5f5f4;
--color-stone-200: #e7e5e4;
--color-stone-300: #d6d3d1;
--color-stone-400: #a8a29e;
--color-stone-500: #78716c;
--color-stone-600: #57534e;
--color-stone-700: #44403c;
--color-stone-800: #292524;
--color-stone-900: #1c1917;
--color-stone-950: #0c0a09;
--color-red-50: #fef2f2;
--color-red-100: #fee2e2;
--color-red-200: #fecaca;
--color-red-300: #fca5a5;
--color-red-400: #f87171;
--color-red-500: #ef4444;
--color-red-600: #dc2626;
--color-red-700: #b91c1c;
--color-red-800: #991b1b;
--color-red-900: #7f1d1d;
--color-red-950: #450a0a;
--color-orange-50: #fff7ed;
--color-orange-100: #ffedd5;
--color-orange-200: #fed7aa;
--color-orange-300: #fdba74;
--color-orange-400: #fb923c;
--color-orange-500: #f97316;
--color-orange-600: #ea580c;
--color-orange-700: #c2410c;
--color-orange-800: #9a3412;
--color-orange-900: #7c2d12;
--color-orange-950: #431407;
--color-amber-50: #fffbeb;
--color-amber-100: #fef3c7;
--color-amber-200: #fde68a;
--color-amber-300: #fcd34d;
--color-amber-400: #fbbf24;
--color-amber-500: #f59e0b;
--color-amber-600: #d97706;
--color-amber-700: #b45309;
--color-amber-800: #92400e;
--color-amber-900: #78350f;
--color-amber-950: #451a03;
--color-yellow-50: #fefce8;
--color-yellow-100: #fef9c3;
--color-yellow-200: #fef08a;
--color-yellow-300: #fde047;
--color-yellow-400: #facc15;
--color-yellow-500: #eab308;
--color-yellow-600: #ca8a04;
--color-yellow-700: #a16207;
--color-yellow-800: #854d0e;
--color-yellow-900: #713f12;
--color-yellow-950: #422006;
--color-lime-50: #f7fee7;
--color-lime-100: #ecfccb;
--color-lime-200: #d9f99d;
--color-lime-300: #bef264;
--color-lime-400: #a3e635;
--color-lime-500: #84cc16;
--color-lime-600: #65a30d;
--color-lime-700: #4d7c0f;
--color-lime-800: #3f6212;
--color-lime-900: #365314;
--color-lime-950: #1a2e05;
--color-green-50: #f0fdf4;
--color-green-100: #dcfce7;
--color-green-200: #bbf7d0;
--color-green-300: #86efac;
--color-green-400: #4ade80;
--color-green-500: #22c55e;
--color-green-600: #16a34a;
--color-green-700: #15803d;
--color-green-800: #166534;
--color-green-900: #14532d;
--color-green-950: #052e16;
--color-emerald-50: #ecfdf5;
--color-emerald-100: #d1fae5;
--color-emerald-200: #a7f3d0;
--color-emerald-300: #6ee7b7;
--color-emerald-400: #34d399;
--color-emerald-500: #10b981;
--color-emerald-600: #059669;
--color-emerald-700: #047857;
--color-emerald-800: #065f46;
--color-emerald-900: #064e3b;
--color-emerald-950: #022c22;
--color-teal-50: #f0fdfa;
--color-teal-100: #ccfbf1;
--color-teal-200: #99f6e4;
--color-teal-300: #5eead4;
--color-teal-400: #2dd4bf;
--color-teal-500: #14b8a6;
--color-teal-600: #0d9488;
--color-teal-700: #0f766e;
--color-teal-800: #115e59;
--color-teal-900: #134e4a;
--color-teal-950: #042f2e;
--color-cyan-50: #ecfeff;
--color-cyan-100: #cffafe;
--color-cyan-200: #a5f3fc;
--color-cyan-300: #67e8f9;
--color-cyan-400: #22d3ee;
--color-cyan-500: #06b6d4;
--color-cyan-600: #0891b2;
--color-cyan-700: #0e7490;
--color-cyan-800: #155e75;
--color-cyan-900: #164e63;
--color-cyan-950: #083344;
--color-sky-50: #f0f9ff;
--color-sky-100: #e0f2fe;
--color-sky-200: #bae6fd;
--color-sky-300: #7dd3fc;
--color-sky-400: #38bdf8;
--color-sky-500: #0ea5e9;
--color-sky-600: #0284c7;
--color-sky-700: #0369a1;
--color-sky-800: #075985;
--color-sky-900: #0c4a6e;
--color-sky-950: #082f49;
--color-blue-50: #eff6ff;
--color-blue-100: #dbeafe;
--color-blue-200: #bfdbfe;
--color-blue-300: #93c5fd;
--color-blue-400: #60a5fa;
--color-blue-500: #3b82f6;
--color-blue-600: #2563eb;
--color-blue-700: #1d4ed8;
--color-blue-800: #1e40af;
--color-blue-900: #1e3a8a;
--color-blue-950: #172554;
--color-indigo-50: #eef2ff;
--color-indigo-100: #e0e7ff;
--color-indigo-200: #c7d2fe;
--color-indigo-300: #a5b4fc;
--color-indigo-400: #818cf8;
--color-indigo-500: #6366f1;
--color-indigo-600: #4f46e5;
--color-indigo-700: #4338ca;
--color-indigo-800: #3730a3;
--color-indigo-900: #312e81;
--color-indigo-950: #1e1b4b;
--color-violet-50: #f5f3ff;
--color-violet-100: #ede9fe;
--color-violet-200: #ddd6fe;
--color-violet-300: #c4b5fd;
--color-violet-400: #a78bfa;
--color-violet-500: #8b5cf6;
--color-violet-600: #7c3aed;
--color-violet-700: #6d28d9;
--color-violet-800: #5b21b6;
--color-violet-900: #4c1d95;
--color-violet-950: #2e1065;
--color-purple-50: #faf5ff;
--color-purple-100: #f3e8ff;
--color-purple-200: #e9d5ff;
--color-purple-300: #d8b4fe;
--color-purple-400: #c084fc;
--color-purple-500: #a855f7;
--color-purple-600: #9333ea;
--color-purple-700: #7e22ce;
--color-purple-800: #6b21a8;
--color-purple-900: #581c87;
--color-purple-950: #3b0764;
--color-fuchsia-50: #fdf4ff;
--color-fuchsia-100: #fae8ff;
--color-fuchsia-200: #f5d0fe;
--color-fuchsia-300: #f0abfc;
--color-fuchsia-400: #e879f9;
--color-fuchsia-500: #d946ef;
--color-fuchsia-600: #c026d3;
--color-fuchsia-700: #a21caf;
--color-fuchsia-800: #86198f;
--color-fuchsia-900: #701a75;
--color-fuchsia-950: #4a044e;
--color-pink-50: #fdf2f8;
--color-pink-100: #fce7f3;
--color-pink-200: #fbcfe8;
--color-pink-300: #f9a8d4;
--color-pink-400: #f472b6;
--color-pink-500: #ec4899;
--color-pink-600: #db2777;
--color-pink-700: #be185d;
--color-pink-800: #9d174d;
--color-pink-900: #831843;
--color-pink-950: #500724;
--color-rose-50: #fff1f2;
--color-rose-100: #ffe4e6;
--color-rose-200: #fecdd3;
--color-rose-300: #fda4af;
--color-rose-400: #fb7185;
--color-rose-500: #f43f5e;
--color-rose-600: #e11d48;
--color-rose-700: #be123c;
--color-rose-800: #9f1239;
--color-rose-900: #881337;
--color-rose-950: #4c0519;
/* End: Colors from Tailwind CSS */
--color-red: #971616;
--color-orange: #cc6300;
--color-green: #19942e;
$colorTypeU: #006ab3;
$colorTypeS: #1a962b;
$colorTypeA: #f39100;
@ -22,68 +296,45 @@ $mediumBreakpoint: 800px;
--bg-type-r-disabled: #{scale-color($colorTypeR, $saturation: -80%, $lightness: +70%)};
--color-type-disabled: var(--color-gray-400);
// Line Colors
--color-line-U1: #006ab3;
--color-line-U2: #e2001a;
--color-line-U3: #ffdd00;
--color-line-U4: #0098a1;
--color-line-S1: #1a962b;
--color-line-S2: #b51143;
--color-line-S3: #622181;
--color-line-S4: #be148e;
--color-line-S5: #0089bb;
--color-line-S6: #d3da00;
// Component Styles
--bg: var(--color-gray-50);
--text: var(--color-gray-950);
--text-secondary: var(--color-gray-700);
--nav-bg: var(--color-indigo-400);
--nav-bg-hover: var(--color-indigo-200);
--nav-bg-visited: var(--color-purple-400);
--link: var(--color-indigo-600);
--link-hover: var(--color-indigo-800);
--link-visited: var(--color-purple-600);
--nav-bg: hsl(210, 60%, 50%);
--nav-bg-hover: hsl(210, 60%, 30%);
--nav-bg-visited: hsl(250, 60%, 50%);
--nav-text-visited: hsl(250, 60%, 93%);
--nav-text: hsl(210, 60%, 93%);
--link: hsl(210, 60%, 30%);
--link-hover: hsl(210, 60%, 10%);
--link-visited: hsl(250, 60%, 30%);
--station-bg: var(--color-gray-50);
--station-bg-hover: var(--color-gray-400);
--station-border: var(--color-gray-400);
--station-border-hover: var(--color-gray-600);
--elevator-bg: var(--color-gray-100);
--backdrop: rgb(0 0 0 / 20%);
@media (prefers-color-scheme: dark) {
// LineType Colors
--bg-type-u-disabled: #{scale-color($colorTypeU, $saturation: -80%, $lightness: +20%)};
--bg-type-s-disabled: #{scale-color($colorTypeS, $saturation: -80%, $lightness: +20%)};
--bg-type-a-disabled: #{scale-color($colorTypeA, $saturation: -80%, $lightness: +20%)};
--bg-type-r-disabled: #{scale-color($colorTypeR, $saturation: -80%, $lightness: +20%)};
--color-type-disabled: var(--color-gray-200);
// Component Styles
--bg: var(--color-gray-950);
--text: var(--color-gray-50);
--text-secondary: var(--color-gray-400);
--nav-bg: var(--color-indigo-800);
--nav-bg-hover: var(--color-indigo-950);
--nav-bg-visited: var(--color-purple-800);
--link: var(--color-indigo-400);
--link-hover: var(--color-indigo-200);
--link-visited: var(--color-purple-400);
--nav-bg: hsl(210, 60%, 30%);
--nav-bg-hover: hsl(210, 60%, 10%);
--nav-bg-visited: hsl(250, 60%, 30%);
--link: hsl(210, 60%, 60%);
--link-hover: hsl(210, 60%, 60%);
--link-visited: hsl(250, 60%, 70%);
--station-bg: var(--color-gray-950);
--station-bg-hover: var(--color-gray-600);
--station-border: var(--color-gray-600);
--station-border-hover: var(--color-gray-400);
--elevator-bg: var(--color-gray-900);
--backdrop: rgb(100% 100% 100% / 20%);
--bg-type-u-disabled: #{scale-color($colorTypeU, $saturation: -80%, $lightness: +20%)};
--bg-type-s-disabled: #{scale-color($colorTypeS, $saturation: -80%, $lightness: +20%)};
--bg-type-a-disabled: #{scale-color($colorTypeA, $saturation: -80%, $lightness: +20%)};
--bg-type-r-disabled: #{scale-color($colorTypeR, $saturation: -80%, $lightness: +20%)};
--color-type-disabled: var(--color-gray-200);
}
--elevator-list-gap: 3rem;
@ -113,42 +364,29 @@ body {
right: 0;
bottom: 0;
left: 0;
z-index: 99;
background: var(--backdrop);
background: rgb(0 0 0 / 30%);
&.active {
display: block;
}
}
[role="dialog"] {
[role="dialog"] {
box-sizing: border-box;
max-width: 800px;
margin: 0 auto;
padding: var(--space-xl);
padding-bottom: var(--space-2xl);
background-color: var(--bg);
color: var(--text);
overflow: hidden;
position: absolute;
right: 0;
bottom: 0;
left: 0;
border-radius: var(--item-radius) var(--item-radius) 0 0;
@media screen and (min-width: $mobileBreakpoint) {
padding: 15px;
border-radius: 1rem;
background-color: var(--background);
color: var(--color);
position: relative;
border-radius: var(--item-radius);
}
button {
&.close-modal {
position: absolute;
top: 0;
right: 0;
border-radius: 0 0 0 var(--btn-radius);
border: none;
}
}
}
}
@ -158,20 +396,20 @@ body {
}
.text-red {
color: var(--color-red-800);
color: var(--color-red);
}
.text-orange {
color: var(--color-orange-500);
color: var(--color-orange);
}
.text-green {
color: var(--color-green-600);
color: var(--color-green);
}
body {
font-family: system-ui, ui-sans-serif, sans-serif;
font-size: 1rem;
font-size: 1.2rem;
// colors
background-color: var(--bg);
@ -186,7 +424,7 @@ a {
color: var(--link);
text-decoration: none;
&:hover, &:visited:hover {
&:hover {
text-decoration: underline;
color: var(--link-hover);
}
@ -208,20 +446,20 @@ nav {
li {
a {
font-weight: bold;
color: var(--text);
color: var(--nav-text);
text-decoration: none;
background-color: var(--nav-bg);
padding: var(--space-m) var(--space-l);
cursor: pointer;
&:hover, &:visited:hover {
&:hover {
text-decoration: underline;
background-color: var(--nav-bg-hover);
}
&:visited {
color: var(--text);
color: var(--nav-text-visited);
background-color: var(--nav-bg-visited);
}
}
@ -284,12 +522,6 @@ div#updateInfo {
align-items: center;
gap: var(--space-m);
justify-content: end;
flex-direction: column;
margin-bottom: var(--space-l);
@media screen and (min-width: $mobileBreakpoint) {
flex-direction: row;
}
#oldDataWarning {
color: var(--color-red-600);
@ -301,7 +533,11 @@ div#filters {
display: flex;
flex-wrap: wrap;
gap: var(--space-m);
justify-content: center;
justify-content: stretch;
button, input {
font-size: 1.5rem;
}
> * {
width: 100%;
@ -309,72 +545,6 @@ div#filters {
text-align: center;
@media screen and (min-width: $mobileBreakpoint) {
width: auto;
min-width: 0;
}
}
input#searchStation {
flex-grow: 1;
font-size: 1.5rem;
min-width: 10ch;
}
button#stationsNearMe {
font-size: 1.5rem;
}
div#typeFilter {
font-size: 1.5rem;
display: flex;
justify-content: center;
flex-shrink: 0;
min-height: var(--space-2xl);
gap: var(--space-m);
button.typeChip {
flex-shrink: 0;
padding: 0;
height: var(--space-2xl);
aspect-ratio: 1/1;
justify-content: center;
align-items: center;
position: relative;
overflow: hidden;
border-radius: 9999px;
&[data-type="U"], &[data-type="S"], &[data-type="A"], &[data-type="R"] {
border: solid 2px var(--text);
&[data-pressed="false"] {
background-color: var(--color-gray-500);
color: var(--color-type-disabled);
&[data-type="U"] {
background-color: var(--bg-type-u-disabled);
}
&[data-type="S"] {
background-color: var(--bg-type-s-disabled);
}
&[data-type="A"] {
background-color: var(--bg-type-a-disabled);
}
&[data-type="R"] {
background-color: var(--bg-type-r-disabled);
}
&::after {
position: absolute;
content: '';
width: 144%;
height: 0.4rem;
background-color: var(--color-gray-700);
transform: rotate(-45deg);
}
}
}
}
}
}
@ -388,7 +558,7 @@ button.loadOSM {
}
div#errorMessage {
border: solid 2px var(--color-red-600);
border: solid 2px var(--color-red);
border-radius: var(--item-radius);
padding: var(--space-xl) var(--space-xl);
margin-top: var(--space-l);
@ -769,71 +939,122 @@ span.lineChip, span.typeChip, button.typeChip {
&[data-type="U"] {
background-color: var(--bg-type-u);
color: var(--color-white);
color: #ffffff;
&[data-line="U1"] {
background-color: var(--color-line-U1);
background-color: #006ab3;
}
&[data-line="U2"] {
background-color: var(--color-line-U2);
background-color: #e2001a;
}
&[data-line="U3"] {
background-color: var(--color-line-U3);
color: var(--color-black);
background-color: #ffdd00;
color: #000000;
}
&[data-line="U4"] {
background-color: var(--color-line-U4);
}
&[data-line="U5"] {
background-color: var(--color-line-U5);
background-color: #0098a1;
}
}
&[data-type="S"] {
background-color: var(--bg-type-s);
color: var(--color-white);
color: #ffffff;
&[data-line="S1"] {
background-color: var(--color-line-S1);
background-color: #1a962b;
}
&[data-line="S2"] {
background-color: var(--color-line-S2);
background-color: #b51143;
}
&[data-line="S3"] {
background-color: var(--color-line-S3);
background-color: #622181;
}
&[data-line="S4"] {
background-color: var(--color-line-S4);
background-color: #be148e;
}
&[data-line="S5"] {
background-color: var(--color-line-S5);
background-color: #0089bb;
}
&[data-line="S6"] {
background-color: var(--color-line-S6);
color: var(--color-black);
background-color: #d3da00;
color: #000000;
}
}
&[data-type="A"] {
background-color: var(--bg-type-a);
color: var(--color-white);
color: #ffffff;
}
&[data-type="R"] {
background-color: var(--bg-type-r);
color: var(--color-white);
color: #ffffff;
@media (prefers-color-scheme: dark) {
border: solid 2px var(--color-white);
border: solid 2px #ffffff;
}
}
}
div#typeFilter {
display: flex;
flex-grow: 1;
flex-wrap: nowrap;
flex-shrink: 0;
min-height: var(--space-2xl);
gap: var(--space-m);
button.typeChip {
padding: 0;
height: 100%;
aspect-ratio: 1/1;
justify-content: center;
align-items: center;
position: relative;
overflow: hidden;
&[data-type="U"], &[data-type="S"], &[data-type="A"], &[data-type="R"] {
border: solid 2px var(--station-border);
&[data-pressed="false"] {
background-color: var(--color-gray-500);
color: var(--color-type-disabled);
&[data-type="U"] {
background-color: var(--bg-type-u-disabled);
}
&[data-type="S"] {
background-color: var(--bg-type-s-disabled);
}
&[data-type="A"] {
background-color: var(--bg-type-a-disabled);
}
&[data-type="R"] {
background-color: var(--bg-type-r-disabled);
}
&::after {
position: absolute;
content: '';
width: 144%;
height: 0.4rem;
background-color: var(--color-gray-500);
opacity: 80%;
transform: rotate(-45deg);
}
}
}
}
}
@ -978,10 +1199,6 @@ span[data-icon] {
mask-image: url(/md_icons/load.svg);
}
&[data-icon="close"] {
mask-image: url(/md_icons/close.svg);
}
&.spinner {
animation-delay: 0s;
animation-direction: normal;

101
sw.js
View file

@ -1,101 +0,0 @@
const version = '0.6.4'
const consolePrefix = `[SW v${version}] `
const cacheName = `hvvstuhl-${version}`;
const contentToCache = [
'/',
'/index.html',
'/about.html',
'/main.js',
'/elevators.js',
'/style.css',
'/icons/192.png',
'/icons/512.png',
'/icons/512-maskable.png',
'/icons/512-transparent.png',
'/icons/favicon.ico',
'/icons/favicon.svg',
'/icons/favicon-maskable.svg',
'/icons/favicon-transparent.svg',
'/md_icons/bicycle.svg',
'/md_icons/braille.svg',
'/md_icons/door_sliding.svg',
'/md_icons/elevator.svg',
'/md_icons/elevator-slash.svg',
'/md_icons/fit_width.svg',
'/md_icons/height.svg',
'/md_icons/info.svg',
'/md_icons/load.svg',
'/md_icons/location.svg',
'/md_icons/location-searching.svg',
'/md_icons/speaker.svg',
'/md_icons/up-down.svg',
'/md_icons/wheelchair.svg',
'/md_icons/width.svg',
];
// Service worker Install: Cache all files
self.addEventListener("install", (e) => {
console.log(`${consolePrefix}Wird installiert....`);
e.waitUntil(
(async () => {
const cache = await caches.open(cacheName);
console.log(`${consolePrefix} Cache wird aufgebaut...`);
await cache.addAll(contentToCache);
console.log(`${consolePrefix} > FERTIG`);
console.log(`${consolePrefix} Versuche Wartezeit zu überspringen...`);
await self.skipWaiting();
console.log(`${consolePrefix} > Erfolgreich`);
})(),
);
});
// delete old caches
const deleteCache = async (key) => {
await caches.delete(key);
};
const deleteOldCaches = async () => {
const keyList = await caches.keys();
const cachesToDelete = keyList.filter((key) => key !== cacheName);
await Promise.all(cachesToDelete.map(deleteCache));
};
self.addEventListener("activate", (event) => {
event.waitUntil(
(async () => {
await deleteOldCaches();
console.log(`${consolePrefix}Versuche Clients zu beanspruchen...`);
await self.clients.claim();
console.log(`${consolePrefix} > Erfolgreich`);
})(),
);
});
// Respond with data from cache when offline
self.addEventListener("fetch", (e) => {
e.respondWith(
(async () => {
const path = new URL(e.request.url).pathname
if(contentToCache.includes(path)){
console.log(`${consolePrefix}Anfrage: ${path}`);
const r = await caches.match(e.request);
if (r) {
console.log(`${consolePrefix} > Im Cache gefunden.`);
return r;
}
const response = await fetch(e.request);
const cache = await caches.open(cacheName);
console.log(`${consolePrefix} > Nicht gefunden. Aktualisiere Cache: ${path}`);
await cache.put(e.request, response.clone());
return response;
}else{
console.log(`${consolePrefix}Anfrage übersprungen: ${e.request.url}`);
return await fetch(e.request);
}
})(),
);
});