fix: grade design

firka/lib/ui/phone/widgets/grade_chart.dart

@@ -135,7 +135,6 @@ class _GradeChartState extends State<GradeChart> {
   @override
   Widget build(BuildContext context) {
     return FirkaCard.single(
-      padding: 0,
       child: ClipRRect(
         borderRadius: BorderRadius.circular(16),
         child: AspectRatio(aspectRatio: 1.82, child: LineChart(avgData())),

firka/lib/ui/phone/widgets/info_card.dart

@@ -23,7 +23,7 @@ class InfoCard extends StatelessWidget {
 
   final List<TextStyle> textSyles = [
     appStyle.fonts.B_16SB.apply(color: appStyle.colors.textPrimary),
-    appStyle.fonts.B_16R.apply(color: appStyle.colors.textSecondary),
+    appStyle.fonts.B_14R.apply(color: appStyle.colors.textSecondary),
   ];
 
   InfoCard({
@@ -168,18 +168,22 @@ class InfoCard extends StatelessWidget {
     }
     return GestureDetector(
       child: FirkaCard.single(
-        padding: 16,
+        height: 68,
         child: Row(
           spacing: 12,
           children: [
+            SizedBox(width: 4),
             icon,
             Expanded(
               child: Column(
                 crossAxisAlignment: CrossAxisAlignment.start,
+                mainAxisSize: MainAxisSize.min,
+                spacing: 2,
                 children: children,
               ),
             ),
             ...right,
+            SizedBox(width: 4),
           ],
         ),
       ),

firka_common/lib/ui/components/firka_card.dart

@@ -52,7 +52,7 @@ class FirkaCard extends StatelessWidget {
   }
 
   const FirkaCard.single({
-    this.padding = 12,
+    this.padding = 0,
     this.shadow = true,
     this.attached = Attach.none,
     this.color,

firka_common/lib/ui/components/grade.dart

@@ -34,12 +34,9 @@ class GradeWidget extends StatelessWidget {
       return FilledCircle(
         diameter: 36,
         color: gradeColor.withAlpha(38),
-        child: Row(
-          mainAxisSize: MainAxisSize.min,
-          children: [
-            Text('❝', style: appStyle.fonts.P_14.copyWith(color: gradeColor)),
-            Text('❠', style: appStyle.fonts.P_14.copyWith(color: gradeColor)),
-          ],
+        child: Text(
+          '❝❠',
+          style: appStyle.fonts.B_16SB.copyWith(color: gradeColor),
         ),
       );
     }
@@ -68,10 +65,14 @@ class GradeWidget extends StatelessWidget {
   Widget _buildNumericCircle(int value, int weight) {
     final gradeColor = getGradeColor(value);
     final size = 36.0;
+    final textStyle = appStyle.fonts.H_H1.copyWith(
+      color: gradeColor,
+      fontSize: 27,
+    );
     final text = Text(
       value.toString(),
       style: weight < 100
-          ? appStyle.fonts.H_H1.copyWith(
+          ? textStyle.copyWith(
               foreground: Paint()
                 ..color = gradeColor
                 ..style = PaintingStyle.stroke
@@ -79,7 +80,7 @@ class GradeWidget extends StatelessWidget {
                 ..strokeCap = StrokeCap.round
                 ..strokeWidth = 1.13,
             )
-          : appStyle.fonts.H_H1.copyWith(color: gradeColor),
+          : textStyle,
     );
 
     if (weight > 100) {