public/owltide
1
0
Fork 0
Code Issues 3 Pull requests Projects Releases Packages 1 Wiki Activity Actions

Add UI to edit and display event notices

Browse source 
Add a warning like display of event notices to the event card and the
event slot card and indicate in the timesheet that an event has a
notice.  Also includes the input controls needed to edit the notice.
This commit is contained in:
Hornwitser 2025-09-06 19:25:20 +02:00
parent adeef4f629
commit 5898a46a1b
5 changed files with 70 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

24
components/CardEventSlot.vue
View file

@ -13,6 +13,14 @@
<p v-if=event?.host>
Host: {{ event.host }}
</p>
<div v-if="event?.notice" class="notice preWrap">
<div class="noticeIcon">
⚠️
</div>
<p>
{{ event.notice }}
</p>
</div>
<p class="preWrap">{{ event?.description ?? "No description provided" }}</p>
<p v-if="locations.length">
At {{ locations.map(location => location?.name ?? "unknown").join(" + ") }}
@ -62,6 +70,22 @@ function formatTime(time: DateTime) {
margin-block-start: 0.5rem;
}
.notice {
display: flex;
width: fit-content;
gap: 0.5rem;
padding: 0.5rem;
margin-block: 0.5rem;
border-radius: 0.25rem;
border: 1px solid color-mix(in oklab, CanvasText, orange 50%);
background-color: color-mix(in oklab, Canvas, orange 40%);
}
.noticeIcon {
flex: 0 0 auto;
align-self: center;
font-size: 1rem;
}
button {
padding-inline: 0.2em;
}