design improvements!

This commit is contained in:
Mauro Romito 2022-10-17 16:39:42 +02:00
parent d59a6ecf54
commit 06d54913d6
2 changed files with 38 additions and 31 deletions

View file

@ -29,7 +29,7 @@ struct Composer: View {
@State private var isActionButtonEnabled = false
private let horizontalPadding: CGFloat = 12
private let borderHeight: CGFloat = 44
private let borderHeight: CGFloat = 40
private let minTextViewHeight: CGFloat = 20
private var verticalPadding: CGFloat {
(borderHeight - minTextViewHeight) / 2
@ -122,10 +122,9 @@ struct Composer: View {
.padding(.bottom, verticalPadding)
}
.clipShape(rect)
.overlay(rect.stroke(theme.colors.quinaryContent, lineWidth: 2))
.overlay(rect.stroke(theme.colors.quinaryContent, lineWidth: 1))
.padding(.horizontal, horizontalPadding)
.padding(.top, 8)
.padding(.bottom, 4)
.onTapGesture {
if !focused {
focused = true
@ -136,16 +135,22 @@ struct Composer: View {
showSendMediaActions()
} label: {
Image(Asset.Images.startComposeModule.name)
.resizable()
.foregroundColor(theme.colors.tertiaryContent)
.padding(11)
.background(Circle().fill(theme.colors.system))
.frame(width: 14, height: 14)
}
.frame(width: 36, height: 36)
.background(Circle().fill(theme.colors.system))
.padding(.vertical, 8)
.padding(.trailing, 8)
.accessibilityLabel(VectorL10n.create)
FormattingToolbar(formatItems: formatItems) { type in
wysiwygViewModel.apply(type.action)
}
.frame(height: 52)
Spacer()
ZStack {
// ZStack {
// TODO: Add support for voice messages
// Button {
//
@ -165,17 +170,18 @@ struct Composer: View {
Image(Asset.Images.sendIcon.name)
}
}
.frame(width: 36, height: 36)
.padding(.leading, 8)
.disabled(!isActionButtonEnabled)
.opacity(isActionButtonEnabled ? 1 : 0.3)
.animation(.easeInOut(duration: 0.15), value: isActionButtonEnabled)
.accessibilityIdentifier(actionButtonAccessibilityIdentifier)
.accessibilityLabel(VectorL10n.send)
}
.onChange(of: wysiwygViewModel.isContentEmpty) { empty in
isActionButtonEnabled = !empty
}
}
.padding(.horizontal, 16)
.padding(.horizontal, 12)
.padding(.bottom, 4)
.animation(.none)
}

View file

@ -32,7 +32,7 @@ struct FormattingToolbar: View {
var formatAction: (FormatType) -> Void
var body: some View {
HStack {
HStack(spacing: 4) {
ForEach(formatItems) { item in
Button {
formatAction(item.type)
@ -42,6 +42,7 @@ struct FormattingToolbar: View {
.foregroundColor(item.active ? theme.colors.accent : theme.colors.tertiaryContent)
}
.disabled(item.disabled)
.frame(width: 44, height: 44)
.background(item.active ? theme.colors.accent.opacity(0.1) : theme.colors.background)
.cornerRadius(8)
.accessibilityIdentifier(item.accessibilityIdentifier)