fix huge numbers turning into ... in top roll up header

Shared/views/SmallRollUpHeaderView.swift

@@ -58,13 +58,20 @@ struct SmallRollUpHeaderView: View {
     private var circularViews: some View {
         HStack {
             ForEach(entries, id: \.0) { (mood, value) in
-                Text(String(value))
+                ZStack {
-                    .font(.title)
+                    Circle().fill(mood.color)
-                    .fontWeight(.bold)
+                        .frame(width: 50, height: 50)
-                    .frame(maxWidth: .infinity)
+                    
-                    .padding()
+                    Text(String(value))
-                    .background(Circle().fill(mood.color))
+                        .font(.title)
-                    .foregroundColor(Color(UIColor.white))
+                        .fontWeight(.bold)
+                        .frame(maxWidth: 50)
+                        .foregroundColor(Color(UIColor.white))
+                        .scaledToFill()
+                        .minimumScaleFactor(0.5)
+                        .lineLimit(1)
+                }
+                .padding([.leading, .trailing], 5)
             }
         }
     }