SRSoftware/Umbrella
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

working on vcard display

Browse Source
This commit is contained in:
Stephan Richter
2025-10-08 08:50:37 +02:00
parent f6a8734614
commit 3df91f1b9d
4 changed files with 86 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
frontend/src/routes/contact/Card.svelte
View File

@@ -11,24 +11,64 @@
let { contact } = $props();
let addresses = $derived(contact.vcard.match(/^ADR.*:.+$/gm));
let code = $state(false);
let emails = $derived(contact.vcard.match(/^EMAIL.*:.+$/gm));
let extra_fields = $derived(contact.vcard.match(/^X-.*:.+/gm));
function toggleCode(){
code = !code;
}
</script>
<fieldset>
<legend>{t('contact_number',{number:contact.id})}</legend>
<FN vcard={contact.vcard} />
<Org vcard={contact.vcard} />
<Name vcard={contact.vcard} />
{#each addresses as code}
<Address {code} />
{/each}
{#each emails as code}
<Email {code} />
{/each}
{#each extra_fields as code}
<ExtraField {code} />
{/each}
<hr/>
<pre>{contact.vcard}</pre>
<fieldset class="vcard">
<legend>
{t('contact_number',{number:contact.id})}
<button class="symbol" onclick={toggleCode}>C</button>
</legend>
<table>
<thead></thead>
<tbody>
<tr>
<td>
<FN vcard={contact.vcard} />
</td>
{#if code}
<td rowspan="6">
<pre>{contact.vcard}</pre>
</td>
{/if}
</tr>
<tr>
<td>
<Org vcard={contact.vcard} />
</td>
</tr>
<tr>
<td>
<Name vcard={contact.vcard} />
</td>
</tr>
<tr>
<td>
{#each addresses as code}
<Address {code} />
{/each}
</td>
</tr>
<tr>
<td>
{#each emails as code}
<Email {code} />
{/each}
</td>
</tr>
<tr>
<td>
{#each extra_fields as code}
<ExtraField {code} />
{/each}
</td>
</tr>
</tbody>
</table>
</fieldset>

2
frontend/src/routes/contact/FN.svelte
View File

@@ -8,5 +8,5 @@
</script>
{#if name}
<span class="formatted name"><span>{t('formatted name')}:&nbsp;</span>{name}</span>
<span class="formatted name">{name}</span>
{/if}

2
frontend/src/routes/contact/Org.svelte
View File

@@ -8,5 +8,5 @@
</script>
{#if o}
<span class="organization"><span>{t('organization')}:&nbsp;</span>{o}</span>
<span class="organization">{o}</span>
{/if}

28
web/src/main/resources/web/css/default.css
View File

@@ -387,4 +387,32 @@ a.wikilink{
text-align: initial;
padding-top: 8px;
}
}
fieldset.vcard{
display: inline;
margin: 10px;
padding: 0;
}
.vcard legend{
margin-left: 10px;
}
.vcard .name{
font-weight: bold;
}
.vcard .address span {
display: block;
}
.vcard table{
border-collapse: collapse;
margin: -1px;
}
.vcard td{
border-style: solid;
border-width: 1px;
vertical-align: top;
padding: 2px;
}