Make file details UI more compact

lib/theme/text_style.dart

@@ -94,6 +94,7 @@ class EnteTextTheme {
   final TextStyle bodyMuted;
   final TextStyle smallMuted;
   final TextStyle miniMuted;
+  final TextStyle miniBoldMuted;
   final TextStyle tinyMuted;
 
   // textFaint variants
@@ -132,6 +133,7 @@ class EnteTextTheme {
     required this.bodyMuted,
     required this.smallMuted,
     required this.miniMuted,
+    required this.miniBoldMuted,
     required this.tinyMuted,
     required this.h1Faint,
     required this.h2Faint,
@@ -187,6 +189,7 @@ EnteTextTheme _buildEnteTextStyle(
     bodyMuted: body.copyWith(color: textMuted),
     smallMuted: small.copyWith(color: textMuted),
     miniMuted: mini.copyWith(color: textMuted),
+    miniBoldMuted: mini.copyWith(color: textMuted, fontWeight: _boldWeight),
     tinyMuted: tiny.copyWith(color: textMuted),
     h1Faint: h1.copyWith(color: textFaint),
     h2Faint: h2.copyWith(color: textFaint),

lib/ui/components/buttons/chip_button_widget.dart

@@ -34,7 +34,7 @@ class ChipButtonWidget extends StatelessWidget {
               leadingIcon != null
                   ? Icon(
                       leadingIcon,
-                      size: 17,
+                      size: 16,
                     )
                   : const SizedBox.shrink(),
               if (label != null && leadingIcon != null)
@@ -44,7 +44,7 @@ class ChipButtonWidget extends StatelessWidget {
                   padding: const EdgeInsets.symmetric(horizontal: 4),
                   child: Text(
                     label!,
-                    style: getEnteTextTheme(context).smallBold,
+                    style: getEnteTextTheme(context).miniBold,
                   ),
                 )
             ],

lib/ui/components/info_item_widget.dart

@@ -29,8 +29,8 @@ class InfoItemWidget extends StatelessWidget {
         Text(
           title!,
           style: hasChipButtons
-              ? getEnteTextTheme(context).smallMuted
-              : getEnteTextTheme(context).body,
+              ? getEnteTextTheme(context).miniMuted
+              : getEnteTextTheme(context).small,
         ),
         SizedBox(height: hasChipButtons ? 8 : 4),
       ]);

lib/ui/viewer/file/file_caption_widget.dart

@@ -125,11 +125,10 @@ class _FileCaptionWidgetState extends State<FileCaptionWidget> {
         filled: true,
         fillColor: colorScheme.fillFaint,
         hintText: hintText,
-        hintStyle: hintText == defaultHintText
-            ? textTheme.small.copyWith(color: colorScheme.textMuted)
-            : textTheme.small,
+        hintStyle:
+            hintText == defaultHintText ? textTheme.miniMuted : textTheme.mini,
       ),
-      style: textTheme.small,
+      style: textTheme.mini,
       cursorWidth: 1.5,
       maxLength: maxLength,
       minLines: 1,

lib/ui/viewer/file/file_details_widget.dart

@@ -310,7 +310,7 @@ class FileDetailsDivider extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    const dividerPadding = EdgeInsets.symmetric(vertical: 15.5);
+    const dividerPadding = EdgeInsets.symmetric(vertical: 9.5);
     return const DividerWidget(
       dividerType: DividerType.menu,
       divColorHasBlur: false,

lib/ui/viewer/file_details/backed_up_time_item_widget.dart

@@ -23,7 +23,7 @@ class BackedUpTimeItemWidget extends StatelessWidget {
           getTimeIn12hrFormat(dateTimeForUpdationTime) +
               "  " +
               dateTimeForUpdationTime.timeZoneName,
-          style: getEnteTextTheme(context).smallMuted,
+          style: getEnteTextTheme(context).miniMuted,
         ),
       ]),
     );

lib/ui/viewer/file_details/creation_time_item_widget.dart

