From 840af3e922fcf2c9c6d187a0114b3e43cd75a230 Mon Sep 17 00:00:00 2001
From: Jakub Zych <jakub@keios.eu>
Date: Wed, 7 Oct 2026 00:07:49 +0200
Subject: [PATCH] fix: give long plugin labels more room

---
 admin/src/components/shell/PluginRail.vue | 8 ++++----
 admin/src/styles/main.css                 | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/admin/src/components/shell/PluginRail.vue b/admin/src/components/shell/PluginRail.vue
index 474f859..fb2f658 100644
--- a/admin/src/components/shell/PluginRail.vue
+++ b/admin/src/components/shell/PluginRail.vue
@@ -158,7 +158,7 @@ onBeforeUnmount(cancelClose)
       :aria-expanded="collapsed ? (openCode === item.entry.code ? 'true' : 'false') : undefined"
       :aria-controls="collapsed && openCode === item.entry.code ? flyoutId(item.entry.code) : undefined"
       :class="item.current ? 'bg-accent-soft font-bold text-accent' : 'text-side-text hover:bg-side-hover hover:text-white'"
-      class="flex w-[68px] flex-col items-center gap-1 rounded-inner px-1.5 py-2 text-center text-[11px] leading-[1.2] tracking-[-0.01em] no-underline transition-colors duration-150 ease-out"
+      class="flex w-[84px] flex-col items-center gap-1 rounded-inner px-1.5 py-2 text-center text-[11px] leading-[1.2] tracking-[-0.01em] no-underline transition-colors duration-150 ease-out"
       @mouseenter="openFlyout(item.entry.code)"
       @mouseleave="scheduleClose"
       @focus="onItemFocus(item.entry.code)"
@@ -166,7 +166,7 @@ onBeforeUnmount(cancelClose)
       @keydown="onItemKeydown($event, item.entry.code)"
     >
       <component :is="item.icon" :size="20" aria-hidden="true" />
-      <span>{{ item.entry.label }}</span>
+      <span class="max-w-full [overflow-wrap:anywhere]">{{ item.entry.label }}</span>
     </RouterLink>
     <SectionFlyout
       v-if="collapsed && openEntry"
@@ -199,10 +199,10 @@ onBeforeUnmount(cancelClose)
       data-rail-settings
       :aria-current="inSettings ? 'page' : undefined"
       :class="inSettings ? 'bg-accent-soft font-bold text-accent' : 'text-side-text hover:bg-side-hover hover:text-white'"
-      class="flex w-[68px] flex-col items-center gap-1 rounded-inner px-1.5 py-2 text-center text-[11px] leading-[1.2] tracking-[-0.01em] no-underline transition-colors duration-150 ease-out"
+      class="flex w-[84px] flex-col items-center gap-1 rounded-inner px-1.5 py-2 text-center text-[11px] leading-[1.2] tracking-[-0.01em] no-underline transition-colors duration-150 ease-out"
     >
       <Settings :size="20" aria-hidden="true" />
-      <span>{{ t('backend::lang.nav.settings') }}</span>
+      <span class="max-w-full [overflow-wrap:anywhere]">{{ t('backend::lang.nav.settings') }}</span>
     </RouterLink>
   </nav>
 </template>
diff --git a/admin/src/styles/main.css b/admin/src/styles/main.css
index 3173a59..ba0c47d 100644
--- a/admin/src/styles/main.css
+++ b/admin/src/styles/main.css
@@ -69,7 +69,7 @@
   --spacing-row: 54px;
   --spacing-row-head: 44px;
   --spacing-pager: 34px;
-  --spacing-rail: 80px;
+  --spacing-rail: 96px;
   --spacing-panel: 224px;
 
   --shadow-card: var(--c-shadow-card);