chore: Polish chat bubble colors

This commit is contained in:
krille-chan 2024-11-03 08:59:05 +01:00
commit 45299a741f
No known key found for this signature in database
4 changed files with 55 additions and 33 deletions

View file

@ -142,8 +142,7 @@ class ChatEventList extends StatelessWidget {
i > 0 && controller.readMarkerEventId == event.eventId, i > 0 && controller.readMarkerEventId == event.eventId,
nextEvent: i + 1 < events.length ? events[i + 1] : null, nextEvent: i + 1 < events.length ? events[i + 1] : null,
previousEvent: i > 0 ? events[i - 1] : null, previousEvent: i > 0 ? events[i - 1] : null,
avatarPresenceBackgroundColor: wallpaperMode: hasWallpaper,
hasWallpaper ? Colors.transparent : null,
), ),
); );
}, },

View file

@ -317,7 +317,9 @@ class ChatView extends StatelessWidget {
alignment: Alignment.center, alignment: Alignment.center,
child: Material( child: Material(
clipBehavior: Clip.hardEdge, clipBehavior: Clip.hardEdge,
color: theme.colorScheme.surfaceContainerHigh, color: accountConfig.wallpaperUrl != null
? theme.colorScheme.surfaceBright
: theme.colorScheme.surfaceContainerHigh,
borderRadius: const BorderRadius.all( borderRadius: const BorderRadius.all(
Radius.circular(24), Radius.circular(24),
), ),

View file

@ -34,7 +34,7 @@ class Message extends StatelessWidget {
final bool highlightMarker; final bool highlightMarker;
final bool animateIn; final bool animateIn;
final void Function()? resetAnimateIn; final void Function()? resetAnimateIn;
final Color? avatarPresenceBackgroundColor; final bool wallpaperMode;
const Message( const Message(
this.event, { this.event, {
@ -52,7 +52,7 @@ class Message extends StatelessWidget {
this.highlightMarker = false, this.highlightMarker = false,
this.animateIn = false, this.animateIn = false,
this.resetAnimateIn, this.resetAnimateIn,
this.avatarPresenceBackgroundColor, this.wallpaperMode = false,
super.key, super.key,
}); });
@ -84,7 +84,9 @@ class Message extends StatelessWidget {
final ownMessage = event.senderId == client.userID; final ownMessage = event.senderId == client.userID;
final alignment = ownMessage ? Alignment.topRight : Alignment.topLeft; final alignment = ownMessage ? Alignment.topRight : Alignment.topLeft;
var color = theme.colorScheme.surfaceContainerHigh; var color = wallpaperMode
? theme.colorScheme.surfaceBright
: theme.colorScheme.surfaceContainerHigh;
final displayTime = event.type == EventTypes.RoomCreate || final displayTime = event.type == EventTypes.RoomCreate ||
nextEvent == null || nextEvent == null ||
!event.originServerTs.sameEnvironment(nextEvent!.originServerTs); !event.originServerTs.sameEnvironment(nextEvent!.originServerTs);
@ -230,7 +232,7 @@ class Message extends StatelessWidget {
name: user.calcDisplayname(), name: user.calcDisplayname(),
presenceUserId: user.stateKey, presenceUserId: user.stateKey,
presenceBackgroundColor: presenceBackgroundColor:
avatarPresenceBackgroundColor, wallpaperMode ? Colors.transparent : null,
onTap: () => onAvatarTab(event), onTap: () => onAvatarTab(event),
); );
}, },
@ -265,23 +267,20 @@ class Message extends StatelessWidget {
? displayname.color ? displayname.color
: displayname : displayname
.lightColorText), .lightColorText),
shadows: shadows: !wallpaperMode
avatarPresenceBackgroundColor == ? null
null : [
? null Shadow(
: [ offset: const Offset(
Shadow( 0.0,
offset: 0.0,
const Offset( ),
0.0, blurRadius: 5,
0.0, color: theme
), .colorScheme
blurRadius: 5, .surface,
color: theme ),
.colorScheme ],
.surface,
),
],
), ),
maxLines: 1, maxLines: 1,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
@ -309,13 +308,26 @@ class Message extends StatelessWidget {
: 1, : 1,
duration: FluffyThemes.animationDuration, duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve, curve: FluffyThemes.animationCurve,
child: Material( child: Container(
color: decoration: BoxDecoration(
noBubble ? Colors.transparent : color, color: ownMessage
clipBehavior: Clip.antiAlias, ? null
shape: RoundedRectangleBorder( : noBubble
? Colors.transparent
: color,
borderRadius: borderRadius, borderRadius: borderRadius,
gradient: ownMessage && !noBubble
? LinearGradient(
colors: [
theme.colorScheme.primary,
theme.colorScheme.secondary,
],
begin: Alignment.centerLeft,
end: Alignment.bottomRight,
)
: null,
), ),
clipBehavior: Clip.antiAlias,
child: Container( child: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular( borderRadius: BorderRadius.circular(

View file

@ -211,10 +211,19 @@ class SettingsStyleView extends StatelessWidget {
: 12, : 12,
bottom: 12, bottom: 12,
), ),
child: Material( child: DecoratedBox(
color: theme.colorScheme.primary, decoration: BoxDecoration(
borderRadius: BorderRadius.circular( gradient: LinearGradient(
AppConfig.borderRadius, colors: [
theme.colorScheme.primary,
theme.colorScheme.secondary,
],
begin: Alignment.centerLeft,
end: Alignment.bottomRight,
),
borderRadius: BorderRadius.circular(
AppConfig.borderRadius,
),
), ),
child: Padding( child: Padding(
padding: const EdgeInsets.symmetric( padding: const EdgeInsets.symmetric(