diff --git a/src/views/system/LoggingView.vue b/src/views/system/LoggingView.vue index 392916ca..0db7ddb0 100644 --- a/src/views/system/LoggingView.vue +++ b/src/views/system/LoggingView.vue @@ -664,12 +664,16 @@ onUnmounted(() => { --logging-shell-bg: rgba(var(--v-theme-surface), 0.72); --logging-record-bg-even: rgba(var(--v-theme-on-surface), 0.02); --logging-record-bg-odd: rgba(var(--v-theme-on-surface), 0.008); + --logging-border: rgba(var(--v-theme-on-surface), 0.12); + --logging-shadow: inset 0 1px 0 rgba(255, 255, 255, 4%); } .logging-view.is-transparent-theme { --logging-shell-bg: transparent; --logging-record-bg-even: transparent; --logging-record-bg-odd: transparent; + --logging-border: rgba(var(--v-theme-on-surface), 0.1); + --logging-shadow: none; } .logging-toolbar { @@ -732,7 +736,9 @@ onUnmounted(() => { overflow: auto; flex: 1 1 auto; padding: 0.875rem; + border: 1px solid var(--logging-border); background: linear-gradient(180deg, var(--logging-shell-bg), rgba(var(--v-theme-surface), 0.9)); + box-shadow: var(--logging-shadow); } .logging-view.is-transparent-theme .logging-shell { @@ -808,6 +814,8 @@ onUnmounted(() => { .logging-record-panel { display: flex; align-items: stretch; + border: 1px solid rgba(var(--v-theme-on-surface), 0.04); + border-radius: var(--app-surface-radius); gap: 0.75rem; min-inline-size: 0; padding-block: 0.5rem; @@ -822,6 +830,10 @@ onUnmounted(() => { background: var(--logging-record-bg-odd); } +.logging-view.is-dark-theme .logging-record-panel { + border-color: rgba(var(--v-theme-on-surface), 0.08); +} + .logging-record-accent { flex: 0 0 auto; align-self: flex-start;