added title attrbite to the collection sidebar items and increased the default width

ui/src/components/collections/CollectionsSidebar.svelte

@@ -65,6 +65,7 @@
             <a
                 href="/collections?collectionId={collection.id}"
                 class="sidebar-list-item"
+                title={collection.name}
                 class:active={$activeCollection?.id === collection.id}
                 use:link
             >

ui/src/scss/_layout.scss

@@ -102,6 +102,8 @@
     display: flex;
     flex-direction: column;
     width: var(--pageSidebarWidth);
+    min-width: 210px;
+    max-width: 260px;
     flex-shrink: 0;
     flex-grow: 0;
     overflow-x: hidden;
@@ -219,7 +221,7 @@
         --sidebarListItemMargin: 5px;
     }
     @media screen and (max-width: 1100px) {
-        --pageSidebarWidth: 190px;
+        min-width: 190px;
         & > * {
             padding-left: 10px;
             padding-right: 10px;

ui/src/scss/_vars.scss

@@ -58,7 +58,7 @@
     --lgWrapperWidth: 1200px;
 
     --appSidebarWidth: 75px;
-    --pageSidebarWidth: 220px;
+    --pageSidebarWidth: 13%;
 
     --baseAnimationSpeed: 150ms;
     --activeAnimationSpeed: 70ms;