Unify button appearance

[Pururun]

• Make almost all button depend on 3 standard buttons
• Replace surface and onSurface with our own custom theme color

This is part of the design system overhaul.

---

This change is 

[linear]

DROID-379 Unify buttons

Simplify and unify button appearance

[Rawa]

Reviewed 33 of 34 files at r1, all commit messages.
Reviewable status: 33 of 34 files reviewed, 1 unresolved discussion (waiting on @Pururun)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 74 at r1 (raw file):

    text: String,
    modifier: Modifier = Modifier,
    background: Color = MaterialTheme.colorScheme.background,

Would be nice if we could avoid passing backgrounds into the button. I know we overlay do alpha dance with it but, is it really necessary? Can we assume it is always colorScheme.background until we get rid of the alpha?

[mullmat]

Tried this out (after getting it sent to me by @Pururun ) and it was really nice to have the buttons unified! 🎉
It was easy to use and it is makes it easier to change button details if needs be (such as padding, adding icon, etc).

[Pururun]

Reviewable status: 33 of 34 files reviewed, 1 unresolved discussion (waiting on @Rawa)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 74 at r1 (raw file):

Previously, Rawa (David Göransson) wrote…

Would be nice if we could avoid passing backgrounds into the button. I know we overlay do alpha dance with it but, is it really necessary? Can we assume it is always colorScheme.background until we get rid of the alpha?

I removed it for NegativeButton as it was using the default value as always, not sure about what do with the VariantButton though as it is actually used on different backgrounds.

[Rawa]

Reviewable status: 33 of 34 files reviewed, 1 unresolved discussion (waiting on @Pururun)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 74 at r1 (raw file):

Previously, Pururun (Jonatan Rhodin) wrote…

I removed it for NegativeButton as it was using the default value as always, not sure about what do with the VariantButton though as it is actually used on different backgrounds.

We should let design decide on a color to use to avoid involving the transparency at all I think.

[Rawa]

Reviewable status: 33 of 34 files reviewed, 1 unresolved discussion (waiting on @Pururun)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 74 at r1 (raw file):

Previously, Rawa (David Göransson) wrote…

We should let design decide on a color to use to avoid involving the transparency at all I think.

maybe that is out of scope for now though?

[Rawa]

Reviewable status: 17 of 37 files reviewed, 3 unresolved discussions (waiting on @Pururun)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 164 at r4 (raw file):

    modifier: Modifier = Modifier,
    isEnabled: Boolean = true,
    icon: Int? = null,

Should or BaseButton be more generic than having a fixed option of passing an Int resource? Would be nice we could slot it instead with optional lambdas.

@Composable () -> Unit

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 175 at r4 (raw file):

        modifier =
            modifier
                .height(Dimens.buttonHeight)

We should avoid setting height of button, if user sets a big font on their font the text will not render properly.

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 193 at r4 (raw file):

            )
            icon?.let {
                Image(

Should maybe Icon instead of Image with a tint of contentColor? Then it would always have the same color as the text.

[Pururun]

Reviewable status: 13 of 39 files reviewed, 2 unresolved discussions (waiting on @Rawa)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 74 at r1 (raw file):

Previously, Rawa (David Göransson) wrote…

maybe that is out of scope for now though?

Yeah maybe.

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 164 at r4 (raw file):

Previously, Rawa (David Göransson) wrote…

Should or BaseButton be more generic than having a fixed option of passing an Int resource? Would be nice we could slot it instead with optional lambdas.

@Composable () -> Unit

Done

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 175 at r4 (raw file):

Previously, Rawa (David Göransson) wrote…

We should avoid setting height of button, if user sets a big font on their font the text will not render properly.

This seems to cause side effects that some button just take up alla available space, will try to figure out why.

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 193 at r4 (raw file):

Previously, Rawa (David Göransson) wrote…

Should maybe Icon instead of Image with a tint of contentColor? Then it would always have the same color as the text.

Done

[Rawa]

Reviewed 5 of 10 files at r3, 12 of 14 files at r4, 1 of 1 files at r5, 8 of 8 files at r6, 1 of 1 files at r7, 12 of 14 files at r8, all commit messages.
Reviewable status: 38 of 40 files reviewed, 4 unresolved discussions (waiting on @Pururun)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt line 175 at r4 (raw file):

Previously, Pururun (Jonatan Rhodin) wrote…

This seems to cause side effects that some button just take up alla available space, will try to figure out why.

Done

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DeviceRemovalDialog.kt line 69 at r8 (raw file):

            PrimaryButton(
                modifier = Modifier.focusRequester(FocusRequester()),
                onClick = { onDismiss() },

Why this?

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DnsDialog.kt line 173 at r8 (raw file):

                PrimaryButton(
                    modifier = Modifier.padding(top = mediumPadding),
                    onClick = { onAttemptToSave() },

Same

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DnsDialog.kt line 181 at r8 (raw file):

                    PrimaryButton(
                        modifier = Modifier.padding(top = mediumPadding),
                        onClick = { onRemove() },

Same

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DnsDialog.kt line 188 at r8 (raw file):

                PrimaryButton(
                    modifier = Modifier.padding(top = mediumPadding),
                    onClick = { onDismiss() },

Same

[Pururun]

Reviewable status: 33 of 41 files reviewed, 4 unresolved discussions (waiting on @Rawa)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DnsDialog.kt line 173 at r8 (raw file):

Previously, Rawa (David Göransson) wrote…

Same

Done

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DnsDialog.kt line 181 at r8 (raw file):

Previously, Rawa (David Göransson) wrote…

Same

Done

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DnsDialog.kt line 188 at r8 (raw file):

Previously, Rawa (David Göransson) wrote…

Same

Done

[Pururun]

Reviewable status: 33 of 41 files reviewed, 4 unresolved discussions (waiting on @Rawa)

---

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/DeviceRemovalDialog.kt line 69 at r8 (raw file):

Previously, Rawa (David Göransson) wrote…

Why this?

Done.

[Rawa]

Reviewed 6 of 6 files at r9.
Reviewable status: 37 of 41 files reviewed, all discussions resolved

[Rawa]

Reviewed 4 of 4 files at r10, 13 of 16 files at r11, 3 of 3 files at r12, all commit messages.
Reviewable status: complete! all files reviewed, all discussions resolved