chore: Polish chat bubble colors
This commit is contained in:
parent
8ba46a3533
commit
45299a741f
4 changed files with 55 additions and 33 deletions
|
|
@ -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,
|
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -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),
|
||||||
),
|
),
|
||||||
|
|
|
||||||
|
|
@ -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(
|
||||||
|
|
|
||||||
|
|
@ -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(
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue