fix: remove gap between sticky months and pane header

Author: simonwep

src/app/components/feature/BudgetGroups.vue

@@ -172,27 +172,21 @@ const reorder = (evt: ReorderEvent) => {
   font-weight: var(--font-weight-m);
   padding-right: 20px;
   padding-bottom: 5px;
-
   position: sticky;
   position: -webkit-sticky;
   top: 0;
   background: var(--app-background);
   border: 2px var(--app-background);
+  z-index: 1;
 
   &.current > span {
     color: var(--c-text-light);
     display: inline-block;
     position: relative;
     z-index: 0;
-
-    &::before {
-      content: '';
-      position: absolute;
-      inset: -3px -8px;
-      border-radius: 100px;
-      background: var(--c-primary);
-      z-index: -1;
-    }
+    text-decoration: underline;
+    text-decoration-color: var(--c-primary);
+    text-decoration-thickness: 2px;
   }
 
   > span {

src/app/components/feature/Pane.vue

@@ -71,7 +71,7 @@ useScrollShadow(header, content, 'var(--app-scroll-box-shadow)');
 .content {
   overflow: auto;
   flex-grow: 1;
-  padding: 3px 10px 0;
+  padding: 0 10px 0;
 }
 
 @include globals.onMobileDevices {
@@ -90,7 +90,7 @@ useScrollShadow(header, content, 'var(--app-scroll-box-shadow)');
   }
 
   .content {
-    padding: 10px;
+    padding: 0;
   }
 }
 </style>