feat: use variable fonts with subsetting (#2817)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/2817
Co-authored-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
Co-committed-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>

src/components/home/navigation.vue

@@ -435,7 +435,7 @@ $vikunja-nav-selected-width: 0.4rem;
  
 	.menu-list {
 		li {
-			font-weight: 500;
+			font-weight: 600;
 			font-family: $vikunja-font;
 		}
 
@@ -460,7 +460,7 @@ $vikunja-nav-selected-width: 0.4rem;
 		font-weight: bold;
 		font-family: $vikunja-font;
 		color: $vikunja-nav-color;
-		font-weight: 500;
+		font-weight: 600;
 		min-height: 2.5rem;
 		padding-top: 0;
 		padding-left: $navbar-padding;
@@ -479,6 +479,8 @@ $vikunja-nav-selected-width: 0.4rem;
 		.count {
 			color: var(--grey-500);
 			margin-right: .5rem;
+			// align brackets with number
+			font-feature-settings: "case";
 		}
 	}
 

src/components/namespace/namespace-settings-dropdown.vue

@@ -98,5 +98,6 @@ function setSubscriptionInStore(sub: ISubscription) {
 <style scoped lang="scss">
 .dropdown-trigger {
 	padding: 0.5rem;
+	display: flex;
 }
 </style>

src/components/tasks/partials/singleTaskInList.vue

@@ -38,7 +38,7 @@
 					<template v-for="(pt, i) in task.relatedTasks.parenttask">
 						{{ pt.title }}<template v-if="(i + 1) < task.relatedTasks.parenttask.length">,&nbsp;</template>
 					</template>
-					>
+					&rsaquo;
 				</span>
 				{{ task.title }}
 			</span>
@@ -71,7 +71,7 @@
 					class="is-italic"
 					:aria-expanded="showDefer ? 'true' : 'false'"
 				>
-					- {{ $t('task.detail.due', {at: formatDateSince(task.dueDate)}) }}
+					– {{ $t('task.detail.due', {at: formatDateSince(task.dueDate)}) }}
 				</time>
 			</BaseButton>
 			<CustomTransition name="fade">