💄 Dark mode fixes

This commit is contained in:
itskovacs 2025-08-28 20:27:23 +02:00
parent 2f73b4288e
commit ff3f9e3e3b
2 changed files with 14 additions and 12 deletions

View File

@ -1,12 +1,12 @@
@if (selectedPlace) {
<div class="place-box-dialog">
<div class="place-box-dialog bg-white dark:bg-surface-900">
<div class="place-box-dialog-content">
<div class="flex justify-between items-center mb-3">
<div class="flex items-center gap-4 w-full max-w-full">
<img [src]="selectedPlace.image || selectedPlace.category.image"
class="object-cover rounded-full size-16">
<div class="flex grow min-w-0 md:flex-col">
<h1 class="text-gray-800 font-bold mb-0 truncate">{{ selectedPlace.name }}
<h1 class="text-gray-800 dark:text-gray-200 font-bold mb-0 truncate">{{ selectedPlace.name }}
</h1>
<div class="hidden md:flex mt-2 gap-1">
@ -53,43 +53,44 @@
</div>
<div class="border-l border-solid border-gray-700 h-4"></div>
<p-button (click)="close()" text icon="pi pi-times" />
<p-button (click)="close()" severity="secondary" text icon="pi pi-times" />
</div>
</div>
</div>
<div class="mt-4 grid grid-cols-2 md:grid-cols-5">
<div class="col-span-2 md:col-span-3 flex flex-col mb-4">
<span class="text-gray-500">Place</span>
<span class="text-gray-500 dark:text-gray-400">Place</span>
<div class="line-clamp-2">{{ selectedPlace.place }}</div>
</div>
<div class="grid grid-cols-2 col-span-2">
<div class="flex flex-col mb-4">
<span class="text-gray-500">Latitude</span>
<span class="text-gray-500 dark:text-gray-400">Latitude</span>
<span class="truncate">{{ selectedPlace.lat }}</span>
</div>
<div class="flex flex-col mb-4">
<span class="text-gray-500">Longitude</span>
<span class="text-gray-500 dark:text-gray-400">Longitude</span>
<span class="truncate">{{ selectedPlace.lng }}</span>
</div>
<div class="flex flex-col mb-4">
<span class="text-gray-500">Price</span>
<span class="text-gray-500 dark:text-gray-400">Price</span>
<span>{{ selectedPlace.price || '-' }} @if (selectedPlace.price) { {{ currency$ | async }} }</span>
</div>
<div class="flex flex-col mb-4">
<span class="text-gray-500">Duration</span>
<span class="text-gray-500 dark:text-gray-400">Duration</span>
<span>{{ selectedPlace.duration || '-' }}</span>
</div>
</div>
</div>
<div class="flex flex-col mb-4 max-h-40 overflow-y-auto">
<span class="text-gray-500">Description</span>
<span class="break-words" [innerHTML]="(selectedPlace.description || '-') | linkify"></span>
<span class="text-gray-500 dark:text-gray-400">Description</span>
<span class="break-words whitespace-pre-line"
[innerHTML]="(selectedPlace.description || '-') | linkify"></span>
</div>
<div class="flex md:hidden mt-2 justify-center gap-1">

View File

@ -1,12 +1,13 @@
@if (selectedPlace) {
<div class="place-box-dialog">
<div class="place-box-dialog bg-white dark:bg-surface-900">
<div class="place-box-dialog-content">
<div class="flex justify-between items-center">
<div class="flex items-center gap-4 w-full max-w-full">
<img [src]="selectedPlace.image || selectedPlace.category.image"
class="object-cover rounded-full size-16">
<div class="flex grow min-w-0">
<h1 class="text-gray-800 font-bold mb-0 truncate">Trace of {{ selectedPlace.name }}</h1>
<h1 class="text-gray-800 dark:text-gray-200 font-bold mb-0 truncate">Trace of {{ selectedPlace.name
}}</h1>
</div>
<div class="flex items-center justify-end gap-2">