mirror of
https://github.com/KRTirtho/spotube.git
synced 2025-09-12 23:45:18 +00:00
fix: tabbar overflow in small screen, artist card too small title and synced lyrics contrast increased
This commit is contained in:
Kingkor Roy Tirtho
parent
8d77b6900a
commit
585de8c1de
@ -47,16 +47,12 @@ class ArtistCard extends StatelessWidget {
|
||||
minRadius: 20,
|
||||
backgroundImage: backgroundImage,
|
||||
),
|
||||
SizedBox(
|
||||
height: 20,
|
||||
child: SpotubeMarqueeText(
|
||||
text: artist.name!,
|
||||
style: Theme.of(context).textTheme.bodyLarge!.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
minStartLength: 15,
|
||||
isHovering: isHovering,
|
||||
),
|
||||
SpotubeMarqueeText(
|
||||
text: artist.name!,
|
||||
style: Theme.of(context).textTheme.bodyLarge!.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
isHovering: isHovering,
|
||||
),
|
||||
Text(
|
||||
"Artist",
|
||||
|
||||
@ -18,12 +18,9 @@ class UserLibrary extends ConsumerWidget {
|
||||
length: 4,
|
||||
child: SafeArea(
|
||||
child: Scaffold(
|
||||
appBar: TabBar(
|
||||
indicator: const BoxDecoration(color: Colors.transparent),
|
||||
labelColor: Theme.of(context).primaryColor,
|
||||
unselectedLabelColor:
|
||||
Theme.of(context).textTheme.bodyText1?.color,
|
||||
tabs: const [
|
||||
appBar: const TabBar(
|
||||
isScrollable: true,
|
||||
tabs: [
|
||||
Tab(text: "Playlist"),
|
||||
Tab(text: "Artists"),
|
||||
Tab(text: "Album"),
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import 'dart:ui';
|
||||
|
||||
import 'package:auto_size_text/auto_size_text.dart';
|
||||
import 'package:cached_network_image/cached_network_image.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
@ -160,7 +161,6 @@ class SyncedLyrics extends HookConsumerWidget {
|
||||
child: SpotubeMarqueeText(
|
||||
text: playback.track?.name ?? "Not Playing",
|
||||
style: headlineTextStyle,
|
||||
minStartLength: 29,
|
||||
isHovering: true,
|
||||
),
|
||||
),
|
||||
@ -218,24 +218,31 @@ class SyncedLyrics extends HookConsumerWidget {
|
||||
key: ValueKey(index),
|
||||
index: index,
|
||||
controller: controller,
|
||||
child: Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: Text(
|
||||
lyricSlice.text,
|
||||
style: TextStyle(
|
||||
// indicating the active state of that lyric slice
|
||||
color: isActive
|
||||
? Theme.of(context).primaryColor
|
||||
: palette.bodyTextColor,
|
||||
fontWeight:
|
||||
isActive ? FontWeight.bold : null,
|
||||
fontSize: 30,
|
||||
child: lyricSlice.text.isEmpty
|
||||
? Container()
|
||||
: Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: AutoSizeText(
|
||||
lyricSlice.text,
|
||||
maxLines: 2,
|
||||
style: Theme.of(context)
|
||||
.textTheme
|
||||
.headline4
|
||||
?.copyWith(
|
||||
color: isActive
|
||||
? Theme.of(context)
|
||||
.backgroundColor
|
||||
: palette.bodyTextColor,
|
||||
// indicating the active state of that lyric slice
|
||||
fontWeight: isActive
|
||||
? FontWeight.bold
|
||||
: null,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
|
||||
@ -90,7 +90,6 @@ class PlayerView extends HookConsumerWidget {
|
||||
color: paletteColor.titleTextColor,
|
||||
),
|
||||
isHovering: true,
|
||||
minStartLength: 29,
|
||||
),
|
||||
),
|
||||
TypeConversionUtils.artists_X_ClickableArtists(
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import 'package:auto_size_text/auto_size_text.dart';
|
||||
import 'package:file_picker/file_picker.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
@ -164,7 +165,10 @@ class Settings extends HookConsumerWidget {
|
||||
),
|
||||
AdaptiveListTile(
|
||||
leading: const Icon(Icons.screen_search_desktop_rounded),
|
||||
title: const Text("Format of the YouTube Search term"),
|
||||
title: const AutoSizeText(
|
||||
"Format of the YouTube Search term",
|
||||
maxLines: 2,
|
||||
),
|
||||
subtitle: const Text("(Case sensitive)"),
|
||||
breakOn: Breakpoints.lg,
|
||||
trailing: ConstrainedBox(
|
||||
@ -218,7 +222,7 @@ class Settings extends HookConsumerWidget {
|
||||
Icons.login_rounded,
|
||||
color: Theme.of(context).primaryColor,
|
||||
),
|
||||
title: Text(
|
||||
title: AutoSizeText(
|
||||
"Login with your Spotify account",
|
||||
style: TextStyle(
|
||||
color: Theme.of(context).primaryColor,
|
||||
@ -250,7 +254,10 @@ class Settings extends HookConsumerWidget {
|
||||
),
|
||||
AdaptiveListTile(
|
||||
leading: const Icon(Icons.low_priority_rounded),
|
||||
title: const Text("Track Match Algorithm"),
|
||||
title: const AutoSizeText(
|
||||
"Track Match Algorithm",
|
||||
maxLines: 1,
|
||||
),
|
||||
trailing: DropdownButton<SpotubeTrackMatchAlgorithm>(
|
||||
value: preferences.trackMatchAlgorithm,
|
||||
items: const [
|
||||
@ -307,7 +314,10 @@ class Settings extends HookConsumerWidget {
|
||||
Auth auth = ref.watch(authProvider);
|
||||
return ListTile(
|
||||
leading: const Icon(Icons.logout_rounded),
|
||||
title: const Text("Log out of this account"),
|
||||
title: const AutoSizeText(
|
||||
"Log out of this account",
|
||||
maxLines: 1,
|
||||
),
|
||||
trailing: ElevatedButton(
|
||||
child: const Text("Logout"),
|
||||
style: ButtonStyle(
|
||||
@ -328,8 +338,9 @@ class Settings extends HookConsumerWidget {
|
||||
Icons.favorite_border_rounded,
|
||||
color: Colors.pink,
|
||||
),
|
||||
title: const Text(
|
||||
title: const AutoSizeText(
|
||||
"We know you Love Spotube",
|
||||
maxLines: 1,
|
||||
style: TextStyle(
|
||||
color: Colors.pink,
|
||||
fontWeight: FontWeight.bold,
|
||||
|
||||
@ -106,7 +106,6 @@ class PlaybuttonCard extends StatelessWidget {
|
||||
text: title,
|
||||
style:
|
||||
const TextStyle(fontWeight: FontWeight.bold),
|
||||
minStartLength: 20,
|
||||
isHovering: isHovering,
|
||||
),
|
||||
),
|
||||
@ -125,7 +124,6 @@ class PlaybuttonCard extends StatelessWidget {
|
||||
?.color,
|
||||
),
|
||||
isHovering: isHovering,
|
||||
minStartLength: 30,
|
||||
),
|
||||
),
|
||||
]
|
||||
|
||||
@ -4,13 +4,11 @@ import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:marquee/marquee.dart';
|
||||
|
||||
class SpotubeMarqueeText extends HookWidget {
|
||||
final int? minStartLength;
|
||||
final bool? isHovering;
|
||||
const SpotubeMarqueeText({
|
||||
Key? key,
|
||||
required this.text,
|
||||
this.style,
|
||||
this.minStartLength,
|
||||
this.isHovering,
|
||||
}) : super(key: key);
|
||||
final TextStyle? style;
|
||||
@ -29,6 +27,7 @@ class SpotubeMarqueeText extends HookWidget {
|
||||
text,
|
||||
minFontSize: 13,
|
||||
style: style,
|
||||
maxLines: 1,
|
||||
overflowReplacement: Marquee(
|
||||
key: uKey.value,
|
||||
text: text,
|
||||
|
||||
@ -80,5 +80,13 @@ ThemeData darkTheme({
|
||||
}
|
||||
}),
|
||||
),
|
||||
tabBarTheme: TabBarTheme(
|
||||
indicator: const BoxDecoration(color: Colors.transparent),
|
||||
labelColor: accentMaterialColor[500],
|
||||
unselectedLabelColor: Colors.white,
|
||||
labelStyle: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
|
||||
unselectedLabelStyle:
|
||||
const TextStyle(fontWeight: FontWeight.w600, fontSize: 16),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@ -104,5 +104,13 @@ ThemeData lightTheme({
|
||||
}
|
||||
}),
|
||||
),
|
||||
tabBarTheme: TabBarTheme(
|
||||
indicator: const BoxDecoration(color: Colors.transparent),
|
||||
labelColor: accentMaterialColor[500],
|
||||
unselectedLabelColor: Colors.grey[850],
|
||||
labelStyle: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
|
||||
unselectedLabelStyle:
|
||||
const TextStyle(fontWeight: FontWeight.w600, fontSize: 16),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user