Fix missing logo background and padding
This commit is contained in:
Wolf Montwé
parent
1b410e6ea1
commit
eb1ffa0c7a
2 changed files with 192 additions and 30 deletions
|
|
@ -1,19 +1,15 @@
|
|||
package net.thunderbird.feature.onboarding
|
||||
|
||||
import androidx.compose.foundation.Image
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Arrangement
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.foundation.layout.fillMaxHeight
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.foundation.layout.fillMaxWidth
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.draw.clip
|
||||
import androidx.compose.ui.composed
|
||||
import androidx.compose.ui.res.painterResource
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import app.k9mail.core.ui.compose.common.DevicePreviews
|
||||
|
|
@ -34,38 +30,38 @@ internal fun OnboardingContent(
|
|||
onImportClick: () -> Unit,
|
||||
modifier: Modifier = Modifier,
|
||||
) {
|
||||
ResponsiveContent {
|
||||
Background(
|
||||
modifier = modifier,
|
||||
) {
|
||||
Background(
|
||||
modifier = modifier,
|
||||
) {
|
||||
ResponsiveContent {
|
||||
LazyColumnWithFooter(
|
||||
modifier = Modifier
|
||||
.fillMaxHeight()
|
||||
.padding(MainTheme.spacings.double),
|
||||
modifier = Modifier.fillMaxSize(),
|
||||
footer = {
|
||||
WelcomeFooter(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(top = MainTheme.spacings.triple),
|
||||
.padding(top = MainTheme.spacings.quadruple),
|
||||
onStartClick = onStartClick,
|
||||
onImportClick = onImportClick,
|
||||
)
|
||||
},
|
||||
verticalArrangement = Arrangement.spacedBy(MainTheme.sizes.large, Alignment.CenterVertically),
|
||||
verticalArrangement = Arrangement.spacedBy(MainTheme.sizes.medium, Alignment.CenterVertically),
|
||||
) {
|
||||
item {
|
||||
WelcomeLogo(
|
||||
modifier = Modifier.fillMaxWidth(),
|
||||
modifier = Modifier
|
||||
.defaultItemModifier()
|
||||
.padding(top = MainTheme.spacings.quadruple),
|
||||
)
|
||||
}
|
||||
item {
|
||||
WelcomeTitle(
|
||||
modifier = Modifier.fillMaxWidth(),
|
||||
modifier = Modifier.defaultItemModifier(),
|
||||
)
|
||||
}
|
||||
item {
|
||||
WelcomeMessage(
|
||||
modifier = Modifier.fillMaxWidth(),
|
||||
modifier = Modifier.defaultItemModifier(),
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -81,18 +77,10 @@ private fun WelcomeLogo(
|
|||
modifier = Modifier.then(modifier),
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.size(MainTheme.sizes.huge)
|
||||
.clip(shape = RoundedCornerShape(percent = 50))
|
||||
.background(color = MainTheme.colors.surface),
|
||||
) {
|
||||
Image(
|
||||
painter = painterResource(id = MainTheme.images.logo),
|
||||
contentDescription = null,
|
||||
modifier = Modifier.size(MainTheme.sizes.huge),
|
||||
)
|
||||
}
|
||||
Image(
|
||||
painter = painterResource(id = R.drawable.onboarding_welcome_logo),
|
||||
contentDescription = null,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -148,6 +136,11 @@ private fun WelcomeFooter(
|
|||
}
|
||||
}
|
||||
|
||||
private fun Modifier.defaultItemModifier() = composed {
|
||||
fillMaxWidth()
|
||||
.padding(MainTheme.spacings.double)
|
||||
}
|
||||
|
||||
@Composable
|
||||
@DevicePreviews
|
||||
internal fun OnboardingContentK9Preview() {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,169 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
xmlns:aapt="http://schemas.android.com/aapt"
|
||||
xmlns:tools="http://schemas.android.com/tools"
|
||||
android:width="330dp"
|
||||
android:height="330dp"
|
||||
android:viewportWidth="330"
|
||||
android:viewportHeight="330"
|
||||
tools:ignore="VectorRaster">
|
||||
<path
|
||||
android:fillColor="#FFEEEEEE"
|
||||
android:pathData="M165 0A165 165 0 1 0 165 330 165 165 0 1 0 165 0z" />
|
||||
<group>
|
||||
<path
|
||||
android:fillAlpha="0.2"
|
||||
android:fillColor="#FF000000"
|
||||
android:pathData="M114.2 72.25c-3.66 0-6.62 2.95-6.62 6.63v8.83c0 3.67 2.96 6.62 6.63 6.62h15.46V112h8.83V94.33h2.2c3.68 0 6.63-2.95 6.63-6.62v-8.83c0-3.68-2.95-6.63-6.62-6.63h-26.5Zm75.1 0c-3.68 0-6.63 2.95-6.63 6.63v8.83c0 3.67 2.95 6.62 6.62 6.62h2.21V112h8.83V94.33h15.46c3.67 0 6.63-2.95 6.63-6.62v-8.83c0-3.68-2.96-6.63-6.63-6.63h-26.5ZM94.32 191.5v13.25l28.28 41.96c2.28 3.96 6.55 6.62 11.47 6.62h61.84c4.92 0 9.19-2.66 11.47-6.62h0.02l28.26-41.96V191.5H94.33Z" />
|
||||
</group>
|
||||
<group>
|
||||
<path
|
||||
android:fillAlpha="0.2"
|
||||
android:fillColor="#FF000000"
|
||||
android:pathData="M114.2 67.83c-3.66 0-6.62 2.96-6.62 6.63v8.83c0 3.67 2.96 6.63 6.63 6.63h15.46v17.66h8.83V89.92h2.2c3.68 0 6.63-2.96 6.63-6.63v-8.83c0-3.67-2.95-6.63-6.62-6.63h-26.5Zm75.1 0c-3.68 0-6.63 2.96-6.63 6.63v8.83c0 3.67 2.95 6.63 6.62 6.63h2.21v17.66h8.83V89.92h15.46c3.67 0 6.63-2.96 6.63-6.63v-8.83c0-3.67-2.96-6.63-6.63-6.63h-26.5ZM94.32 187.08v13.25l28.28 41.96c2.28 3.96 6.55 6.63 11.47 6.63h61.84c4.92 0 9.19-2.67 11.47-6.63h0.02l28.26-41.96v-13.25H94.33Z" />
|
||||
</group>
|
||||
<group>
|
||||
<path
|
||||
android:fillAlpha="0.2"
|
||||
android:fillColor="#FF000000"
|
||||
android:pathData="M85.5 187.08l8.83 13.25 28.28 41.96c2.28 3.96 6.55 6.63 11.47 6.63h61.84c4.92 0 9.19-2.67 11.47-6.63h0.02l28.26-41.96 8.83-13.25h-159Z" />
|
||||
</group>
|
||||
<path
|
||||
android:fillColor="#FF607D8B"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M94.33 187.08v13.25l28.28 41.96c2.28 3.96 6.55 6.63 11.47 6.63h61.84c4.92 0 9.19-2.67 11.47-6.63h0.02l28.26-41.96v-13.25H94.33Z" />
|
||||
<path
|
||||
android:fillColor="#FF263238"
|
||||
android:pathData="M138.5 76.67h-8.83v30.91h8.83V76.67Z" />
|
||||
<path
|
||||
android:fillColor="#FF263238"
|
||||
android:pathData="M200.33 76.67h-8.83v30.91h8.83V76.67Z" />
|
||||
<path
|
||||
android:fillColor="#FF4D6570"
|
||||
android:pathData="M94.33 199.23v1.1l28.28 41.96c2.28 3.96 6.55 6.63 11.47 6.63h61.84c4.92 0 9.19-2.67 11.47-6.63h0.02l28.26-41.96v-1.1l-28.26 41.96h-0.02c-2.28 3.96-6.55 6.62-11.47 6.62h-61.84c-4.92 0-9.19-2.66-11.47-6.62l-28.28-41.96Z" />
|
||||
<path
|
||||
android:fillColor="#FF607D8B"
|
||||
android:pathData="M147.33 83.3v-8.84c0-3.66-2.96-6.63-6.62-6.63h-26.5c-3.66 0-6.63 2.97-6.63 6.63v8.83c0 3.66 2.97 6.63 6.63 6.63h26.5c3.66 0 6.62-2.97 6.62-6.63Z" />
|
||||
<path
|
||||
android:fillColor="#FF607D8B"
|
||||
android:pathData="M222.42 83.3v-8.84c0-3.66-2.97-6.63-6.63-6.63h-26.5c-3.66 0-6.62 2.97-6.62 6.63v8.83c0 3.66 2.96 6.63 6.62 6.63h26.5c3.66 0 6.63-2.97 6.63-6.63Z" />
|
||||
<path
|
||||
android:fillColor="#FF4D6570"
|
||||
android:pathData="M107.58 82.19v1.1c0 3.67 2.96 6.63 6.63 6.63h26.5c3.67 0 6.62-2.96 6.62-6.63v-1.1c0 3.67-2.95 6.62-6.62 6.62h-26.5c-3.67 0-6.63-2.95-6.63-6.62Z" />
|
||||
<path
|
||||
android:fillColor="#FF4D6570"
|
||||
android:pathData="M182.67 82.19v1.1c0 3.67 2.95 6.63 6.62 6.63h26.5c3.67 0 6.63-2.96 6.63-6.63v-1.1c0 3.67-2.96 6.62-6.63 6.62h-26.5c-3.67 0-6.62-2.95-6.62-6.62Z" />
|
||||
<path
|
||||
android:fillColor="#FF8097A2"
|
||||
android:pathData="M114.2 67.83c-3.66 0-6.62 2.96-6.62 6.63v1.1c0-3.67 2.96-6.62 6.63-6.62h26.5c3.67 0 6.62 2.95 6.62 6.62v-1.1c0-3.67-2.95-6.63-6.62-6.63h-26.5Z" />
|
||||
<path
|
||||
android:fillColor="#FF8097A2"
|
||||
android:pathData="M189.3 67.83c-3.68 0-6.63 2.96-6.63 6.63v1.1c0-3.67 2.95-6.62 6.62-6.62h26.5c3.67 0 6.63 2.95 6.63 6.62v-1.1c0-3.67-2.96-6.63-6.63-6.63h-26.5Z" />
|
||||
<path
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M94.33 187.08v13.25l28.28 41.96c2.28 3.96 6.55 6.63 11.47 6.63h61.84c4.92 0 9.19-2.67 11.47-6.63h0.02l28.26-41.96v-13.25H94.33Z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:endX="147.33"
|
||||
android:endY="213.58"
|
||||
android:startX="147.33"
|
||||
android:startY="182.67"
|
||||
android:type="linear">
|
||||
<item
|
||||
android:color="#FF4D6570"
|
||||
android:offset="0" />
|
||||
<item
|
||||
android:color="#0F4D6570"
|
||||
android:offset="1" />
|
||||
</gradient>
|
||||
</aapt:attr>
|
||||
</path>
|
||||
<group>
|
||||
<path
|
||||
android:fillAlpha="0.2"
|
||||
android:fillColor="#FF000000"
|
||||
android:pathData="M248.92 191.5v-75.08c0-7.32-5.94-13.25-13.25-13.25H94.33c-7.31 0-13.25 5.93-13.25 13.25v75.08c0 7.32 5.94 13.25 13.25 13.25h141.34c7.31 0 13.25-5.93 13.25-13.25Z" />
|
||||
</group>
|
||||
<group>
|
||||
<path
|
||||
android:fillAlpha="0.2"
|
||||
android:fillColor="#FF000000"
|
||||
android:pathData="M248.92 187.08V112c0-7.32-5.94-13.25-13.25-13.25H94.33c-7.31 0-13.25 5.93-13.25 13.25v75.08c0 7.32 5.94 13.25 13.25 13.25h141.34c7.31 0 13.25-5.93 13.25-13.25Z" />
|
||||
</group>
|
||||
<path
|
||||
android:fillColor="#FFFF1744"
|
||||
android:pathData="M248.92 187.08V112c0-7.32-5.94-13.25-13.25-13.25H94.33c-7.31 0-13.25 5.93-13.25 13.25v75.08c0 7.32 5.94 13.25 13.25 13.25h141.34c7.31 0 13.25-5.93 13.25-13.25Z" />
|
||||
<path
|
||||
android:pathData="M98.75 116.42L165 151.75l66.25-35.33"
|
||||
android:strokeWidth="6"
|
||||
android:strokeColor="#FFFBE9E7"
|
||||
android:strokeLineCap="round" />
|
||||
<path
|
||||
android:fillColor="#FFFF4569"
|
||||
android:pathData="M94.33 98.75c-7.34 0-13.25 5.91-13.25 13.25v1.1c0-7.34 5.91-13.25 13.25-13.25h141.34c7.34 0 13.25 5.91 13.25 13.25V112c0-7.34-5.91-13.25-13.25-13.25H94.33Z" />
|
||||
<path
|
||||
android:fillColor="#FFD81A3D"
|
||||
android:pathData="M81.08 185.98v1.1c0 7.34 5.91 13.25 13.25 13.25h141.34c7.34 0 13.25-5.9 13.25-13.25v-1.1c0 7.34-5.91 13.25-13.25 13.25H94.33c-7.34 0-13.25-5.91-13.25-13.25Z" />
|
||||
<group>
|
||||
<path
|
||||
android:fillAlpha="0.2"
|
||||
android:fillColor="#FF000000"
|
||||
android:pathData="M158.38 231.25c-3.67 0-6.63 2.96-6.63 6.63v13.25c0 0.3 0.03 0.6 0.07 0.88-0.05 0.45-0.07 0.88-0.07 1.32 0 1.74 0.34 3.47 1 5.07 0.67 1.61 1.65 3.07 2.88 4.3s2.7 2.2 4.3 2.88c1.6 0.66 3.33 1 5.07 1 1.74 0 3.46-0.34 5.07-1 1.6-0.67 3.07-1.65 4.3-2.88s2.2-2.69 2.87-4.3c0.67-1.6 1.01-3.33 1.01-5.07 0-0.42-0.03-0.85-0.07-1.27 0.04-0.3 0.07-0.62 0.07-0.94v-13.25c0-3.66-2.96-6.62-6.63-6.62h-13.25Z" />
|
||||
</group>
|
||||
<group>
|
||||
<path
|
||||
android:fillAlpha="0.2"
|
||||
android:fillColor="#FF000000"
|
||||
android:pathData="M158.38 226.83c-3.67 0-6.63 2.96-6.63 6.63v13.25c0 0.3 0.03 0.6 0.07 0.88v0.01c-0.05 0.44-0.07 0.88-0.07 1.32 0 1.74 0.34 3.46 1 5.07 0.67 1.6 1.65 3.06 2.88 4.3 1.23 1.23 2.7 2.2 4.3 2.87 1.6 0.66 3.33 1 5.07 1 1.74 0 3.46-0.34 5.07-1 1.6-0.67 3.07-1.64 4.3-2.87 1.23-1.24 2.2-2.7 2.87-4.3 0.67-1.61 1.01-3.33 1.01-5.07 0-0.43-0.03-0.85-0.07-1.28 0.04-0.3 0.07-0.61 0.07-0.93v-13.25c0-3.67-2.96-6.63-6.63-6.63h-13.25Z" />
|
||||
</group>
|
||||
<path
|
||||
android:fillColor="#FF263238"
|
||||
android:pathData="M178.25 246.7v-13.24c0-3.66-2.97-6.63-6.63-6.63h-13.25c-3.65 0-6.62 2.97-6.62 6.63v13.25c0 3.66 2.97 6.62 6.63 6.62h13.25c3.65 0 6.62-2.96 6.62-6.62Z" />
|
||||
<path
|
||||
android:fillColor="#FF263238"
|
||||
android:pathData="M165 262.17c7.32 0 13.25-5.94 13.25-13.25 0-7.32-5.93-13.25-13.25-13.25s-13.25 5.93-13.25 13.25c0 7.31 5.93 13.25 13.25 13.25Z" />
|
||||
<path
|
||||
android:fillColor="#FF37474F"
|
||||
android:pathData="M158.38 226.83c-3.67 0-6.63 2.96-6.63 6.63v1.1c0-3.67 2.96-6.62 6.63-6.62h13.25c3.66 0 6.62 2.95 6.62 6.62v-1.1c0-3.67-2.96-6.63-6.63-6.63h-13.25Z" />
|
||||
<path
|
||||
android:fillColor="#FF1A252A"
|
||||
android:pathData="M151.77 248.29l-0.02 0.63c0 1.74 0.34 3.46 1 5.07 0.67 1.6 1.65 3.06 2.88 4.3 1.23 1.23 2.7 2.2 4.3 2.87 1.6 0.66 3.33 1 5.07 1 1.74 0 3.46-0.34 5.07-1 1.6-0.67 3.07-1.64 4.3-2.87 1.23-1.24 2.2-2.7 2.87-4.3 0.67-1.61 1.01-3.33 1.01-5.07l-0.02-0.46c-0.17 3.4-1.63 6.6-4.1 8.95-2.46 2.34-5.73 3.65-9.13 3.65-3.43 0-6.72-1.33-9.19-3.72-2.47-2.38-3.91-5.63-4.04-9.05Z" />
|
||||
<path
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M114.2 67.83c-3.66 0-6.62 2.96-6.62 6.63v8.83c0 3.67 2.96 6.63 6.63 6.63h15.46v8.83H94.33c-7.34 0-13.25 5.91-13.25 13.25v75.08c0 7.34 5.91 13.25 13.25 13.25l28.28 41.96c2.28 3.96 6.55 6.63 11.47 6.63h17.67c0 1.74 0.34 3.46 1 5.07 0.67 1.6 1.65 3.06 2.88 4.3 1.23 1.23 2.7 2.2 4.3 2.87 1.6 0.66 3.33 1 5.07 1 3.51 0 6.88-1.39 9.37-3.88 2.48-2.48 3.88-5.85 3.88-9.36h17.67c4.92 0 9.19-2.67 11.47-6.63h0.01l28.27-41.96c7.34 0 13.25-5.9 13.25-13.25V112c0-7.34-5.91-13.25-13.25-13.25h-35.34v-8.83h15.46c3.67 0 6.63-2.96 6.63-6.63v-8.83c0-3.67-2.96-6.63-6.63-6.63h-26.5c-3.67 0-6.62 2.96-6.62 6.63v8.83c0 3.67 2.95 6.63 6.62 6.63h2.21v8.83h-53v-8.83h2.2c3.68 0 6.63-2.96 6.63-6.63v-8.83c0-3.67-2.95-6.63-6.62-6.63h-26.5Z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:centerX="0"
|
||||
android:centerY="0"
|
||||
android:gradientRadius="1"
|
||||
android:type="radial">
|
||||
<item
|
||||
android:color="#1AFBFCFC"
|
||||
android:offset="0" />
|
||||
<item
|
||||
android:color="#00FBFCFC"
|
||||
android:offset="1" />
|
||||
</gradient>
|
||||
</aapt:attr>
|
||||
</path>
|
||||
<path
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M114.2 67.83c-3.66 0-6.62 2.96-6.62 6.63v8.83c0 3.67 2.96 6.63 6.63 6.63h15.46v8.83H94.33c-7.34 0-13.25 5.91-13.25 13.25v75.08c0 7.34 5.91 13.25 13.25 13.25l28.28 41.96c2.28 3.96 6.55 6.63 11.47 6.63h17.67c0 1.74 0.34 3.46 1 5.07 0.67 1.6 1.65 3.06 2.88 4.3 1.23 1.23 2.7 2.2 4.3 2.87 1.6 0.66 3.33 1 5.07 1 3.51 0 6.88-1.39 9.37-3.88 2.48-2.48 3.88-5.85 3.88-9.36h17.67c4.92 0 9.19-2.67 11.47-6.63h0.01l28.27-41.96c7.34 0 13.25-5.9 13.25-13.25V112c0-7.34-5.91-13.25-13.25-13.25h-35.34v-8.83h15.46c3.67 0 6.63-2.96 6.63-6.63v-8.83c0-3.67-2.96-6.63-6.63-6.63h-26.5c-3.67 0-6.62 2.96-6.62 6.63v8.83c0 3.67 2.95 6.63 6.62 6.63h2.21v8.83h-53v-8.83h2.2c3.68 0 6.63-2.96 6.63-6.63v-8.83c0-3.67-2.95-6.63-6.62-6.63h-26.5Z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:endX="271"
|
||||
android:endY="271"
|
||||
android:startX="271"
|
||||
android:startY="59"
|
||||
android:type="linear">
|
||||
<item
|
||||
android:color="#1AFBFCFC"
|
||||
android:offset="0" />
|
||||
<item
|
||||
android:color="#00FBFCFC"
|
||||
android:offset="1" />
|
||||
</gradient>
|
||||
</aapt:attr>
|
||||
</path>
|
||||
</vector>
|
||||
|
||||
Loading…
Reference in a new issue