feat: fontbuilder to streamline font styling

Modules/Notifications/Notification.qml

@@ -94,8 +94,7 @@ CustomRect {
 			implicitHeight: root.nonAnimHeight
 
 			Behavior on implicitHeight {
-				Anim {
-				}
+				Anim {}
 			}
 
 			Loader {
@@ -171,6 +170,7 @@ CustomRect {
 						sourceComponent: MaterialIcon {
 							color: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onError : root.modelData.urgency === NotificationUrgency.Low ? Colors.palette.m3onSurface : Colors.palette.m3onSecondaryContainer
 							text: Icons.getNotifIcon(root.modelData.summary, root.modelData.urgency)
+							fontStyle: Tokens.font.icon.medium
 						}
 					}
 				}
@@ -222,6 +222,7 @@ CustomRect {
 				maximumLineCount: 1
 				opacity: root.expanded ? 1 : 0
 				text: appNameMetrics.elidedText
+				font: Tokens.font.label.medium
 
 				Behavior on opacity {
 					Anim {
@@ -246,14 +247,12 @@ CustomRect {
 				anchors.leftMargin: Tokens.spacing.small
 				anchors.top: parent.top
 				animate: true
-				font.pointSize: Tokens.font.size.small
 				height: implicitHeight
 				maximumLineCount: 1
 				text: summaryMetrics.elidedText
 
 				Behavior on height {
-					Anim {
-					}
+					Anim {}
 				}
 				states: State {
 					name: "expanded"
@@ -281,8 +280,7 @@ CustomRect {
 						property: "topMargin"
 					}
 
-					AnchorAnim {
-					}
+					AnchorAnim {}
 				}
 			}
 
@@ -303,6 +301,7 @@ CustomRect {
 				anchors.top: parent.top
 				color: Colors.palette.m3onSurfaceVariant
 				text: "•"
+				font: Tokens.font.body.small
 
 				states: State {
 					name: "expanded"
@@ -314,8 +313,7 @@ CustomRect {
 					}
 				}
 				transitions: Transition {
-					AnchorAnim {
-					}
+					AnchorAnim {}
 				}
 			}
 
@@ -327,7 +325,7 @@ CustomRect {
 				anchors.top: parent.top
 				animate: true
 				color: Colors.palette.m3onSurfaceVariant
-				font.pointSize: Tokens.font.size.small
+				font: Tokens.font.body.small
 				horizontalAlignment: Text.AlignLeft
 				text: root.modelData.timeStr
 			}
@@ -355,14 +353,13 @@ CustomRect {
 					anchors.verticalCenterOffset: root.expanded ? -1 : 1
 					rotation: root.expanded ? 180 : 0
 					text: "expand_more"
+					fontStyle: Tokens.font.icon.medium
 
 					Behavior on anchors.verticalCenterOffset {
-						Anim {
-						}
+						Anim {}
 					}
 					Behavior on rotation {
-						Anim {
-						}
+						Anim {}
 					}
 				}
 			}
@@ -376,7 +373,7 @@ CustomRect {
 				anchors.top: summary.bottom
 				animate: true
 				color: Colors.palette.m3onSurfaceVariant
-				font.pointSize: Tokens.font.size.small
+				font: Tokens.font.body.small
 				opacity: root.expanded ? 0 : 1
 				text: bodyPreviewMetrics.elidedText
 				textFormat: Text.MarkdownText
@@ -407,6 +404,7 @@ CustomRect {
 				animate: true
 				color: Colors.palette.m3onSurfaceVariant
 				height: text ? implicitHeight : 0
+				font: Tokens.font.body.medium
 				opacity: root.expanded ? 1 : 0
 				text: root.modelData.body
 				textFormat: Text.MarkdownText
@@ -447,6 +445,7 @@ CustomRect {
 					enabled: root.expanded
 					fillWidth: root.modelData.actions.length === 0
 					icon: "close"
+					font: Tokens.font.icon.builders.small.size(14).build()
 					inactiveColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3secondary : Colors.layer(Colors.palette.m3surfaceContainerHighest, 2)
 					inactiveOnColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onSecondary : Colors.palette.m3onSurfaceVariant
 					isRound: true
@@ -464,7 +463,6 @@ CustomRect {
 
 						enabled: root.expanded
 						fillWidth: true
-						font.pointSize: Tokens.font.size.small
 						implicitWidth: label.implicitWidth
 						inactiveColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3secondary : Colors.layer(Colors.palette.m3surfaceContainerHighest, 2)
 						inactiveOnColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onSecondary : Colors.palette.m3onSurfaceVariant
@@ -493,6 +491,7 @@ CustomRect {
 					label.animate: true
 					padding: Tokens.padding.extraSmall
 					shapeMorph: true
+					font: Tokens.font.icon.builders.small.size(14).build()
 
 					onClicked: {
 						Quickshell.clipboardText = root.modelData.body;