feat: add large and medium to heights for budget rows (#2909)

src/extension/features/budget/rows-height/index.js

@@ -2,6 +2,7 @@ import { Feature } from 'toolkit/extension/features/feature';
 
 export class RowsHeight extends Feature {
   injectCSS() {
+    console.log('this.settings.enabled:', this.settings.enabled);
     if (this.settings.enabled === '1') {
       return require('./compact.css');
     }
@@ -11,5 +12,11 @@ export class RowsHeight extends Feature {
     if (this.settings.enabled === '3') {
       return require('./slim-fonts.css');
     }
+    if (this.settings.enabled === '4') {
+      return require('./medium.css');
+    }
+    if (this.settings.enabled === '5') {
+      return require('./large.css');
+    }
   }
 }

src/extension/features/budget/rows-height/large.css

@@ -0,0 +1,42 @@
+.budget-table-header {
+  height: auto !important;
+}
+
+.budget-table-header-labels {
+  height: 2rem !important;
+}
+
+.budget-table-cell-available-payment {
+  font-size: 0px;
+  position: absolute;
+  right: -15px;
+  top: 9px;
+}
+
+.budget-table-row.is-master-category,
+.budget-table-row.is-sub-category,
+.budget-table-cell-margin,
+.budget-table-cell-checkbox,
+.budget-table-cell-collapse,
+.budget-table-cell-name,
+.budget-table-cell-budgeted,
+.budget-table-cell-activity,
+.budget-table-cell-available,
+.tk-budget-table-cell-pacing,
+.tk-budget-table-cell-goal {
+  height: 2em !important;
+  font-size: 0.9rem !important;
+}
+
+.budget-table-cell-checkbox.ynab-checkbox {
+  font-size: 1rem !important;
+}
+
+.budget-table .currency,
+.budget-table .budget-table-cell-goal-status {
+  font-size: 0.9rem !important;
+}
+
+.budget-table .ynab-new-budget-bar-v2 {
+  margin-top: -0.025rem !important;
+}

src/extension/features/budget/rows-height/medium.css

@@ -0,0 +1,42 @@
+.budget-table-header {
+  height: auto !important;
+}
+
+.budget-table-header-labels {
+  height: 1.75rem !important;
+}
+
+.budget-table-cell-available-payment {
+  font-size: 0px;
+  position: absolute;
+  right: -15px;
+  top: 7px;
+}
+
+.budget-table-row.is-master-category,
+.budget-table-row.is-sub-category,
+.budget-table-cell-margin,
+.budget-table-cell-checkbox,
+.budget-table-cell-collapse,
+.budget-table-cell-name,
+.budget-table-cell-budgeted,
+.budget-table-cell-activity,
+.budget-table-cell-available,
+.tk-budget-table-cell-pacing,
+.tk-budget-table-cell-goal {
+  height: 1.75em !important;
+  font-size: 0.9rem !important;
+}
+
+.budget-table-cell-checkbox.ynab-checkbox {
+  font-size: 1rem;
+}
+
+.budget-table .currency,
+.budget-table .budget-table-cell-goal-status {
+  font-size: 0.9rem !important;
+}
+
+.budget-table .ynab-new-budget-bar-v2 {
+  margin-top: -0.025rem !important;
+}

src/extension/features/budget/rows-height/settings.js

@@ -10,5 +10,7 @@ module.exports = {
     { name: 'Compact', value: '1' },
     { name: 'Slim', value: '2' },
     { name: 'Slim with smaller font', value: '3' },
+    { name: 'Medium', value: '4' },
+    { name: 'Large', value: '5' },
   ],
 };