Mirrors/regenbogenkarte
2
0
Fork 0
mirror of https://github.com/Queer-Lexikon/regenbogenkarte synced 2025-02-16 12:58:28 +00:00
Code Issues Projects Releases Packages Wiki Activity

Display multiple e-mail addresses, websites and phone numbers

Browse source
This commit is contained in:
Zora Franke 2024-07-24 14:47:31 +02:00
parent b74246398e
commit 79572caecb
2 changed files with 39 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
main.css
View file

@ -26,3 +26,15 @@ body {
.map-popup .leaflet-popup-content p {
@apply m-0 mb-1;
}
li.contact-email::marker {
content: "📧";
}
li.contact-phone::marker {
content: "☎";
}
li.contact-website::marker {
content: "🌐";
}

33
ts/map.ts
View file

@ -9,13 +9,28 @@ import supportImage from "../assets/support.svg";
import { DEFAULT_ZOOM_LEVEL, ICON_SIZE, MAX_ZOOM_LEVEL, MIN_ZOOM_LEVEL } from "./config";
import { loadJSON as loadData } from "./data";
type OrgEmail = {
label: string;
email: string;
};
type OrgPhone = {
label: string;
phone: string;
};
type OrgWebsite = {
label: string;
url: string;
};
type Organisation = {
country: string;
state: string;
name: string;
email?: string;
website?: string;
phone?: string;
emails: OrgEmail[];
websites: OrgWebsite[];
phones: OrgPhone[];
location: {
address?: string;
lon: number;
@ -117,9 +132,15 @@ const buildContent = (o: Organisation): string => {
<address class="inline">${o.location.address ?? "auf Nachfrage"}</address>
<ul class="list-disc my-4 pl-2 list-inside">`;
if (o.website) result += `<li><a href="${o.website}">Zur Webseite</a></li>`;
if (o.email) result += `<li><a href="mailto:${o.email}">E-Mail</a></li>`;
if (o.phone) result += `<li>Telefon: <a href="tel:${o.phone}">${o.phone}</a></li>`;
o.websites.forEach((website) => {
result += `<li class="contact-website"><a href="${website.url}">${website.label}</a></li>`;
});
o.emails.forEach((email) => {
result += `<li class="contact-email"><a href="mailto:${email.email}">${email.label}</a></li>`;
});
o.phones.forEach((phone) => {
result += `<li class="contact-phone">${phone.label}: <a href="tel:${phone.phone}">${phone.phone}</a></li>`;
});
result += `</ul>`;
if (o.activities && o.activities !== "")