feat(ui): iPhone Liquid Glass redesign for Search, Favorites, and History, fix cheat sheet clearance and update sheet
Build and Release / Build Windows x64 (push) Has been cancelled

This commit is contained in:
2026-09-04 19:06:37 +03:00
parent ec594595c9
commit 384c07955c
10 changed files with 1444 additions and 802 deletions
+1 -1
View File
@@ -10,7 +10,7 @@
</p> </p>
<p align="center"> <p align="center">
<a href="https://github.com/RarDog/Lunaris/releases"><img src="https://img.shields.io/badge/Version-3.0.9-8A2BE2?style=for-the-badge&logo=semver&logoColor=white" alt="Version 3.0.9" /></a> <a href="https://github.com/RarDog/Lunaris/releases"><img src="https://img.shields.io/badge/Version-3.1.0-8A2BE2?style=for-the-badge&logo=semver&logoColor=white" alt="Version 3.1.0" /></a>
<img src="https://img.shields.io/badge/Flutter-3.47+-02569B?style=for-the-badge&logo=flutter&logoColor=white" alt="Flutter" /> <img src="https://img.shields.io/badge/Flutter-3.47+-02569B?style=for-the-badge&logo=flutter&logoColor=white" alt="Flutter" />
<img src="https://img.shields.io/badge/Platform-Android%20%7C%20Linux%20%7C%20Windows-00C853?style=for-the-badge" alt="Platforms" /> <img src="https://img.shields.io/badge/Platform-Android%20%7C%20Linux%20%7C%20Windows-00C853?style=for-the-badge" alt="Platforms" />
<a href="https://github.com/RarDog/Lunaris/wiki"><img src="https://img.shields.io/badge/Wiki-Documentation-FF6F00?style=for-the-badge&logo=gitbook&logoColor=white" alt="Wiki" /></a> <a href="https://github.com/RarDog/Lunaris/wiki"><img src="https://img.shields.io/badge/Wiki-Documentation-FF6F00?style=for-the-badge&logo=gitbook&logoColor=white" alt="Wiki" /></a>
+2 -2
View File
@@ -1,3 +1,3 @@
const appDisplayVersion = '3.0.9'; const appDisplayVersion = '3.1.0';
const appBuildNumber = 60; const appBuildNumber = 61;
const appReleaseChannel = 'Stable'; const appReleaseChannel = 'Stable';
+10
View File
@@ -1,4 +1,14 @@
const lunarisChangelog = [ const lunarisChangelog = [
LunarisChange(
version: '3.1.0',
title: 'iPhone Liquid Glass — Поиск, Избранное, История и исправление доступности',
bullets: [
'Liquid Glass редизайн разделов «Поиск», «Избранное» и «История»: матовые стеклянные карточки (BackdropFilter blur), полупрозрачные градиенты, зеркальные контуры и сквиркл-бейджи иконок в стиле iOS.',
'Исправление шпаргалки по поиску: увеличен нижний отступ прокрутки во всех списках и сетках до 140px + safe area, благодаря чему блок операторов и шпаргалка по поиску больше не перекрываются парящей навигационной панелью и легко нажимаются.',
'Исправление модального окна проверки обновлений: панель с выбором источников (GitHub и Gitea) открывается через корневой навигатор поверх всей навигации с безопасным отступом снизу, обеспечивая беспрепятственный доступ к обеим кнопкам.',
'Тактильный отклик и стеклянные пилюли: быстрые операторы, категории, недавние запросы, фильтры медиа и переключатели разделов получили матовое оформление и вибрационный отклик Haptic Feedback.',
],
),
LunarisChange( LunarisChange(
version: '3.0.9', version: '3.0.9',
title: 'Коррекция позиции кнопки настроек и отображения кнопок JSON и бэкапа', title: 'Коррекция позиции кнопки настроек и отображения кнопок JSON и бэкапа',
@@ -1,5 +1,8 @@
import 'dart:ui';
import 'package:cached_network_image/cached_network_image.dart'; import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart'; import 'package:go_router/go_router.dart';
@@ -176,82 +179,154 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
// Search input bar if active // Search input bar if active
if (_isSearching) if (_isSearching)
Padding( Padding(
padding: const EdgeInsets.fromLTRB(16, 8, 16, 4), padding: const EdgeInsets.fromLTRB(16, 6, 16, 6),
child: TextField( child: ClipRRect(
controller: _searchController, borderRadius: BorderRadius.circular(18),
autofocus: true, child: BackdropFilter(
decoration: InputDecoration( filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
hintText: isRu child: Container(
? 'Поиск по тегам и авторам...' decoration: BoxDecoration(
: 'Search by tags and artists...', color: Theme.of(context).brightness == Brightness.dark
prefixIcon: const Icon(Icons.search_rounded), ? Theme.of(context).colorScheme.surfaceContainerHigh
suffixIcon: _searchQuery.isNotEmpty .withValues(alpha: 0.55)
? IconButton( : Colors.white.withValues(alpha: 0.80),
icon: const Icon(Icons.clear_rounded), borderRadius: BorderRadius.circular(18),
onPressed: () { border: Border.all(
_searchController.clear(); color: Theme.of(context).brightness == Brightness.dark
setState(() => _searchQuery = ''); ? Colors.white.withValues(alpha: 0.14)
}, : Colors.white.withValues(alpha: 0.85),
) width: 1.1,
: null, ),
isDense: true, ),
filled: true, child: TextField(
contentPadding: const EdgeInsets.symmetric( controller: _searchController,
horizontal: 16, autofocus: true,
vertical: 10, decoration: InputDecoration(
), hintText: isRu
border: OutlineInputBorder( ? 'Поиск по тегам и авторам...'
borderRadius: BorderRadius.circular(16), : 'Search by tags and artists...',
borderSide: BorderSide.none, prefixIcon: const Icon(Icons.search_rounded),
suffixIcon: _searchQuery.isNotEmpty
? IconButton(
icon: const Icon(Icons.clear_rounded),
onPressed: () {
HapticFeedback.lightImpact();
_searchController.clear();
setState(() => _searchQuery = '');
},
)
: null,
isDense: true,
filled: false,
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 10,
),
border: InputBorder.none,
),
onChanged: (val) =>
setState(() => _searchQuery = val.trim()),
),
), ),
), ),
onChanged: (val) => setState(() => _searchQuery = val.trim()),
), ),
), ),
// Navigation Tabs // Navigation Tabs with Liquid Glass container
Padding( Padding(
padding: const EdgeInsets.fromLTRB(16, 8, 16, 6), padding: const EdgeInsets.fromLTRB(16, 6, 16, 6),
child: SizedBox( child: Container(
width: double.infinity, decoration: BoxDecoration(
child: SegmentedButton<int>( borderRadius: BorderRadius.circular(22),
showSelectedIcon: false, boxShadow: [
segments: [ BoxShadow(
ButtonSegment( color: Colors.black.withValues(
value: 0, alpha: Theme.of(context).brightness == Brightness.dark
icon: const Icon(Icons.favorite_rounded, size: 18), ? 0.20
label: Text( : 0.04,
'${isRu ? 'Все' : 'All'} (${allPosts.length})',
style: const TextStyle(fontSize: 12),
overflow: TextOverflow.ellipsis,
),
),
ButtonSegment(
value: 1,
icon: const Icon(Icons.offline_pin_rounded, size: 18),
label: Text(
'${isRu ? 'Офлайн' : 'Offline'} (${offlinePosts.length})',
style: const TextStyle(fontSize: 12),
overflow: TextOverflow.ellipsis,
),
),
ButtonSegment(
value: 2,
icon: const Icon(Icons.groups_rounded, size: 18),
label: Text(
'${isRu ? 'Авторы' : 'Artists'} (${artistGroups.length})',
style: const TextStyle(fontSize: 12),
overflow: TextOverflow.ellipsis,
), ),
blurRadius: 10,
offset: const Offset(0, 2),
), ),
], ],
selected: {_tabIndex}, ),
onSelectionChanged: (value) { child: ClipRRect(
setState(() { borderRadius: BorderRadius.circular(22),
_tabIndex = value.first; child: BackdropFilter(
_selectedArtist = null; filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
}); child: Container(
}, decoration: BoxDecoration(
borderRadius: BorderRadius.circular(22),
color: Theme.of(context).brightness == Brightness.dark
? Theme.of(context)
.colorScheme
.surfaceContainerHigh
.withValues(alpha: 0.50)
: Colors.white.withValues(alpha: 0.72),
border: Border.all(
color: Theme.of(context).brightness == Brightness.dark
? Colors.white.withValues(alpha: 0.12)
: Colors.white.withValues(alpha: 0.85),
width: 1.1,
),
),
child: SizedBox(
width: double.infinity,
child: SegmentedButton<int>(
showSelectedIcon: false,
style: ButtonStyle(
visualDensity: VisualDensity.compact,
shape: WidgetStatePropertyAll(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
),
),
segments: [
ButtonSegment(
value: 0,
icon: const Icon(Icons.favorite_rounded, size: 18),
label: Text(
'${isRu ? 'Все' : 'All'} (${allPosts.length})',
style: const TextStyle(
fontSize: 12, fontWeight: FontWeight.w600),
overflow: TextOverflow.ellipsis,
),
),
ButtonSegment(
value: 1,
icon: const Icon(Icons.offline_pin_rounded,
size: 18),
label: Text(
'${isRu ? 'Офлайн' : 'Offline'} (${offlinePosts.length})',
style: const TextStyle(
fontSize: 12, fontWeight: FontWeight.w600),
overflow: TextOverflow.ellipsis,
),
),
ButtonSegment(
value: 2,
icon: const Icon(Icons.groups_rounded, size: 18),
label: Text(
'${isRu ? 'Авторы' : 'Artists'} (${artistGroups.length})',
style: const TextStyle(
fontSize: 12, fontWeight: FontWeight.w600),
overflow: TextOverflow.ellipsis,
),
),
],
selected: {_tabIndex},
onSelectionChanged: (value) {
HapticFeedback.selectionClick();
setState(() {
_tabIndex = value.first;
_selectedArtist = null;
});
},
),
),
),
),
), ),
), ),
), ),
@@ -265,9 +340,12 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
FilterChip( FilterChip(
label: Text(isRu ? 'Все' : 'All'), label: Text(isRu ? 'Все' : 'All'),
selected: _mediaFilter == FavoriteMediaType.all, selected: _mediaFilter == FavoriteMediaType.all,
onSelected: (_) => setState( onSelected: (_) {
() => _mediaFilter = FavoriteMediaType.all, HapticFeedback.selectionClick();
), setState(
() => _mediaFilter = FavoriteMediaType.all,
);
},
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
@@ -275,9 +353,12 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
avatar: const Icon(Icons.videocam_rounded, size: 16), avatar: const Icon(Icons.videocam_rounded, size: 16),
label: Text(isRu ? 'Видео' : 'Videos'), label: Text(isRu ? 'Видео' : 'Videos'),
selected: _mediaFilter == FavoriteMediaType.video, selected: _mediaFilter == FavoriteMediaType.video,
onSelected: (_) => setState( onSelected: (_) {
() => _mediaFilter = FavoriteMediaType.video, HapticFeedback.selectionClick();
), setState(
() => _mediaFilter = FavoriteMediaType.video,
);
},
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
@@ -285,9 +366,12 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
avatar: const Icon(Icons.image_rounded, size: 16), avatar: const Icon(Icons.image_rounded, size: 16),
label: Text(isRu ? 'Фото' : 'Images'), label: Text(isRu ? 'Фото' : 'Images'),
selected: _mediaFilter == FavoriteMediaType.image, selected: _mediaFilter == FavoriteMediaType.image,
onSelected: (_) => setState( onSelected: (_) {
() => _mediaFilter = FavoriteMediaType.image, HapticFeedback.selectionClick();
), setState(
() => _mediaFilter = FavoriteMediaType.image,
);
},
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
), ),
], ],
@@ -490,31 +574,40 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
}) { }) {
final scheme = Theme.of(context).colorScheme; final scheme = Theme.of(context).colorScheme;
return Container( return _FavoritesLiquidCard(
margin: const EdgeInsets.fromLTRB(16, 4, 16, 8), margin: const EdgeInsets.fromLTRB(16, 4, 16, 8),
padding: const EdgeInsets.all(14), padding: const EdgeInsets.all(14),
decoration: BoxDecoration( glowColor: scheme.primary,
color: scheme.surfaceContainerHigh,
borderRadius: BorderRadius.circular(18),
border: Border.all(
color: scheme.outlineVariant.withValues(alpha: 0.35),
),
),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Row( Row(
children: [ children: [
Container( Container(
padding: const EdgeInsets.all(10), width: 40,
height: 40,
decoration: BoxDecoration( decoration: BoxDecoration(
color: scheme.primaryContainer.withValues(alpha: 0.7), gradient: LinearGradient(
colors: [
scheme.primary,
scheme.primary.withValues(alpha: 0.85),
],
),
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: scheme.primary.withValues(alpha: 0.35),
blurRadius: 7,
offset: const Offset(0, 2.5),
),
],
), ),
child: Icon( child: const Center(
Icons.offline_pin_rounded, child: Icon(
color: scheme.onPrimaryContainer, Icons.offline_pin_rounded,
size: 22, color: Colors.white,
size: 22,
),
), ),
), ),
const SizedBox(width: 12), const SizedBox(width: 12),
@@ -526,6 +619,7 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
'$downloadedCount ${isRu ? 'из' : 'of'} $totalCount ${isRu ? 'офлайн' : 'saved'}', '$downloadedCount ${isRu ? 'из' : 'of'} $totalCount ${isRu ? 'офлайн' : 'saved'}',
style: Theme.of(context).textTheme.titleSmall?.copyWith( style: Theme.of(context).textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.2,
), ),
), ),
const SizedBox(height: 2), const SizedBox(height: 2),
@@ -553,21 +647,22 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
if (pendingCount > 0) if (pendingCount > 0)
FilledButton.tonalIcon( FilledButton.tonalIcon(
onPressed: () async { onPressed: () async {
HapticFeedback.mediumImpact();
final dm = ref.read(downloadManagerServiceProvider); final dm = ref.read(downloadManagerServiceProvider);
for (final p in pendingPosts) { for (final p in pendingPosts) {
await dm.start(p); await dm.start(p);
} }
if (!mounted) return; if (!mounted) return;
ScaffoldMessenger.of(context).showSnackBar( ScaffoldMessenger.of(context).showSnackBar(
SnackBar( SnackBar(
content: Text( content: Text(
isRu isRu
? 'В очередь загрузки добавлено: $pendingCount' ? 'В очередь загрузки добавлено: $pendingCount'
: 'Queued $pendingCount downloads', : 'Queued $pendingCount downloads',
),
behavior: SnackBarBehavior.floating,
), ),
); behavior: SnackBarBehavior.floating,
),
);
}, },
icon: const Icon(Icons.download_rounded, size: 16), icon: const Icon(Icons.download_rounded, size: 16),
label: Text( label: Text(
@@ -594,7 +689,7 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
vertical: 6, vertical: 6,
), ),
decoration: BoxDecoration( decoration: BoxDecoration(
color: scheme.secondaryContainer.withValues(alpha: 0.5), color: scheme.primary.withValues(alpha: 0.12),
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(12),
), ),
child: Row( child: Row(
@@ -610,8 +705,8 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
isRu ? 'Всё готово' : 'Synced', isRu ? 'Всё готово' : 'Synced',
style: style:
Theme.of(context).textTheme.labelSmall?.copyWith( Theme.of(context).textTheme.labelSmall?.copyWith(
color: scheme.onSecondaryContainer, color: scheme.primary,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w700,
), ),
), ),
], ],
@@ -666,27 +761,36 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
ChoiceChip( ChoiceChip(
label: Text(isRu ? 'По дате' : 'Date'), label: Text(isRu ? 'По дате' : 'Date'),
selected: _offlineSort == OfflineSortOption.dateAddedDesc, selected: _offlineSort == OfflineSortOption.dateAddedDesc,
onSelected: (_) => setState( onSelected: (_) {
() => _offlineSort = OfflineSortOption.dateAddedDesc, HapticFeedback.selectionClick();
), setState(
() => _offlineSort = OfflineSortOption.dateAddedDesc,
);
},
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
), ),
const SizedBox(width: 6), const SizedBox(width: 6),
ChoiceChip( ChoiceChip(
label: Text(isRu ? 'По размеру' : 'Size'), label: Text(isRu ? 'По размеру' : 'Size'),
selected: _offlineSort == OfflineSortOption.sizeDesc, selected: _offlineSort == OfflineSortOption.sizeDesc,
onSelected: (_) => setState( onSelected: (_) {
() => _offlineSort = OfflineSortOption.sizeDesc, HapticFeedback.selectionClick();
), setState(
() => _offlineSort = OfflineSortOption.sizeDesc,
);
},
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
), ),
const SizedBox(width: 6), const SizedBox(width: 6),
ChoiceChip( ChoiceChip(
label: Text(isRu ? 'По автору' : 'Artist'), label: Text(isRu ? 'По автору' : 'Artist'),
selected: _offlineSort == OfflineSortOption.artist, selected: _offlineSort == OfflineSortOption.artist,
onSelected: (_) => setState( onSelected: (_) {
() => _offlineSort = OfflineSortOption.artist, HapticFeedback.selectionClick();
), setState(
() => _offlineSort = OfflineSortOption.artist,
);
},
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
), ),
], ],
@@ -712,38 +816,50 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
return Column( return Column(
children: [ children: [
// Artist Header Banner // Artist Header Banner (Liquid Glass)
Container( _FavoritesLiquidCard(
margin: const EdgeInsets.fromLTRB(16, 4, 16, 8), margin: const EdgeInsets.fromLTRB(16, 4, 16, 8),
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8), padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
decoration: BoxDecoration(
color: Theme.of(context)
.colorScheme
.surfaceContainerLow,
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: Theme.of(context)
.colorScheme
.outlineVariant
.withValues(alpha: 0.3),
),
),
child: Row( child: Row(
children: [ children: [
IconButton( IconButton(
onPressed: () => setState(() => _selectedArtist = null), onPressed: () {
HapticFeedback.selectionClick();
setState(() => _selectedArtist = null);
},
icon: const Icon(Icons.arrow_back_rounded), icon: const Icon(Icons.arrow_back_rounded),
tooltip: isRu ? 'Все авторы' : 'All artists', tooltip: isRu ? 'Все авторы' : 'All artists',
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
CircleAvatar( Container(
radius: 18, width: 38,
backgroundColor: Theme.of(context).colorScheme.primaryContainer, height: 38,
child: Text( decoration: BoxDecoration(
selected.isNotEmpty ? selected[0].toUpperCase() : '?', gradient: LinearGradient(
style: TextStyle( colors: [
fontWeight: FontWeight.bold, Theme.of(context).colorScheme.primary,
color: Theme.of(context).colorScheme.onPrimaryContainer, Theme.of(context).colorScheme.tertiary,
],
),
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: Theme.of(context)
.colorScheme
.primary
.withValues(alpha: 0.35),
blurRadius: 6,
offset: const Offset(0, 2),
),
],
),
child: Center(
child: Text(
selected.isNotEmpty ? selected[0].toUpperCase() : '?',
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
), ),
), ),
), ),
@@ -756,6 +872,7 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
selected, selected,
style: Theme.of(context).textTheme.titleMedium?.copyWith( style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.2,
), ),
maxLines: 1, maxLines: 1,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
@@ -776,6 +893,7 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
), ),
onPressed: () { onPressed: () {
HapticFeedback.selectionClick();
context.push('/search?q=${Uri.encodeComponent('artist:$selected')}'); context.push('/search?q=${Uri.encodeComponent('artist:$selected')}');
}, },
icon: const Icon(Icons.search_rounded, size: 16), icon: const Icon(Icons.search_rounded, size: 16),
@@ -808,7 +926,9 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
} }
return ListView.separated( return ListView.separated(
padding: const EdgeInsets.fromLTRB(16, 8, 16, 24), // Extended bottom padding so the last artist cards scroll comfortably above the floating dock
padding: EdgeInsets.fromLTRB(
16, 8, 16, 140 + MediaQuery.paddingOf(context).bottom),
itemCount: entries.length, itemCount: entries.length,
separatorBuilder: (_, __) => const SizedBox(height: 10), separatorBuilder: (_, __) => const SizedBox(height: 10),
itemBuilder: (context, index) { itemBuilder: (context, index) {
@@ -863,6 +983,83 @@ class _FavoritesScreenState extends ConsumerState<FavoritesScreen> {
} }
} }
class _FavoritesLiquidCard extends StatelessWidget {
const _FavoritesLiquidCard({
required this.child,
this.padding,
this.glowColor,
this.margin,
});
final Widget child;
final EdgeInsetsGeometry? padding;
final EdgeInsetsGeometry? margin;
final Color? glowColor;
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
final accent = glowColor ?? theme.colorScheme.primary;
return Container(
margin: margin,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(22),
boxShadow: [
BoxShadow(
color: isDark
? Colors.black.withValues(alpha: 0.30)
: accent.withValues(alpha: 0.07),
blurRadius: 16,
offset: const Offset(0, 5),
spreadRadius: -2,
),
BoxShadow(
color: accent.withValues(alpha: isDark ? 0.05 : 0.02),
blurRadius: 8,
offset: const Offset(0, 2),
),
],
),
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 18, sigmaY: 18),
child: Container(
padding: padding ?? const EdgeInsets.all(16),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(22),
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: isDark
? [
theme.colorScheme.surfaceContainerHigh
.withValues(alpha: 0.60),
theme.colorScheme.surfaceContainerLow
.withValues(alpha: 0.38),
]
: [
Colors.white.withValues(alpha: 0.88),
Colors.white.withValues(alpha: 0.72),
],
),
border: Border.all(
color: isDark
? Colors.white.withValues(alpha: 0.14)
: Colors.white.withValues(alpha: 0.85),
width: 1.2,
),
),
child: child,
),
),
),
);
}
}
class _ArtistCard extends StatelessWidget { class _ArtistCard extends StatelessWidget {
const _ArtistCard({ const _ArtistCard({
required this.artistName, required this.artistName,
@@ -881,123 +1078,182 @@ class _ArtistCard extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final scheme = Theme.of(context).colorScheme; final scheme = Theme.of(context).colorScheme;
final isDark = Theme.of(context).brightness == Brightness.dark;
return Card( return Container(
elevation: 0, decoration: BoxDecoration(
color: scheme.surfaceContainerLow, borderRadius: BorderRadius.circular(22),
shape: RoundedRectangleBorder( boxShadow: [
borderRadius: BorderRadius.circular(16), BoxShadow(
side: BorderSide( color: isDark
color: scheme.outlineVariant.withValues(alpha: 0.3), ? Colors.black.withValues(alpha: 0.28)
), : scheme.primary.withValues(alpha: 0.06),
blurRadius: 14,
offset: const Offset(0, 4),
spreadRadius: -2,
),
],
), ),
clipBehavior: Clip.antiAlias, child: ClipRRect(
child: InkWell( borderRadius: BorderRadius.circular(22),
onTap: onTap, child: BackdropFilter(
child: Padding( filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
padding: const EdgeInsets.all(12), child: Material(
child: Row( color: Colors.transparent,
children: [ child: InkWell(
// Artist Avatar borderRadius: BorderRadius.circular(22),
Container( onTap: () {
width: 48, HapticFeedback.selectionClick();
height: 48, onTap();
},
child: Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(22),
gradient: LinearGradient( gradient: LinearGradient(
colors: [
scheme.primaryContainer,
scheme.tertiaryContainer,
],
begin: Alignment.topLeft, begin: Alignment.topLeft,
end: Alignment.bottomRight, end: Alignment.bottomRight,
colors: isDark
? [
scheme.surfaceContainerHigh
.withValues(alpha: 0.58),
scheme.surfaceContainerLow
.withValues(alpha: 0.36),
]
: [
Colors.white.withValues(alpha: 0.88),
Colors.white.withValues(alpha: 0.72),
],
), ),
borderRadius: BorderRadius.circular(14), border: Border.all(
), color: isDark
child: Center( ? Colors.white.withValues(alpha: 0.13)
child: Text( : Colors.white.withValues(alpha: 0.85),
artistName.isNotEmpty ? artistName[0].toUpperCase() : '?', width: 1.1,
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: scheme.onPrimaryContainer,
),
), ),
), ),
), child: Row(
const SizedBox(width: 12),
// Artist Name & Count
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text( // Artist Squircle Avatar
artistName,
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
const SizedBox(height: 2),
Container( Container(
padding: const EdgeInsets.symmetric( width: 48,
horizontal: 8, height: 48,
vertical: 2,
),
decoration: BoxDecoration( decoration: BoxDecoration(
color: scheme.secondaryContainer.withValues(alpha: 0.5), gradient: LinearGradient(
borderRadius: BorderRadius.circular(8), colors: [
scheme.primary,
scheme.tertiary,
],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
borderRadius: BorderRadius.circular(15),
boxShadow: [
BoxShadow(
color: scheme.primary.withValues(alpha: 0.35),
blurRadius: 8,
offset: const Offset(0, 2.5),
),
],
), ),
child: Text( child: Center(
'$postsCount ${isRu ? 'работ' : 'posts'}', child: Text(
style: Theme.of(context).textTheme.labelSmall?.copyWith( artistName.isNotEmpty ? artistName[0].toUpperCase() : '?',
color: scheme.onSecondaryContainer, style: const TextStyle(
fontWeight: FontWeight.w600, fontSize: 20,
), fontWeight: FontWeight.bold,
), color: Colors.white,
),
],
),
),
// Thumbnails preview
if (previewUrls.isNotEmpty) ...[
const SizedBox(width: 8),
Row(
children: [
for (final url in previewUrls)
Padding(
padding: const EdgeInsets.only(left: 4),
child: ClipRRect(
borderRadius: BorderRadius.circular(8),
child: SizedBox(
width: 44,
height: 44,
child: CachedNetworkImage(
imageUrl: url,
fit: BoxFit.cover,
placeholder: (_, __) => Container(
color: scheme.surfaceContainerHighest,
),
errorWidget: (_, __, ___) => Container(
color: scheme.surfaceContainerHighest,
child: const Icon(
Icons.image_not_supported_rounded,
size: 16,
),
),
),
), ),
), ),
), ),
),
const SizedBox(width: 12),
// Artist Name & Count
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
artistName,
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
letterSpacing: -0.2,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
const SizedBox(height: 3),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 8,
vertical: 2,
),
decoration: BoxDecoration(
color: scheme.primary.withValues(alpha: 0.12),
borderRadius: BorderRadius.circular(8),
),
child: Text(
'$postsCount ${isRu ? 'работ' : 'posts'}',
style: Theme.of(context).textTheme.labelSmall?.copyWith(
color: scheme.primary,
fontWeight: FontWeight.w700,
),
),
),
],
),
),
// Thumbnails preview
if (previewUrls.isNotEmpty) ...[
const SizedBox(width: 8),
Row(
children: [
for (final url in previewUrls)
Padding(
padding: const EdgeInsets.only(left: 5),
child: ClipRRect(
borderRadius: BorderRadius.circular(10),
child: Container(
width: 44,
height: 44,
decoration: BoxDecoration(
border: Border.all(
color: isDark
? Colors.white.withValues(alpha: 0.10)
: scheme.outlineVariant.withValues(alpha: 0.25),
),
borderRadius: BorderRadius.circular(10),
),
child: CachedNetworkImage(
imageUrl: url,
fit: BoxFit.cover,
placeholder: (_, __) => Container(
color: scheme.surfaceContainerHighest,
),
errorWidget: (_, __, ___) => Container(
color: scheme.surfaceContainerHighest,
child: const Icon(
Icons.image_not_supported_rounded,
size: 16,
),
),
),
),
),
),
],
),
],
const SizedBox(width: 4),
Icon(
Icons.chevron_right_rounded,
size: 20,
color: scheme.onSurfaceVariant.withValues(alpha: 0.5),
),
], ],
), ),
],
const SizedBox(width: 6),
Icon(
Icons.chevron_right_rounded,
color: scheme.onSurfaceVariant.withValues(alpha: 0.6),
), ),
], ),
), ),
), ),
), ),
@@ -1,4 +1,7 @@
import 'dart:ui';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart'; import 'package:go_router/go_router.dart';
@@ -47,6 +50,7 @@ class _SearchScreenState extends ConsumerState<SearchScreen> {
final strings = AppStrings(settings.languageCode); final strings = AppStrings(settings.languageCode);
final isRu = strings.ru; final isRu = strings.ru;
final theme = Theme.of(context); final theme = Theme.of(context);
final bottomInset = MediaQuery.paddingOf(context).bottom;
return AdaptiveScaffold( return AdaptiveScaffold(
title: strings.search, title: strings.search,
@@ -78,19 +82,12 @@ class _SearchScreenState extends ConsumerState<SearchScreen> {
child: ConstrainedBox( child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 860), constraints: const BoxConstraints(maxWidth: 860),
child: ListView( child: ListView(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14), // Extended bottom padding so the cheat sheet card is never obscured by the floating dock
padding: EdgeInsets.fromLTRB(16, 14, 16, 140 + bottomInset),
children: [ children: [
// 1. Search Bar with Quick Operators // 1. Search Bar with Quick Operators
Container( _SearchLiquidCard(
padding: const EdgeInsets.all(16), glowColor: theme.colorScheme.primary,
decoration: BoxDecoration(
color: theme.colorScheme.surfaceContainerLow,
borderRadius: BorderRadius.circular(20),
border: Border.all(
color: theme.colorScheme.outlineVariant
.withValues(alpha: 0.3),
),
),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch, crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
@@ -171,56 +168,124 @@ class _SearchScreenState extends ConsumerState<SearchScreen> {
const SizedBox(height: 16), const SizedBox(height: 16),
// 2. Recent Searches Card // 2. Recent Searches Card
_SearchSectionCard( _SearchLiquidCard(
icon: Icons.history_rounded, glowColor: const Color(0xFF6366F1),
accentColor: const Color(0xFF6366F1), child: Column(
title: isRu ? 'Недавние запросы' : 'Recent searches', crossAxisAlignment: CrossAxisAlignment.start,
badgeCount: data.recent children: [
.map((e) => e.query.trim().toLowerCase()) Row(
.where((q) => q.isNotEmpty) children: [
.toSet() const _SearchIconBadge(
.length, icon: Icons.history_rounded,
trailing: data.recent.isEmpty color: Color(0xFF6366F1),
? null
: TextButton(
style: TextButton.styleFrom(
visualDensity: VisualDensity.compact,
padding: const EdgeInsets.symmetric(
horizontal: 10, vertical: 4),
minimumSize: Size.zero,
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
), ),
onPressed: () => ref const SizedBox(width: 12),
.read(searchControllerProvider.notifier) Expanded(
.clearHistory(), child: Row(
child: Text( mainAxisSize: MainAxisSize.min,
isRu ? 'Очистить' : 'Clear', children: [
style: TextStyle( Flexible(
color: theme.colorScheme.primary, child: Text(
fontSize: 13, isRu ? 'Недавние запросы' : 'Recent searches',
fontWeight: FontWeight.w600, maxLines: 1,
overflow: TextOverflow.ellipsis,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
fontSize: 15,
letterSpacing: -0.2,
),
),
),
if (data.recent.isNotEmpty) ...[
const SizedBox(width: 8),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 7, vertical: 2),
decoration: BoxDecoration(
color: const Color(0xFF6366F1)
.withValues(alpha: 0.16),
borderRadius: BorderRadius.circular(10),
),
child: Text(
'${data.recent.map((e) => e.query.trim().toLowerCase()).where((q) => q.isNotEmpty).toSet().length}',
style: theme.textTheme.labelSmall?.copyWith(
fontWeight: FontWeight.bold,
color: const Color(0xFF6366F1),
),
),
),
],
],
), ),
), ),
), if (data.recent.isNotEmpty)
child: RecentSearches( TextButton(
items: data.recent, style: TextButton.styleFrom(
onTap: (query) => visualDensity: VisualDensity.compact,
context.go('/?q=${Uri.encodeQueryComponent(query)}'), padding: const EdgeInsets.symmetric(
onDelete: (id) => ref horizontal: 10, vertical: 4),
.read(searchControllerProvider.notifier) minimumSize: Size.zero,
.deleteHistory(id), tapTargetSize: MaterialTapTargetSize.shrinkWrap,
),
onPressed: () {
HapticFeedback.selectionClick();
ref
.read(searchControllerProvider.notifier)
.clearHistory();
},
child: Text(
isRu ? 'Очистить' : 'Clear',
style: TextStyle(
color: theme.colorScheme.primary,
fontSize: 13,
fontWeight: FontWeight.w600,
),
),
),
],
),
const SizedBox(height: 14),
RecentSearches(
items: data.recent,
onTap: (query) =>
context.go('/?q=${Uri.encodeQueryComponent(query)}'),
onDelete: (id) => ref
.read(searchControllerProvider.notifier)
.deleteHistory(id),
),
],
), ),
), ),
const SizedBox(height: 16), const SizedBox(height: 16),
// 3. Explore Popular Categories & Tags // 3. Explore Popular Categories & Tags
_SearchSectionCard( _SearchLiquidCard(
icon: Icons.explore_rounded, glowColor: const Color(0xFF10B981),
accentColor: const Color(0xFF10B981),
title: isRu ? 'Популярные категории' : 'Explore categories',
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Row(
children: [
const _SearchIconBadge(
icon: Icons.explore_rounded,
color: Color(0xFF10B981),
),
const SizedBox(width: 12),
Expanded(
child: Text(
isRu ? 'Популярные категории' : 'Explore categories',
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w700,
fontSize: 15,
letterSpacing: -0.2,
),
),
),
],
),
const SizedBox(height: 16),
_CategoryTagRow( _CategoryTagRow(
categoryName: isRu ? 'Тематика' : 'Theme & Ambience', categoryName: isRu ? 'Тематика' : 'Theme & Ambience',
color: const Color(0xFF0EA5E9), color: const Color(0xFF0EA5E9),
@@ -234,7 +299,7 @@ class _SearchScreenState extends ConsumerState<SearchScreen> {
], ],
onTap: (tag) => _onTagTap(tag, data.query), onTap: (tag) => _onTagTap(tag, data.query),
), ),
const SizedBox(height: 14), const SizedBox(height: 16),
_CategoryTagRow( _CategoryTagRow(
categoryName: categoryName:
isRu ? 'Персонажи и детали' : 'Characters & Attire', isRu ? 'Персонажи и детали' : 'Characters & Attire',
@@ -250,7 +315,7 @@ class _SearchScreenState extends ConsumerState<SearchScreen> {
], ],
onTap: (tag) => _onTagTap(tag, data.query), onTap: (tag) => _onTagTap(tag, data.query),
), ),
const SizedBox(height: 14), const SizedBox(height: 16),
_CategoryTagRow( _CategoryTagRow(
categoryName: isRu ? 'Провайдеры' : 'Providers', categoryName: isRu ? 'Провайдеры' : 'Providers',
color: const Color(0xFF8B5CF6), color: const Color(0xFF8B5CF6),
@@ -268,84 +333,78 @@ class _SearchScreenState extends ConsumerState<SearchScreen> {
), ),
const SizedBox(height: 16), const SizedBox(height: 16),
// 4. Search Tips / Cheat Sheet Card // 4. Search Tips / Cheat Sheet Card (Full Liquid Glass Container)
Container( _SearchLiquidCard(
decoration: BoxDecoration( padding: EdgeInsets.zero,
color: theme.colorScheme.surfaceContainerLow, glowColor: const Color(0xFFF59E0B),
borderRadius: BorderRadius.circular(20), child: Theme(
border: Border.all( data: theme.copyWith(dividerColor: Colors.transparent),
color: theme.colorScheme.outlineVariant child: ExpansionTile(
.withValues(alpha: 0.3), shape: const Border(),
), collapsedShape: const Border(),
), tilePadding: const EdgeInsets.symmetric(
child: ExpansionTile( horizontal: 16, vertical: 4),
shape: const Border(), leading: const _SearchIconBadge(
collapsedShape: const Border(), icon: Icons.lightbulb_rounded,
leading: Container(
width: 32,
height: 32,
decoration: BoxDecoration(
color: const Color(0xFFF59E0B).withValues(alpha: 0.15),
borderRadius: BorderRadius.circular(10),
),
child: const Icon(
Icons.lightbulb_outline_rounded,
size: 18,
color: Color(0xFFF59E0B), color: Color(0xFFF59E0B),
), ),
), title: Text(
title: Text( isRu ? 'Шпаргалка по поиску' : 'Search tips & operators',
isRu ? 'Шпаргалка по поиску' : 'Search tips & operators', style: theme.textTheme.titleSmall?.copyWith(
style: theme.textTheme.titleSmall?.copyWith( fontWeight: FontWeight.w700,
fontWeight: FontWeight.w700, letterSpacing: -0.2,
),
),
initiallyExpanded: _showTips,
onExpansionChanged: (exp) => setState(() => _showTips = exp),
children: [
Padding(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_TipRow(
code: 'tag_a and tag_b',
description: isRu
? 'Независимый опрос обоих тегов с чередованием постов в ленте.'
: 'Interleaves results from both queries independently.',
),
const SizedBox(height: 8),
_TipRow(
code: 'type:video / type:gif',
description: isRu
? 'Показывает только видео или анимированные GIF.'
: 'Filters results to only videos or animated GIFs.',
),
const SizedBox(height: 8),
_TipRow(
code: 'rating:safe / rating:explicit',
description: isRu
? 'Фильтр по возрастному рейтингу медиа.'
: 'Filter by age rating classification.',
),
const SizedBox(height: 8),
_TipRow(
code: 'score:>50 / score:>100',
description: isRu
? 'Посты с оценкой пользователей выше указанной.'
: 'Posts with community score greater than threshold.',
),
const SizedBox(height: 8),
_TipRow(
code: 'provider:gelbooru',
description: isRu
? 'Поиск исключительно в указанном источнике.'
: 'Search specifically on the given booru provider.',
),
],
), ),
), ),
], initiallyExpanded: _showTips,
onExpansionChanged: (exp) {
HapticFeedback.selectionClick();
setState(() => _showTips = exp);
},
children: [
Padding(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_TipRow(
code: 'tag_a and tag_b',
description: isRu
? 'Независимый опрос обоих тегов с чередованием постов в ленте.'
: 'Interleaves results from both queries independently.',
),
const SizedBox(height: 8),
_TipRow(
code: 'type:video / type:gif',
description: isRu
? 'Показывает только видео или анимированные GIF.'
: 'Filters results to only videos or animated GIFs.',
),
const SizedBox(height: 8),
_TipRow(
code: 'rating:safe / rating:explicit',
description: isRu
? 'Фильтр по возрастному рейтингу медиа.'
: 'Filter by age rating classification.',
),
const SizedBox(height: 8),
_TipRow(
code: 'score:>50 / score:>100',
description: isRu
? 'Посты с оценкой пользователей выше указанной.'
: 'Posts with community score greater than threshold.',
),
const SizedBox(height: 8),
_TipRow(
code: 'provider:gelbooru',
description: isRu
? 'Поиск исключительно в указанном источнике.'
: 'Search specifically on the given booru provider.',
),
],
),
),
],
),
), ),
), ),
const SizedBox(height: 24), const SizedBox(height: 24),
@@ -358,93 +417,117 @@ class _SearchScreenState extends ConsumerState<SearchScreen> {
} }
} }
class _SearchSectionCard extends StatelessWidget { class _SearchLiquidCard extends StatelessWidget {
const _SearchSectionCard({ const _SearchLiquidCard({
required this.icon,
required this.accentColor,
required this.title,
required this.child, required this.child,
this.badgeCount, this.padding,
this.trailing, this.glowColor,
}); });
final IconData icon;
final Color accentColor;
final String title;
final Widget child; final Widget child;
final int? badgeCount; final EdgeInsetsGeometry? padding;
final Widget? trailing; final Color? glowColor;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context); final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
final accent = glowColor ?? theme.colorScheme.primary;
return Container( return Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: theme.colorScheme.surfaceContainerLow, borderRadius: BorderRadius.circular(24),
borderRadius: BorderRadius.circular(20), boxShadow: [
border: Border.all( BoxShadow(
color: theme.colorScheme.outlineVariant.withValues(alpha: 0.3), color: isDark
? Colors.black.withValues(alpha: 0.35)
: accent.withValues(alpha: 0.08),
blurRadius: 18,
offset: const Offset(0, 6),
spreadRadius: -2,
),
BoxShadow(
color: accent.withValues(alpha: isDark ? 0.06 : 0.03),
blurRadius: 10,
offset: const Offset(0, 2),
),
],
),
child: ClipRRect(
borderRadius: BorderRadius.circular(24),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 18, sigmaY: 18),
child: Container(
padding: padding ?? const EdgeInsets.all(16),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(24),
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: isDark
? [
theme.colorScheme.surfaceContainerHigh
.withValues(alpha: 0.60),
theme.colorScheme.surfaceContainerLow
.withValues(alpha: 0.38),
]
: [
Colors.white.withValues(alpha: 0.88),
Colors.white.withValues(alpha: 0.72),
],
),
border: Border.all(
color: isDark
? Colors.white.withValues(alpha: 0.14)
: Colors.white.withValues(alpha: 0.85),
width: 1.2,
),
),
child: child,
),
), ),
), ),
padding: const EdgeInsets.all(16), );
child: Column( }
crossAxisAlignment: CrossAxisAlignment.start, }
children: [
Row( class _SearchIconBadge extends StatelessWidget {
children: [ const _SearchIconBadge({
Container( required this.icon,
width: 32, required this.color,
height: 32, });
decoration: BoxDecoration(
color: accentColor.withValues(alpha: 0.14), final IconData icon;
borderRadius: BorderRadius.circular(10), final Color color;
),
child: Icon(icon, size: 18, color: accentColor), @override
), Widget build(BuildContext context) {
const SizedBox(width: 10), const size = 34.0;
Expanded( const iconSize = 18.0;
child: Row( return Container(
mainAxisSize: MainAxisSize.min, width: size,
children: [ height: size,
Flexible( decoration: BoxDecoration(
child: Text( gradient: LinearGradient(
title, begin: Alignment.topLeft,
maxLines: 1, end: Alignment.bottomRight,
overflow: TextOverflow.ellipsis, colors: [
style: theme.textTheme.titleMedium?.copyWith( color,
fontWeight: FontWeight.w700, color.withValues(alpha: 0.86),
fontSize: 15, ],
), ),
), borderRadius: BorderRadius.circular(size * 0.28),
), boxShadow: [
if (badgeCount != null && badgeCount! > 0) ...[ BoxShadow(
const SizedBox(width: 8), color: color.withValues(alpha: 0.35),
Container( blurRadius: 7,
padding: const EdgeInsets.symmetric( offset: const Offset(0, 2.5),
horizontal: 7, vertical: 2),
decoration: BoxDecoration(
color: accentColor.withValues(alpha: 0.15),
borderRadius: BorderRadius.circular(10),
),
child: Text(
'$badgeCount',
style: theme.textTheme.labelSmall?.copyWith(
fontWeight: FontWeight.bold,
color: accentColor,
),
),
),
],
],
),
),
if (trailing != null) trailing!,
],
), ),
const SizedBox(height: 14),
child,
], ],
), ),
child: Center(
child: Icon(icon, size: iconSize, color: Colors.white),
),
); );
} }
} }
@@ -465,19 +548,33 @@ class _QuickOperatorChip extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context); final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
return Material( return Material(
color: color.withValues(alpha: 0.12), color: Colors.transparent,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(14),
child: InkWell( child: InkWell(
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(14),
onTap: onTap, onTap: () {
HapticFeedback.selectionClick();
onTap();
},
child: Container( child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6), padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12), color: color.withValues(alpha: isDark ? 0.16 : 0.10),
borderRadius: BorderRadius.circular(14),
border: Border.all( border: Border.all(
color: color.withValues(alpha: 0.35), color: color.withValues(alpha: isDark ? 0.40 : 0.32),
width: 1.1,
), ),
boxShadow: [
BoxShadow(
color: color.withValues(alpha: isDark ? 0.14 : 0.06),
blurRadius: 6,
offset: const Offset(0, 1.5),
),
],
), ),
child: Row( child: Row(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
@@ -490,6 +587,7 @@ class _QuickOperatorChip extends StatelessWidget {
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: color, color: color,
fontFamily: 'monospace', fontFamily: 'monospace',
letterSpacing: -0.2,
), ),
), ),
], ],
@@ -516,44 +614,76 @@ class _CategoryTagRow extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context); final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
return Column( return Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text( Row(
categoryName, children: [
style: theme.textTheme.labelLarge?.copyWith( Container(
fontWeight: FontWeight.w600, width: 7,
color: theme.colorScheme.onSurfaceVariant, height: 7,
), decoration: BoxDecoration(
color: color,
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: color.withValues(alpha: 0.6),
blurRadius: 4,
),
],
),
),
const SizedBox(width: 8),
Text(
categoryName,
style: theme.textTheme.labelLarge?.copyWith(
fontWeight: FontWeight.w700,
color: theme.colorScheme.onSurface,
letterSpacing: -0.2,
),
),
],
), ),
const SizedBox(height: 8), const SizedBox(height: 10),
Wrap( Wrap(
spacing: 8, spacing: 8,
runSpacing: 8, runSpacing: 8,
children: [ children: [
for (final tag in tags) for (final tag in tags)
Material( Material(
color: theme.colorScheme.surfaceContainer, color: Colors.transparent,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(14),
child: InkWell( child: InkWell(
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(14),
onTap: () => onTap(tag), onTap: () {
HapticFeedback.selectionClick();
onTap(tag);
},
child: Container( child: Container(
padding: const EdgeInsets.symmetric( padding: const EdgeInsets.symmetric(
horizontal: 10, vertical: 5), horizontal: 11, vertical: 6),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12), color: isDark
? theme.colorScheme.surfaceContainerHighest
.withValues(alpha: 0.45)
: Colors.white.withValues(alpha: 0.60),
borderRadius: BorderRadius.circular(14),
border: Border.all( border: Border.all(
color: theme.colorScheme.outlineVariant color: isDark
.withValues(alpha: 0.3), ? Colors.white.withValues(alpha: 0.10)
: theme.colorScheme.outlineVariant
.withValues(alpha: 0.35),
width: 1.0,
), ),
), ),
child: Row( child: Row(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
Container( Container(
width: 6, width: 5,
height: 6, height: 5,
decoration: BoxDecoration( decoration: BoxDecoration(
color: color, color: color,
shape: BoxShape.circle, shape: BoxShape.circle,
@@ -563,7 +693,8 @@ class _CategoryTagRow extends StatelessWidget {
Text( Text(
tag, tag,
style: theme.textTheme.bodySmall?.copyWith( style: theme.textTheme.bodySmall?.copyWith(
fontWeight: FontWeight.w500, fontWeight: FontWeight.w600,
letterSpacing: -0.1,
), ),
), ),
], ],
@@ -587,14 +718,23 @@ class _TipRow extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context); final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
return Row( return Row(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Container( Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2), padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
decoration: BoxDecoration( decoration: BoxDecoration(
color: theme.colorScheme.surfaceContainerHighest, color: isDark
borderRadius: BorderRadius.circular(6), ? theme.colorScheme.surfaceContainerHighest.withValues(alpha: 0.6)
: theme.colorScheme.surfaceContainerHighest.withValues(alpha: 0.8),
borderRadius: BorderRadius.circular(8),
border: Border.all(
color: isDark
? Colors.white.withValues(alpha: 0.08)
: theme.colorScheme.outlineVariant.withValues(alpha: 0.25),
),
), ),
child: Text( child: Text(
code, code,
@@ -608,10 +748,14 @@ class _TipRow extends StatelessWidget {
), ),
const SizedBox(width: 10), const SizedBox(width: 10),
Expanded( Expanded(
child: Text( child: Padding(
description, padding: const EdgeInsets.only(top: 2),
style: theme.textTheme.bodySmall?.copyWith( child: Text(
color: theme.colorScheme.onSurfaceVariant, description,
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
height: 1.35,
),
), ),
), ),
), ),
@@ -1,4 +1,5 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import '../../../../backend/backend.dart'; import '../../../../backend/backend.dart';
@@ -95,20 +96,40 @@ class _RecentSearchesState extends State<RecentSearches> {
children: [ children: [
for (final item in visibleItems) for (final item in visibleItems)
Material( Material(
color: theme.colorScheme.surfaceContainer, color: Colors.transparent,
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.circular(16),
child: InkWell( child: InkWell(
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.circular(16),
onTap: () => widget.onTap(item.query), onTap: () {
HapticFeedback.selectionClick();
widget.onTap(item.query);
},
child: Container( child: Container(
padding: padding:
const EdgeInsets.only(left: 10, right: 6, top: 6, bottom: 6), const EdgeInsets.only(left: 10, right: 6, top: 6, bottom: 6),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Theme.of(context).brightness == Brightness.dark
? theme.colorScheme.surfaceContainerHighest
.withValues(alpha: 0.45)
: Colors.white.withValues(alpha: 0.65),
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.circular(16),
border: Border.all( border: Border.all(
color: theme.colorScheme.outlineVariant color: Theme.of(context).brightness == Brightness.dark
.withValues(alpha: 0.35), ? Colors.white.withValues(alpha: 0.12)
: theme.colorScheme.outlineVariant
.withValues(alpha: 0.35),
width: 1.0,
), ),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(
alpha: Theme.of(context).brightness == Brightness.dark
? 0.15
: 0.04),
blurRadius: 6,
offset: const Offset(0, 1.5),
),
],
), ),
child: Row( child: Row(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
@@ -140,7 +161,7 @@ class _RecentSearchesState extends State<RecentSearches> {
padding: const EdgeInsets.symmetric( padding: const EdgeInsets.symmetric(
horizontal: 6, vertical: 2), horizontal: 6, vertical: 2),
decoration: BoxDecoration( decoration: BoxDecoration(
color: theme.colorScheme.primary.withValues(alpha: 0.12), color: theme.colorScheme.primary.withValues(alpha: 0.14),
borderRadius: BorderRadius.circular(8), borderRadius: BorderRadius.circular(8),
), ),
child: Text( child: Text(
@@ -161,7 +182,10 @@ class _RecentSearchesState extends State<RecentSearches> {
clipBehavior: Clip.antiAlias, clipBehavior: Clip.antiAlias,
child: InkWell( child: InkWell(
customBorder: const CircleBorder(), customBorder: const CircleBorder(),
onTap: () => widget.onDelete!(item.id), onTap: () {
HapticFeedback.lightImpact();
widget.onDelete!(item.id);
},
child: Padding( child: Padding(
padding: const EdgeInsets.all(4), padding: const EdgeInsets.all(4),
child: Icon( child: Icon(
@@ -976,191 +976,275 @@ class _SettingsContentState extends ConsumerState<_SettingsContent> {
final isRu = settings.languageCode == 'ru'; final isRu = settings.languageCode == 'ru';
final theme = Theme.of(context); final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
final selectedSource = await showModalBottomSheet<UpdateSource>( final selectedSource = await showModalBottomSheet<UpdateSource>(
context: context, context: context,
useRootNavigator: true,
isScrollControlled: true,
backgroundColor: Colors.transparent, backgroundColor: Colors.transparent,
builder: (sheetContext) { builder: (sheetContext) {
return Container( return ClipRRect(
decoration: BoxDecoration( borderRadius: const BorderRadius.vertical(top: Radius.circular(28)),
color: theme.colorScheme.surface, child: BackdropFilter(
borderRadius: const BorderRadius.vertical(top: Radius.circular(28)), filter: ImageFilter.blur(sigmaX: 24, sigmaY: 24),
), child: Container(
padding: const EdgeInsets.fromLTRB(20, 12, 20, 28), decoration: BoxDecoration(
child: Column( color: isDark
mainAxisSize: MainAxisSize.min, ? theme.colorScheme.surface.withValues(alpha: 0.88)
crossAxisAlignment: CrossAxisAlignment.stretch, : Colors.white.withValues(alpha: 0.94),
children: [ borderRadius: const BorderRadius.vertical(top: Radius.circular(28)),
Center( border: Border(
child: Container( top: BorderSide(
width: 36, color: isDark
height: 4, ? Colors.white.withValues(alpha: 0.18)
margin: const EdgeInsets.only(bottom: 16), : Colors.white.withValues(alpha: 0.85),
decoration: BoxDecoration( width: 1.2,
color: theme.colorScheme.onSurfaceVariant.withValues(alpha: 0.3),
borderRadius: BorderRadius.circular(2),
), ),
), ),
), ),
Text( child: SafeArea(
isRu ? 'Источник обновлений' : 'Update Source', top: false,
style: theme.textTheme.titleMedium?.copyWith( child: Padding(
fontWeight: FontWeight.bold, padding: EdgeInsets.fromLTRB(
), 20,
textAlign: TextAlign.center, 14,
), 20,
const SizedBox(height: 6), 24 + MediaQuery.paddingOf(sheetContext).bottom,
Text( ),
isRu child: Column(
? 'Выберите сервер для загрузки обновлений' mainAxisSize: MainAxisSize.min,
: 'Choose a server to download updates from', crossAxisAlignment: CrossAxisAlignment.stretch,
style: theme.textTheme.bodySmall?.copyWith( children: [
color: theme.colorScheme.onSurfaceVariant, Center(
), child: Container(
textAlign: TextAlign.center, width: 38,
), height: 4.5,
const SizedBox(height: 20), margin: const EdgeInsets.only(bottom: 16),
// Option 1: GitHub (Recommended for speed)
Material(
color: theme.colorScheme.primaryContainer.withValues(alpha: 0.35),
borderRadius: BorderRadius.circular(16),
child: InkWell(
borderRadius: BorderRadius.circular(16),
onTap: () => Navigator.pop(sheetContext, UpdateSource.github),
child: Padding(
padding: const EdgeInsets.all(16),
child: Row(
children: [
Container(
width: 44,
height: 44,
decoration: BoxDecoration( decoration: BoxDecoration(
color: theme.colorScheme.primary.withValues(alpha: 0.15), color: theme.colorScheme.onSurfaceVariant.withValues(alpha: 0.35),
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(3),
),
child: Icon(
Icons.bolt_rounded,
color: theme.colorScheme.primary,
size: 24,
), ),
), ),
const SizedBox(width: 14), ),
Expanded( Text(
child: Column( isRu ? 'Источник обновлений' : 'Update Source',
crossAxisAlignment: CrossAxisAlignment.start, style: theme.textTheme.titleMedium?.copyWith(
children: [ fontWeight: FontWeight.w800,
Row( letterSpacing: -0.3,
children: [
Text(
'GitHub',
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(width: 8),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 6,
vertical: 2,
),
decoration: BoxDecoration(
color: Colors.green.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(6),
),
child: Text(
isRu ? 'Рекомендуется для скорости' : 'Recommended for speed',
style: const TextStyle(
fontSize: 10,
fontWeight: FontWeight.bold,
color: Colors.green,
),
),
),
],
),
const SizedBox(height: 3),
Text(
isRu
? 'Прямая быстрая загрузка без ограничений'
: 'Direct fast download without limits',
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
),
),
],
),
), ),
Icon( textAlign: TextAlign.center,
Icons.arrow_forward_ios_rounded, ),
size: 14, const SizedBox(height: 6),
Text(
isRu
? 'Выберите сервер для быстрой загрузки новой версии'
: 'Choose a server to download updates from',
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant, color: theme.colorScheme.onSurfaceVariant,
), ),
], textAlign: TextAlign.center,
), ),
), const SizedBox(height: 20),
),
),
const SizedBox(height: 12),
// Option 2: Gitea (Muted / neutral grey) // Option 1: GitHub (Recommended for speed)
Material( Material(
color: theme.colorScheme.surfaceContainerHighest.withValues(alpha: 0.25), color: isDark
borderRadius: BorderRadius.circular(16), ? theme.colorScheme.primaryContainer.withValues(alpha: 0.35)
child: InkWell( : theme.colorScheme.primary.withValues(alpha: 0.08),
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.circular(18),
onTap: () => Navigator.pop(sheetContext, UpdateSource.gitea), child: InkWell(
child: Padding( borderRadius: BorderRadius.circular(18),
padding: const EdgeInsets.all(16), onTap: () {
child: Row( HapticFeedback.selectionClick();
children: [ Navigator.pop(sheetContext, UpdateSource.github);
Container( },
width: 44, child: Container(
height: 44, padding: const EdgeInsets.all(16),
decoration: BoxDecoration( decoration: BoxDecoration(
color: theme.colorScheme.onSurface.withValues(alpha: 0.08), borderRadius: BorderRadius.circular(18),
borderRadius: BorderRadius.circular(12), border: Border.all(
), color: isDark
child: Icon( ? Colors.white.withValues(alpha: 0.15)
Icons.dns_rounded, : theme.colorScheme.primary.withValues(alpha: 0.35),
color: theme.colorScheme.onSurfaceVariant, width: 1.2,
size: 22, ),
), ),
), child: Row(
const SizedBox(width: 14), children: [
Expanded( Container(
child: Column( width: 44,
crossAxisAlignment: CrossAxisAlignment.start, height: 44,
children: [ decoration: BoxDecoration(
Text( gradient: const LinearGradient(
'Gitea', colors: [Color(0xFF6366F1), Color(0xFF4F46E5)],
style: theme.textTheme.titleSmall?.copyWith( begin: Alignment.topLeft,
fontWeight: FontWeight.w600, end: Alignment.bottomRight,
),
borderRadius: BorderRadius.circular(13),
boxShadow: [
BoxShadow(
color: const Color(0xFF6366F1).withValues(alpha: 0.40),
blurRadius: 10,
offset: const Offset(0, 3),
),
],
),
child: const Center(
child: Icon(
Icons.bolt_rounded,
color: Colors.white,
size: 24,
),
),
),
const SizedBox(width: 14),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Text(
'GitHub',
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(width: 8),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 7,
vertical: 2.5,
),
decoration: BoxDecoration(
color: Colors.green.withValues(alpha: 0.20),
borderRadius: BorderRadius.circular(6),
),
child: Text(
isRu ? 'Рекомендуется' : 'Recommended',
style: const TextStyle(
fontSize: 10.5,
fontWeight: FontWeight.w700,
color: Colors.green,
),
),
),
],
),
const SizedBox(height: 3),
Text(
isRu
? 'Прямая быстрая загрузка релизов без задержек'
: 'Direct fast download without limits',
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
),
),
],
),
),
Icon(
Icons.arrow_forward_ios_rounded,
size: 15,
color: theme.colorScheme.onSurfaceVariant, color: theme.colorScheme.onSurfaceVariant,
), ),
), ],
const SizedBox(height: 3), ),
Text(
isRu
? 'Сервер релизов'
: 'Release server',
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant.withValues(alpha: 0.7),
),
),
],
), ),
), ),
Icon( ),
Icons.arrow_forward_ios_rounded, const SizedBox(height: 12),
size: 14,
color: theme.colorScheme.onSurfaceVariant.withValues(alpha: 0.5), // Option 2: Gitea
Material(
color: isDark
? theme.colorScheme.surfaceContainerHighest.withValues(alpha: 0.35)
: theme.colorScheme.surfaceContainerHighest.withValues(alpha: 0.40),
borderRadius: BorderRadius.circular(18),
child: InkWell(
borderRadius: BorderRadius.circular(18),
onTap: () {
HapticFeedback.selectionClick();
Navigator.pop(sheetContext, UpdateSource.gitea);
},
child: Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(18),
border: Border.all(
color: isDark
? Colors.white.withValues(alpha: 0.12)
: theme.colorScheme.outlineVariant.withValues(alpha: 0.35),
width: 1.2,
),
),
child: Row(
children: [
Container(
width: 44,
height: 44,
decoration: BoxDecoration(
gradient: const LinearGradient(
colors: [Color(0xFF0EA5E9), Color(0xFF0284C7)],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
borderRadius: BorderRadius.circular(13),
boxShadow: [
BoxShadow(
color: const Color(0xFF0EA5E9).withValues(alpha: 0.35),
blurRadius: 10,
offset: const Offset(0, 3),
),
],
),
child: const Center(
child: Icon(
Icons.dns_rounded,
color: Colors.white,
size: 22,
),
),
),
const SizedBox(width: 14),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Gitea (Synapse)',
style: theme.textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: 3),
Text(
isRu
? 'Альтернативный независимый сервер релизов'
: 'Alternative independent release mirror',
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
),
),
],
),
),
Icon(
Icons.arrow_forward_ios_rounded,
size: 15,
color: theme.colorScheme.onSurfaceVariant,
),
],
),
),
), ),
], ),
), ],
), ),
), ),
), ),
], ),
), ),
); );
}, },
@@ -1,5 +1,8 @@
import 'dart:ui';
import 'package:cached_network_image/cached_network_image.dart'; import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart'; import 'package:go_router/go_router.dart';
@@ -156,28 +159,56 @@ class _ViewedScreenState extends ConsumerState<ViewedScreen> {
); );
} }
final bottomInset = MediaQuery.paddingOf(context).bottom;
return RefreshIndicator( return RefreshIndicator(
onRefresh: () => onRefresh: () =>
ref.read(viewedControllerProvider.notifier).refresh(), ref.read(viewedControllerProvider.notifier).refresh(),
child: ListView( child: ListView(
padding: const EdgeInsets.fromLTRB(16, 8, 16, 24), padding: EdgeInsets.fromLTRB(16, 8, 16, 140 + bottomInset),
children: [ children: [
for (final group in groups) ...[ for (final group in groups) ...[
Padding( Padding(
padding: const EdgeInsets.fromLTRB(4, 16, 4, 10), padding: const EdgeInsets.fromLTRB(2, 16, 2, 10),
child: Row( child: Row(
children: [ children: [
Icon( Container(
Icons.calendar_today_rounded, width: 28,
size: 16, height: 28,
color: Theme.of(context).colorScheme.primary, decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Theme.of(context).colorScheme.primary,
Theme.of(context).colorScheme.primary.withValues(alpha: 0.82),
],
),
borderRadius: BorderRadius.circular(9),
boxShadow: [
BoxShadow(
color: Theme.of(context)
.colorScheme
.primary
.withValues(alpha: 0.32),
blurRadius: 6,
offset: const Offset(0, 2),
),
],
),
child: const Center(
child: Icon(
Icons.calendar_today_rounded,
size: 14,
color: Colors.white,
),
),
), ),
const SizedBox(width: 8), const SizedBox(width: 10),
Text( Text(
_localizedGroupLabel(group.label, isRu), _localizedGroupLabel(group.label, isRu),
style: style:
Theme.of(context).textTheme.titleSmall?.copyWith( Theme.of(context).textTheme.titleSmall?.copyWith(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
letterSpacing: -0.2,
), ),
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
@@ -187,10 +218,24 @@ class _ViewedScreenState extends ConsumerState<ViewedScreen> {
vertical: 2, vertical: 2,
), ),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Theme.of(context) color: Theme.of(context).brightness == Brightness.dark
.colorScheme ? Theme.of(context)
.surfaceContainerHighest, .colorScheme
.surfaceContainerHighest
.withValues(alpha: 0.5)
: Theme.of(context)
.colorScheme
.primary
.withValues(alpha: 0.12),
borderRadius: BorderRadius.circular(10), borderRadius: BorderRadius.circular(10),
border: Border.all(
color: Theme.of(context).brightness == Brightness.dark
? Colors.white.withValues(alpha: 0.08)
: Theme.of(context)
.colorScheme
.primary
.withValues(alpha: 0.20),
),
), ),
child: Text( child: Text(
'${group.items.length}', '${group.items.length}',
@@ -198,7 +243,10 @@ class _ViewedScreenState extends ConsumerState<ViewedScreen> {
.textTheme .textTheme
.labelSmall .labelSmall
?.copyWith( ?.copyWith(
fontWeight: FontWeight.w600, fontWeight: FontWeight.w700,
color: Theme.of(context).brightness == Brightness.dark
? Theme.of(context).colorScheme.onSurfaceVariant
: Theme.of(context).colorScheme.primary,
), ),
), ),
), ),
@@ -299,184 +347,251 @@ class _ViewedPostTile extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final scheme = Theme.of(context).colorScheme; final scheme = Theme.of(context).colorScheme;
final isDark = Theme.of(context).brightness == Brightness.dark;
final image = MediaUrlSelector.preview(post).firstOrNull; final image = MediaUrlSelector.preview(post).firstOrNull;
final timeStr = final timeStr =
'${viewedAt.hour.toString().padLeft(2, '0')}:${viewedAt.minute.toString().padLeft(2, '0')}'; '${viewedAt.hour.toString().padLeft(2, '0')}:${viewedAt.minute.toString().padLeft(2, '0')}';
return Card( return Container(
elevation: 0, margin: const EdgeInsets.only(bottom: 10),
color: scheme.surfaceContainerLow, decoration: BoxDecoration(
margin: const EdgeInsets.only(bottom: 8), borderRadius: BorderRadius.circular(20),
shape: RoundedRectangleBorder( boxShadow: [
borderRadius: BorderRadius.circular(16), BoxShadow(
side: BorderSide( color: Colors.black.withValues(alpha: isDark ? 0.28 : 0.05),
color: scheme.outlineVariant.withValues(alpha: 0.3), blurRadius: 14,
), offset: const Offset(0, 4),
spreadRadius: -2,
),
],
), ),
clipBehavior: Clip.antiAlias, child: ClipRRect(
child: InkWell( borderRadius: BorderRadius.circular(20),
onTap: onOpen, child: BackdropFilter(
child: Padding( filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
padding: const EdgeInsets.all(10), child: Material(
child: Row( color: Colors.transparent,
children: [ child: InkWell(
// Squircle Thumbnail borderRadius: BorderRadius.circular(20),
ClipRRect( onTap: () {
borderRadius: BorderRadius.circular(12), HapticFeedback.selectionClick();
child: SizedBox( onOpen();
width: 68, },
height: 68, child: Container(
child: Stack( padding: const EdgeInsets.all(10),
fit: StackFit.expand, decoration: BoxDecoration(
children: [ borderRadius: BorderRadius.circular(20),
image == null gradient: LinearGradient(
? Container( begin: Alignment.topLeft,
color: scheme.surfaceContainerHighest, end: Alignment.bottomRight,
child: const Icon(Icons.image_not_supported_rounded), colors: isDark
) ? [
: CachedNetworkImage( scheme.surfaceContainerHigh
imageUrl: image, .withValues(alpha: 0.58),
fit: BoxFit.cover, scheme.surfaceContainerLow
placeholder: (_, __) => Container( .withValues(alpha: 0.36),
color: scheme.surfaceContainerHighest, ]
), : [
errorWidget: (_, __, ___) => Container( Colors.white.withValues(alpha: 0.88),
color: scheme.surfaceContainerHighest, Colors.white.withValues(alpha: 0.72),
child: const Icon( ],
Icons.broken_image_rounded, ),
size: 20, border: Border.all(
), color: isDark
), ? Colors.white.withValues(alpha: 0.13)
), : Colors.white.withValues(alpha: 0.85),
if (_isVideo) width: 1.1,
Positioned(
right: 4,
bottom: 4,
child: Container(
padding: const EdgeInsets.all(3),
decoration: BoxDecoration(
color: Colors.black.withValues(alpha: 0.65),
borderRadius: BorderRadius.circular(4),
),
child: const Icon(
Icons.play_arrow_rounded,
size: 14,
color: Colors.white,
),
),
),
],
), ),
), ),
), child: Row(
const SizedBox(width: 12),
// Post details
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Row( // Squircle Thumbnail
children: [ ClipRRect(
Flexible( borderRadius: BorderRadius.circular(13),
child: Container( child: Container(
padding: const EdgeInsets.symmetric( width: 68,
horizontal: 6, height: 68,
vertical: 2, decoration: BoxDecoration(
), border: Border.all(
decoration: BoxDecoration( color: isDark
color: ? Colors.white.withValues(alpha: 0.10)
scheme.primaryContainer.withValues(alpha: 0.5), : scheme.outlineVariant.withValues(alpha: 0.30),
borderRadius: BorderRadius.circular(6), ),
), borderRadius: BorderRadius.circular(13),
child: Text( ),
post.providerName, child: Stack(
maxLines: 1, fit: StackFit.expand,
overflow: TextOverflow.ellipsis, children: [
style: Theme.of(context) image == null
.textTheme ? Container(
.labelSmall color: scheme.surfaceContainerHighest,
?.copyWith( child: const Icon(
fontWeight: FontWeight.w600, Icons.image_not_supported_rounded),
color: scheme.onPrimaryContainer, )
: CachedNetworkImage(
imageUrl: image,
fit: BoxFit.cover,
placeholder: (_, __) => Container(
color: scheme.surfaceContainerHighest,
),
errorWidget: (_, __, ___) => Container(
color: scheme.surfaceContainerHighest,
child: const Icon(
Icons.broken_image_rounded,
size: 20,
),
),
), ),
), if (_isVideo)
), Positioned(
), right: 4,
const SizedBox(width: 6), bottom: 4,
Text( child: Container(
timeStr, padding: const EdgeInsets.all(3),
style: Theme.of(context) decoration: BoxDecoration(
.textTheme color: Colors.black.withValues(alpha: 0.65),
.labelSmall borderRadius: BorderRadius.circular(5),
?.copyWith( ),
color: scheme.onSurfaceVariant, child: const Icon(
Icons.play_arrow_rounded,
size: 14,
color: Colors.white,
),
),
), ),
],
), ),
], ),
), ),
const SizedBox(height: 4), const SizedBox(width: 12),
Text( // Post details
post.tags.isEmpty ? '#${post.id}' : post.tags.take(4).join(' '), Expanded(
maxLines: 1, child: Column(
overflow: TextOverflow.ellipsis, crossAxisAlignment: CrossAxisAlignment.start,
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
fontWeight: FontWeight.w500,
),
),
if (post.score != 0) ...[
const SizedBox(height: 2),
Row(
children: [ children: [
Icon( Row(
Icons.thumb_up_rounded, children: [
size: 12, Flexible(
color: scheme.outline, child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 7,
vertical: 2,
),
decoration: BoxDecoration(
color: scheme.primary
.withValues(alpha: isDark ? 0.20 : 0.12),
borderRadius: BorderRadius.circular(6),
border: Border.all(
color: scheme.primary.withValues(
alpha: isDark ? 0.30 : 0.20),
),
),
child: Text(
post.providerName,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: Theme.of(context)
.textTheme
.labelSmall
?.copyWith(
fontWeight: FontWeight.w700,
color: scheme.primary,
),
),
),
),
const SizedBox(width: 6),
Text(
timeStr,
style: Theme.of(context)
.textTheme
.labelSmall
?.copyWith(
color: scheme.onSurfaceVariant,
fontWeight: FontWeight.w500,
),
),
],
), ),
const SizedBox(width: 4), const SizedBox(height: 4),
Text( Text(
'${post.score}', post.tags.isEmpty ? '#${post.id}' : post.tags.take(4).join(' '),
style: Theme.of(context) maxLines: 1,
.textTheme overflow: TextOverflow.ellipsis,
.labelSmall style: Theme.of(context).textTheme.bodyMedium?.copyWith(
?.copyWith( fontWeight: FontWeight.w600,
color: scheme.outline, letterSpacing: -0.1,
), ),
), ),
if (post.score != 0) ...[
const SizedBox(height: 2),
Row(
children: [
Icon(
Icons.thumb_up_rounded,
size: 12,
color: scheme.outline,
),
const SizedBox(width: 4),
Text(
'${post.score}',
style: Theme.of(context)
.textTheme
.labelSmall
?.copyWith(
color: scheme.outline,
fontWeight: FontWeight.w600,
),
),
],
),
],
], ],
), ),
], ),
// Action buttons
IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints:
const BoxConstraints(minWidth: 36, minHeight: 36),
tooltip: isFavorite
? (isRu ? 'В избранном' : 'In favorites')
: (isRu ? 'В избранное' : 'Add to favorites'),
onPressed: () {
HapticFeedback.selectionClick();
onFavorite();
},
icon: Icon(
isFavorite
? Icons.favorite_rounded
: Icons.favorite_border_rounded,
color: isFavorite
? Colors.redAccent
: scheme.onSurfaceVariant,
),
),
IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints:
const BoxConstraints(minWidth: 36, minHeight: 36),
tooltip:
isRu ? 'Удалить из истории' : 'Delete from history',
onPressed: () {
HapticFeedback.lightImpact();
onDelete();
},
icon: Icon(
Icons.close_rounded,
size: 20,
color: scheme.onSurfaceVariant.withValues(alpha: 0.6),
),
),
], ],
), ),
), ),
// Action buttons ),
IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(minWidth: 36, minHeight: 36),
tooltip: isFavorite
? (isRu ? 'В избранном' : 'In favorites')
: (isRu ? 'В избранное' : 'Add to favorites'),
onPressed: onFavorite,
icon: Icon(
isFavorite
? Icons.favorite_rounded
: Icons.favorite_border_rounded,
color: isFavorite ? Colors.redAccent : scheme.onSurfaceVariant,
),
),
IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(minWidth: 36, minHeight: 36),
tooltip: isRu ? 'Удалить из истории' : 'Delete from history',
onPressed: onDelete,
icon: Icon(
Icons.close_rounded,
size: 20,
color: scheme.onSurfaceVariant.withValues(alpha: 0.6),
),
),
],
), ),
), ),
), ),
+10 -1
View File
@@ -28,6 +28,7 @@ class PostMasonryGrid extends StatelessWidget {
this.loading = false, this.loading = false,
this.controller, this.controller,
this.gridMode = 'masonry', this.gridMode = 'masonry',
this.padding,
super.key, super.key,
}); });
@@ -51,11 +52,19 @@ class PostMasonryGrid extends StatelessWidget {
final bool loading; final bool loading;
final ScrollController? controller; final ScrollController? controller;
final String gridMode; final String gridMode;
final EdgeInsetsGeometry? padding;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final mobile = Responsive.isMobile(context); final mobile = Responsive.isMobile(context);
final pad = EdgeInsets.all(mobile ? 8 : 16); final bottomInset = MediaQuery.paddingOf(context).bottom;
final pad = padding ??
EdgeInsets.fromLTRB(
mobile ? 8 : 16,
mobile ? 8 : 16,
mobile ? 8 : 16,
(mobile ? 8 : 16) + (mobile ? (120.0 + bottomInset) : 0.0),
);
final spacing = mobile ? 8.0 : 12.0; final spacing = mobile ? 8.0 : 12.0;
Widget buildCard(Post post) { Widget buildCard(Post post) {
+1 -1
View File
@@ -1,7 +1,7 @@
name: gel_rule_app name: gel_rule_app
description: Local backend/core layer for a Flutter booru browser app. description: Local backend/core layer for a Flutter booru browser app.
publish_to: "none" publish_to: "none"
version: 3.0.9+60 version: 3.1.0+61
environment: environment:
sdk: ">=3.3.0 <4.0.0" sdk: ">=3.3.0 <4.0.0"