@@ -7,8 +7,9 @@
v-for="(month, index) of months"
:key="month"
:class="[$style.bold, { [$style.currentMonth]: isCurrentMonth(index) }]"
- >{{ month }}
+ {{ month }}
+
{{ t('shared.total') }}
{{ t('shared.average') }}
@@ -75,7 +76,6 @@ const props = withDefaults(
defineProps<{
income?: number[];
expenses?: number[];
- title: string;
}>(),
{
income: () => [],
diff --git a/src/app/pages/dashboard/summary/widgets/tables/_shared.scss b/src/app/pages/dashboard/summary/widgets/tables/_shared.scss
index 9704d78c..1baf5db8 100644
--- a/src/app/pages/dashboard/summary/widgets/tables/_shared.scss
+++ b/src/app/pages/dashboard/summary/widgets/tables/_shared.scss
@@ -23,8 +23,20 @@
color: var(--theme-text-muted);
}
-.currentMonth {
- color: var(--c-primary-pure);
+.currentMonth > 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;
+ }
}
.current {
diff --git a/src/app/pages/shared/BudgetGroup.vue b/src/app/pages/shared/BudgetGroup.vue
index 7039bf34..cb75ab4a 100644
--- a/src/app/pages/shared/BudgetGroup.vue
+++ b/src/app/pages/shared/BudgetGroup.vue
@@ -71,7 +71,7 @@
-
+
@@ -200,15 +200,15 @@ const performAction = (action: CellMenuActionId, budgetId: string, month: number
}
&.start {
- border-top-left-radius: var(--border-radius-m);
- border-bottom-left-radius: var(--border-radius-m);
+ border-top-left-radius: var(--border-radius-l);
+ border-bottom-left-radius: var(--border-radius-l);
padding-left: 8px;
cursor: text;
}
&.end {
- border-top-right-radius: var(--border-radius-m);
- border-bottom-right-radius: var(--border-radius-m);
+ border-top-right-radius: var(--border-radius-l);
+ border-bottom-right-radius: var(--border-radius-l);
padding-right: 8px;
}
}
diff --git a/src/app/pages/shared/Pane.vue b/src/app/pages/shared/Pane.vue
index 4d501d82..973bee8e 100644
--- a/src/app/pages/shared/Pane.vue
+++ b/src/app/pages/shared/Pane.vue
@@ -60,7 +60,7 @@ useScrollShadow(header, content, 'var(--app-scroll-box-shadow)');
.title {
display: flex;
- align-items: end;
+ align-items: center;
gap: 8px;
font-size: var(--font-size-s);
font-weight: var(--font-weight-l);
diff --git a/src/i18n/locales/de.json b/src/i18n/locales/de.json
index f5ebdf69..44ceebd5 100644
--- a/src/i18n/locales/de.json
+++ b/src/i18n/locales/de.json
@@ -59,8 +59,8 @@
},
"info": {
"about": "Über Ocular",
- "github": "Schauen dir sich dieses Projekt auf {link} an!",
- "madeWithLove": "Entwickelt mit ❤️von Simon",
+ "github": "Schauen dir dieses Projekt auf {link} an!",
+ "madeWithLove": "Entwickelt mit ❤️ von Simon R.",
"meta": "{version} / {date} / {sha}"
},
"currency": {
@@ -117,7 +117,6 @@
"tables": "Tabellen",
"income": "Einnahmen",
"expenses": "Ausgaben",
- "summary": "Zusammenfassung",
"endingBalance": "Endsaldo",
"header": "Jährliches Budget für {year}",
"remainingBalance": "Verbleibendes Netto bis {year}",
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index b95f3e66..3f8f7b51 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -117,7 +117,6 @@
"tables": "Tables",
"income": "Income",
"expenses": "Expenses",
- "summary": "Summary",
"endingBalance": "Ending Balance",
"header": "Annual budget for {year}",
"remainingBalance": "Remaining Balance until {year}",
diff --git a/src/styles/themes/dark.scss b/src/styles/themes/dark.scss
index e5b9f4a5..329f974e 100644
--- a/src/styles/themes/dark.scss
+++ b/src/styles/themes/dark.scss
@@ -19,6 +19,7 @@
--c-text-light-muted: #d2d2da;
--c-dimmed: #708dab;
+ --c-dimmed-light: #1b1d27;
--c-dimmed-hover: #5d758f;
--c-dimmed-text: var(--c-text-light);
--c-dimmed-text-hover: var(--c-dimmed-text);
@@ -114,6 +115,7 @@
--border-radius-xl: 8px;
--border-radius-xxl: 16px;
--border-radius-xxxl: 24px;
+ --border-radius-full: 1000px;
--input-field-transition: var(--transition-s);
--input-field-font-size: var(--font-size-xs);
@@ -147,9 +149,9 @@
--grid-background-even-hover: #1b1d26;
--grid-background-even-active: #2a2d3a;
--grid-border-color: #131316;
- --grid-border-radius: var(--border-radius-m);
+ --grid-border-radius: var(--border-radius-l);
- --grid-header-background: #1f2733;
+ --grid-header-background: #3a428a;
--grid-header-text: #dfe2e8;
--tooltip-backdrop: var(--context-menu-backdrop);
diff --git a/src/styles/themes/light.scss b/src/styles/themes/light.scss
index 1bdbf290..085fbb0b 100644
--- a/src/styles/themes/light.scss
+++ b/src/styles/themes/light.scss
@@ -19,6 +19,7 @@
--c-text-light-muted: #d2d2da;
--c-dimmed: #a3aab0;
+ --c-dimmed-light: #f4f7f9;
--c-dimmed-hover: #8f979d;
--c-dimmed-text: var(--c-text-light);
--c-dimmed-text-hover: var(--c-dimmed-text);
@@ -114,6 +115,7 @@
--border-radius-xl: 8px;
--border-radius-xxl: 16px;
--border-radius-xxxl: 24px;
+ --border-radius-full: 1000px;
--input-field-transition: var(--transition-s);
--input-field-font-size: var(--font-size-xs);
@@ -147,9 +149,9 @@
--grid-background-even-hover: #f5f5f7;
--grid-background-even-active: #fafafa;
--grid-border-color: #e4e5e6;
- --grid-border-radius: var(--border-radius-m);
+ --grid-border-radius: var(--border-radius-l);
- --grid-header-background: #272d46;
+ --grid-header-background: #1b1e2a;
--grid-header-text: #dfe2e8;
--tooltip-backdrop: var(--context-menu-backdrop);