fix: aligh demo-data with current year

minor style adjustments

src/app/components/feature/BudgetGroups.vue

@@ -142,9 +142,7 @@ const reorder = (evt: ReorderEvent) => {
   }
 
   > span {
-    position: absolute;
     display: inline-block;
-    margin-top: -20px;
 
     @include globals.onMobileDevices {
       position: static;

src/app/pages/dashboard/all-time/AllTime.vue

@@ -59,18 +59,14 @@ const cards = computed((): Card[] => {
   return [
     {
       title: t('page.dashboard.yoyIncomeGrowth'),
-      text: lastYearIncome ? percent.format((currentYearIncome - lastYearIncome) / lastYearIncome) : '—',
-      icon: lastYearIncome
-        ? currentYearIncome > lastYearIncome
-          ? RiArrowUpDoubleLine
-          : RiArrowDownDoubleLine
-        : undefined,
+      text: lastYear ? percent.format((currentYearIncome - lastYearIncome) / lastYearIncome) : '—',
+      icon: lastYear ? (currentYearIncome > lastYearIncome ? RiArrowUpDoubleLine : RiArrowDownDoubleLine) : undefined,
       iconClass: currentYearIncome > lastYearIncome ? styles.iconSuccess : styles.iconDanger
     },
     {
       title: t('page.dashboard.yoyExpenseGrowth'),
-      text: currentYearExpenses ? percent.format((lastYearExpenses - currentYearExpenses) / currentYearExpenses) : '—',
-      icon: currentYearExpenses
+      text: lastYear ? percent.format((lastYearExpenses - currentYearExpenses) / currentYearExpenses) : '—',
+      icon: lastYear
         ? lastYearExpenses > currentYearExpenses
           ? RiArrowUpDoubleLine
           : RiArrowDownDoubleLine

src/app/pages/navigation/tools/load-demo-data/LoadDemoDataButton.vue

@@ -20,6 +20,13 @@ const loadDemoData = async () => {
   loading.value = true;
 
   const { default: data } = await import('./DemoData.json');
+
+  // Adjust years to match the current year
+  const year = new Date().getFullYear();
+  for (let i = 0; i < data.years.length; i++) {
+    data.years[i].year = year - 1 + i;
+  }
+
   await deserialize(data as DataStateV3);
 
   loading.value = false;