Fix Darkmode Dashboard
This commit is contained in:
@@ -385,15 +385,15 @@ onBeforeUnmount(() => {
|
||||
:gs-min-w="widget.minW"
|
||||
:gs-min-h="widget.minH"
|
||||
>
|
||||
<div class="grid-stack-item-content dashboard-grid-item">
|
||||
<div class="dashboard-widget-card">
|
||||
<div class="dashboard-widget-header">
|
||||
<div class="grid-stack-item-content dashboard-grid-item">
|
||||
<div class="dashboard-widget-card border border-gray-200 dark:border-gray-800">
|
||||
<div class="dashboard-widget-header border-b border-gray-200 dark:border-gray-800">
|
||||
<div class="flex items-start justify-between gap-3">
|
||||
<div class="min-w-0">
|
||||
<div :class="['dashboard-widget-drag-handle font-semibold text-gray-900 dark:text-white', isEditMode ? 'cursor-move' : 'cursor-default']">
|
||||
<div :class="['dashboard-widget-drag-handle font-semibold', isEditMode ? 'cursor-move' : 'cursor-default']">
|
||||
{{ widget.title }}
|
||||
</div>
|
||||
<p class="mt-1 text-sm text-gray-500 dark:text-gray-400">
|
||||
<p class="mt-1 text-sm">
|
||||
{{ widget.description }}
|
||||
</p>
|
||||
</div>
|
||||
@@ -430,8 +430,8 @@ onBeforeUnmount(() => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-else class="rounded-xl border border-dashed border-gray-300 bg-white p-10 text-center dark:border-gray-700 dark:bg-gray-900">
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">
|
||||
<div class="rounded-xl border border-dashed border-gray-300 dark:border-gray-700 p-10 text-center">
|
||||
<p class="text-sm">
|
||||
Es sind aktuell keine Dashboard-Karten sichtbar.
|
||||
</p>
|
||||
<UButton v-if="isEditMode" class="mt-4" icon="i-heroicons-plus" @click="manageCardsOpen = true">
|
||||
@@ -445,7 +445,7 @@ onBeforeUnmount(() => {
|
||||
<div class="flex items-center justify-between gap-3">
|
||||
<div>
|
||||
<h2 class="font-semibold">Dashboard-Karten</h2>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">
|
||||
<p class="text-sm">
|
||||
Karten ein- oder ausblenden und bei Bedarf auf das Standardlayout zurücksetzen.
|
||||
</p>
|
||||
</div>
|
||||
@@ -459,11 +459,11 @@ onBeforeUnmount(() => {
|
||||
<div
|
||||
v-for="definition in DASHBOARD_WIDGETS"
|
||||
:key="definition.id"
|
||||
class="flex items-center justify-between gap-3 rounded-lg border border-gray-200 px-4 py-3 dark:border-gray-800"
|
||||
class="flex items-center justify-between gap-3 rounded-lg border border-gray-200 dark:border-gray-800 px-4 py-3"
|
||||
>
|
||||
<div>
|
||||
<p class="font-medium text-gray-900 dark:text-white">{{ definition.title }}</p>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">{{ definition.description }}</p>
|
||||
<p class="font-medium">{{ definition.title }}</p>
|
||||
<p class="text-sm">{{ definition.description }}</p>
|
||||
</div>
|
||||
|
||||
<UButton
|
||||
@@ -508,14 +508,11 @@ onBeforeUnmount(() => {
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
border-radius: 0.75rem;
|
||||
border: 1px solid rgb(229 231 235);
|
||||
background: white;
|
||||
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
||||
}
|
||||
|
||||
.dashboard-widget-header {
|
||||
flex: 0 0 auto;
|
||||
border-bottom: 1px solid rgb(229 231 235);
|
||||
padding: 1rem 1rem 0.875rem;
|
||||
}
|
||||
|
||||
@@ -553,12 +550,4 @@ onBeforeUnmount(() => {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:deep(.dark .dashboard-widget-card) {
|
||||
border-color: rgb(31 41 55);
|
||||
background: rgb(17 24 39);
|
||||
}
|
||||
|
||||
:deep(.dark .dashboard-widget-header) {
|
||||
border-color: rgb(31 41 55);
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user