feat: use simpler nitro instead of nestjs to implement mock service

packages/@core/ui-kit/shadcn-ui/src/components/scrollbar/scrollbar.vue

@@ -54,7 +54,7 @@ function handleScroll(event: Event) {
       v-if="shadow"
       :class="{
         'opacity-100': !isAtTop && !isAtBottom,
-        'border-border border-t': shadowBorder && !isAtTop && !isAtBottom,
+        'border-border border-b': shadowBorder && !isAtTop && !isAtBottom,
       }"
       class="scrollbar-bottom-shadow pointer-events-none absolute bottom-0 z-10 h-12 w-full opacity-0 transition-opacity duration-300 ease-in-out will-change-[opacity]"
     ></div>

packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue

@@ -71,7 +71,7 @@ function scrollIntoView() {
 
 <template>
   <div :style="style" class="tabs-chrome size-full flex-1 overflow-hidden pt-1">
-    <VbenScrollbar class="h-full" horizontal>
+    <VbenScrollbar class="tabs-chrome__scrollbar h-full" horizontal>
       <!-- footer -> 4px -->
       <div
         ref="contentRef"
@@ -237,6 +237,7 @@ function scrollIntoView() {
     }
   }
 
+  &__scrollbar,
   &__label {
     mask-image: linear-gradient(
       90deg,

packages/@core/ui-kit/tabs-ui/src/components/tabs/tabs.vue

@@ -72,7 +72,7 @@ function scrollIntoView() {
 
 <template>
   <div class="h-full flex-1 overflow-hidden">
-    <VbenScrollbar class="h-full" horizontal>
+    <VbenScrollbar class="tabs-scrollbar h-full" horizontal>
       <div
         :class="contentClass"
         class="relative !flex h-full w-max items-center"
@@ -147,3 +147,14 @@ function scrollIntoView() {
     </VbenScrollbar>
   </div>
 </template>
+
+<style scoped>
+.tabs-scrollbar {
+  mask-image: linear-gradient(
+    90deg,
+    #000 0%,
+    #000 calc(100% - 16px),
+    transparent
+  );
+}
+</style>