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);
+}