@@ -32,7 +32,7 @@ class _CreationTimeItemState extends State<CreationTimeItem> {
       subtitleSection: Future.value([
         Text(
           getTimeIn12hrFormat(dateTime) + "  " + dateTime.timeZoneName,
-          style: getEnteTextTheme(context).smallMuted,
+          style: getEnteTextTheme(context).miniMuted,
         ),
       ]),
       editOnTap: ((widget.file.ownerID == null ||

lib/ui/viewer/file_details/exif_item_widgets.dart

@@ -4,7 +4,6 @@ import "package:photos/generated/l10n.dart";
 import "package:photos/models/file.dart";
 import "package:photos/theme/colors.dart";
 import "package:photos/theme/ente_theme.dart";
-import "package:photos/ui/components/buttons/inline_button_widget.dart";
 import "package:photos/ui/components/info_item_widget.dart";
 import "package:photos/ui/viewer/file/exif_info_dialog.dart";
 import "package:photos/utils/toast_util.dart";
@@ -15,7 +14,7 @@ class BasicExifItemWidget extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final subtitleTextTheme = getEnteTextTheme(context).smallMuted;
+    final subtitleTextTheme = getEnteTextTheme(context).miniMuted;
     return InfoItemWidget(
       key: const ValueKey("Basic EXIF"),
       leadingIcon: Icons.camera_outlined,
@@ -46,7 +45,7 @@ class BasicExifItemWidget extends StatelessWidget {
   }
 }
 
-class AllExifItemWidget extends StatelessWidget {
+class AllExifItemWidget extends StatefulWidget {
   final File file;
   final Map<String, IfdTag>? exif;
   const AllExifItemWidget(
@@ -55,20 +54,33 @@ class AllExifItemWidget extends StatelessWidget {
     super.key,
   });
 
+  @override
+  State<AllExifItemWidget> createState() => _AllExifItemWidgetState();
+}
+
+class _AllExifItemWidgetState extends State<AllExifItemWidget> {
+  VoidCallback? _onTap;
+
+  @override
+  void initState() {
+    super.initState();
+  }
+
   @override
   Widget build(BuildContext context) {
     return InfoItemWidget(
       leadingIcon: Icons.text_snippet_outlined,
       title: S.of(context).exif,
-      subtitleSection: _exifButton(context, file, exif),
+      subtitleSection: _exifButton(context, widget.file, widget.exif),
+      onTap: _onTap,
     );
   }
 
-  Future<List<InlineButtonWidget>> _exifButton(
+  Future<List<Widget>> _exifButton(
     BuildContext context,
     File file,
     Map<String, IfdTag>? exif,
-  ) {
+  ) async {
     late final String label;
     late final VoidCallback? onTap;
     if (exif == null) {
@@ -88,11 +100,11 @@ class AllExifItemWidget extends StatelessWidget {
       onTap =
           () => showShortToast(context, S.of(context).thisImageHasNoExifData);
     }
+    setState(() {
+      _onTap = onTap;
+    });
     return Future.value([
-      InlineButtonWidget(
-        label,
-        onTap,
-      )
+      Text(label, style: getEnteTextTheme(context).miniBoldMuted),
     ]);
   }
 }

lib/ui/viewer/file_details/file_properties_item_widget.dart

@@ -56,7 +56,7 @@ class _FilePropertiesItemWidgetState extends State<FilePropertiesItemWidget> {
         Text(
           "${widget.exifData["megaPixels"]}MP  "
           "${widget.exifData["resolution"]}  ",
-          style: getEnteTextTheme(context).smallMuted,
+          style: getEnteTextTheme(context).miniMuted,
         ),
       );
     }
@@ -70,7 +70,7 @@ class _FilePropertiesItemWidgetState extends State<FilePropertiesItemWidget> {
     subSectionWidgets.add(
       Text(
         (fileSize / (1024 * 1024)).toStringAsFixed(2) + " MB",
-        style: getEnteTextTheme(context).smallMuted,
+        style: getEnteTextTheme(context).miniMuted,
       ),
     );
 
@@ -80,7 +80,7 @@ class _FilePropertiesItemWidgetState extends State<FilePropertiesItemWidget> {
         subSectionWidgets.add(
           Text(
             secondsToHHMMSS(widget.file.duration!),
-            style: getEnteTextTheme(context).smallMuted,
+            style: getEnteTextTheme(context).miniMuted,
           ),
         );
       } else {
@@ -88,7 +88,7 @@ class _FilePropertiesItemWidgetState extends State<FilePropertiesItemWidget> {
         subSectionWidgets.add(
           Text(
             asset?.videoDuration.toString().split(".")[0] ?? "",
-            style: getEnteTextTheme(context).smallMuted,
+            style: getEnteTextTheme(context).miniMuted,
           ),
         );
       }

lib/ui/viewer/file_details/location_tags_widget.dart

@@ -80,7 +80,7 @@ class _LocationTagsWidgetState extends State<LocationTagsWidget> {
       return [
         Text(
           S.of(context).groupNearbyPhotos,
-          style: getEnteTextTheme(context).smallMuted,
+          style: getEnteTextTheme(context).miniBoldMuted,
         )
       ];
     } else {