diff --git a/frontend/src/components/falukant/StatusBar.vue b/frontend/src/components/falukant/StatusBar.vue index ab6319c..66b54d6 100644 --- a/frontend/src/components/falukant/StatusBar.vue +++ b/frontend/src/components/falukant/StatusBar.vue @@ -7,7 +7,6 @@
- {{ $t('falukant.overview.metadata.name') }}: {{ characterName }}
@@ -334,7 +333,7 @@ export default { .statusbar-main { display: grid; - grid-template-columns: minmax(15rem, 1.1fr) minmax(0, 1.5fr) minmax(14rem, 1fr); + grid-template-columns: max-content minmax(0, 1fr) max-content; align-items: center; gap: 0.85rem 1rem; width: 100%; @@ -347,7 +346,7 @@ export default { .statusbar-section--identity { display: flex; align-items: center; - gap: 0.7rem; + gap: 0.55rem; min-width: 0; } @@ -403,28 +402,19 @@ export default { .status-identity { display: inline-flex; align-items: center; - gap: 0.45rem; min-height: 34px; - padding: 0.2rem 0.95rem; + padding: 0.2rem 0.8rem; border-radius: var(--radius-md); background: linear-gradient(180deg, rgba(255,255,255,0.94) 0%, rgba(248, 241, 231, 0.98) 100%); border: 1px solid rgba(126, 71, 27, 0.16); box-shadow: inset 0 1px 0 rgba(255,255,255,0.65); min-width: 0; - flex: 1 1 auto; -} - -.status-identity__label { - font-size: 0.72rem; - letter-spacing: 0.08em; - text-transform: uppercase; - color: #9a7a5f; - white-space: nowrap; - flex: 0 0 auto; + flex: 0 1 auto; + max-width: 18rem; } .status-identity__name { - font-size: 1rem; + font-size: 0.98rem; line-height: 1.2; color: #5f3617; white-space: nowrap;