feat: profile card

packages/uni_ui/lib/profile/profile_card.dart

@@ -0,0 +1,61 @@
+import 'package:flutter/material.dart';
+import 'package:phosphor_flutter/phosphor_flutter.dart';
+import 'package:uni_ui/generic_card.dart';
+
+class ProfileCard extends StatelessWidget {
+  const ProfileCard({
+    super.key,
+    required this.label,
+    required this.content,
+    this.tooltip,
+  });
+
+  final String label;
+  final String content;
+  final String? tooltip;
+
+  @override
+  Widget build(BuildContext context) {
+    return Stack(
+      clipBehavior: Clip.none,
+      children: [
+        GenericCard(
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Text(
+                label,
+                overflow: TextOverflow.ellipsis,
+                style: Theme.of(context).textTheme.titleSmall!,
+              ),
+              Text(
+                content,
+                overflow: TextOverflow.ellipsis,
+              ),
+            ],
+          ),
+        ),
+        if (tooltip != null)
+          Positioned(
+            bottom: -4,
+            right: 2,
+            child: Tooltip(
+              message: tooltip!,
+              child: Container(
+                child: PhosphorIcon(
+                  PhosphorIcons.plus(PhosphorIconsStyle.light),
+                  color: Colors.white,
+                  size: 14,
+                ),
+                padding: EdgeInsets.all(3.0),
+                decoration: BoxDecoration(
+                  shape: BoxShape.circle,
+                  color: Theme.of(context).colorScheme.primary,
+                ),
+              ),
+            ),
+          ),
+      ],
+    );
+  }
+}

packages/uni_ui/lib/theme.dart

@@ -14,19 +14,35 @@ const _textTheme = TextTheme(
   displayLarge: TextStyle(fontSize: 40, fontWeight: FontWeight.w400),
   displayMedium: TextStyle(fontSize: 32, fontWeight: FontWeight.w400),
   displaySmall: TextStyle(fontSize: 28, fontWeight: FontWeight.w400),
+  headlineLarge: TextStyle(fontSize: 28, fontWeight: FontWeight.w300),
   headlineMedium: TextStyle(fontSize: 24, fontWeight: FontWeight.w300),
   headlineSmall: TextStyle(fontSize: 20, fontWeight: FontWeight.w400),
   titleLarge: TextStyle(fontSize: 18, fontWeight: FontWeight.w300),
   titleMedium: TextStyle(fontSize: 17, fontWeight: FontWeight.w300),
-  titleSmall: TextStyle(fontSize: 16, fontWeight: FontWeight.w300),
+  titleSmall: TextStyle(fontSize: 16, fontWeight: FontWeight.w500),
   bodyLarge: TextStyle(fontSize: 16, fontWeight: FontWeight.w400),
   bodyMedium: TextStyle(fontSize: 14, fontWeight: FontWeight.w400),
   bodySmall: TextStyle(fontSize: 13, fontWeight: FontWeight.w400),
 );
 
+var _lightTextTheme = TextTheme(
+  displayLarge: _textTheme.displayLarge!,
+  displayMedium: _textTheme.displayMedium!,
+  displaySmall: _textTheme.displaySmall!,
+  headlineLarge: _textTheme.headlineLarge!,
+  headlineMedium: _textTheme.headlineMedium!.copyWith(color: darkRed),
+  headlineSmall: _textTheme.headlineSmall!,
+  titleLarge: _textTheme.titleLarge!.copyWith(color: darkRed),
+  titleMedium: _textTheme.titleMedium!,
+  titleSmall: _textTheme.titleSmall!.copyWith(color: darkRed),
+  bodyLarge: _textTheme.bodyLarge!,
+  bodyMedium: _textTheme.bodyMedium!,
+  bodySmall: _textTheme.bodySmall!,
+);
+
 ThemeData lightTheme = ThemeData(
   useMaterial3: true,
-  textTheme: _textTheme,
+  textTheme: _lightTextTheme,
   colorScheme: ColorScheme.fromSeed(
       seedColor: darkRed,
       surface: mildWhite,
@@ -48,3 +64,10 @@ ThemeData lightTheme = ThemeData(
   secondaryHeaderColor: normalGray,
   iconTheme: const IconThemeData(color: darkRed),
 );
+
+class BadgeColors {
+  static const mt = Color(0xFF7ca5b8);
+  static const en = Color(0xFF769c87);
+  static const er = Color(0xFFab4d39);
+  static const ee = Color(0xFFfbc11f);
+}