replace wall of text with digestible information

This commit is contained in:
hippoz 2022-11-27 23:13:42 +02:00
parent e3d6527209
commit 0ed2f38581
No known key found for this signature in database
GPG key ID: 7C52899193467641

View file

@ -9,6 +9,16 @@
.user-info-modal { .user-info-modal {
max-width: 560px; max-width: 560px;
} }
.user-info-row {
display: flex;
align-items: flex-start;
margin-bottom: var(--space-sm);
}
.user-info-row .material-icons-outlined {
margin-right: var(--space-xs);
}
</style> </style>
<div class="modal-backdrop" transition:maybeModalFade on:click="{ close }"> <div class="modal-backdrop" transition:maybeModalFade on:click="{ close }">
@ -19,16 +29,28 @@
<div> <div>
{#if presenceEntry.bridgesTo} {#if presenceEntry.bridgesTo}
<p>This user may send messages and other metadata to <b>{presenceEntry.bridgesTo}</b>, which may have its own Terms of Service and Privacy Policy.</p> <div class="user-info-row">
<span class="material-icons-outlined">cloud_sync</span>
<span>This application may send messages and metadata to <b>{presenceEntry.bridgesTo}</b></span>
</div>
{/if} {/if}
{#if presenceEntry.privacy} {#if presenceEntry.privacy}
<p>This user has their own Privacy Policy, available at: <b>{ presenceEntry.privacy }</b>. This user may process the data it has access to on this server under different terms than the server. Please consult their Privacy Policy.</p> <div class="user-info-row">
<span class="material-icons-outlined">policy</span>
<span>Data accessible by this application is processed in accordance with their Privacy Policy: <b>{ presenceEntry.privacy }</b></span>
</div>
{/if} {/if}
{#if presenceEntry.terms} {#if presenceEntry.terms}
<p>This user has their own Terms of Service, available at: <b>{ presenceEntry.terms }</b>. Failure to comply with these Terms of Service may result in termination of the services provided to you by this user.</p> <div class="user-info-row">
<span class="material-icons-outlined">gavel</span>
<span>The Terms of Service of this application can be found at: <b>{ presenceEntry.terms }</b></span>
</div>
{/if} {/if}
{#if presenceEntry.bridgesTo || presenceEntry.privacy || presenceEntry.terms} {#if presenceEntry.bridgesTo || presenceEntry.privacy || presenceEntry.terms}
<p>You may be able to ask the user to opt out of the above.</p> <div class="user-info-row">
<span class="material-icons-outlined">shield</span>
<span>You may be able to opt out of the above</span>
</div>
{/if} {/if}
</div> </div>