ledger balance

src/components/table/SortableHeader.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { HeaderComponent, SortDirection } from './sort';
+import {HeaderComponent, SortDirection} from './sort';
 
 interface Props {
     currentSortKey: string | null;
@@ -33,7 +33,7 @@ const emit = defineEmits<Emit>();
 </template>
 
 <style scoped>
-@reference "tailwindcss";
+@reference "@/style.css";
 .sort-header {
     @apply relative h-8 pe-3;
 }

src/components/table/VirtualScrollTable.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { useElementBounding, useVirtualList } from '@vueuse/core';
-import { computed, ref } from 'vue';
+import {useElementBounding, useVirtualList} from '@vueuse/core';
+import {computed, ref} from 'vue';
 
 interface Props {
     list?: any[];
@@ -68,29 +68,31 @@ const itemHeightStyle = computed(() => {
 </template>
 
 <style scoped>
-@reference "tailwindcss";
+@reference "@/style.css";
+
 div.table-container {
-    @apply bg-slate-600;
-    max-height: calc(100vh - v-bind(ypx));
-    :deep(>div) {
-        @apply bg-slate-800;
-        >table {
-            >thead {
-                @apply sticky z-10;
-                top: -1px;
-            }
-            >tfoot {
-                @apply bg-slate-600 sticky z-10;
-                bottom: -1px;
-            }
-            >*>tr, >*>tr>td {
-                height: v-bind(itemHeightStyle);
-            }
+  @apply bg-slate-600;
+  max-height: calc(100vh - v-bind(ypx));
+
+  &::-webkit-scrollbar-track {
+    margin-top: v-bind(computedHeaderHeight);
+    margin-bottom: v-bind(computedFooterHeight);
+  }
+}
+div.table-container:deep(>div) {
+    @apply bg-slate-800;
+    >table {
+        >thead {
+            @apply sticky z-10;
+            top: -1px;
+        }
+        >tfoot {
+            @apply bg-slate-600 sticky z-10;
+            bottom: -1px;
+        }
+        >*>tr, >*>tr>td {
+            height: v-bind(itemHeightStyle);
         }
-    }
-    &::-webkit-scrollbar-track {
-        margin-top: v-bind(computedHeaderHeight);
-        margin-bottom: v-bind(computedFooterHeight);
     }
 }
 </style>