feat: redesign LoginScreen with icon, branding, polished layout

- Sports icon in primaryContainer circle (80dp)
- 'MyIce' branding (dropped 'K' tech codename)
- 'Votre calendrier hockey' subtitle
- Login icon on connect button
- Centered vertical layout with proper spacing
This commit is contained in:
2026-08-06 17:11:10 +02:00
parent c1c8e21ba3
commit 73b8e4480a
@@ -17,14 +17,22 @@
package ch.parano.myicek.ui.screens package ch.parano.myicek.ui.screens
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.Login
import androidx.compose.material.icons.filled.SportsHockey
import androidx.compose.material3.Button import androidx.compose.material3.Button
import androidx.compose.material3.CircularProgressIndicator import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold import androidx.compose.material3.Scaffold
import androidx.compose.material3.SnackbarHost import androidx.compose.material3.SnackbarHost
@@ -37,10 +45,12 @@ import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import ch.parano.myicek.viewmodel.AuthViewModel import ch.parano.myicek.ui.theme.Dimens
import ch.parano.myicek.viewmodel.AuthState import ch.parano.myicek.viewmodel.AuthState
import ch.parano.myicek.viewmodel.AuthViewModel
@Composable @Composable
fun LoginScreen( fun LoginScreen(
@@ -65,22 +75,44 @@ fun LoginScreen(
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center, verticalArrangement = Arrangement.Center,
) { ) {
Box(
modifier = Modifier
.size(80.dp)
.clip(CircleShape)
.background(MaterialTheme.colorScheme.primaryContainer),
contentAlignment = Alignment.Center,
) {
Icon(
imageVector = Icons.Filled.SportsHockey,
contentDescription = null,
modifier = Modifier.size(48.dp),
tint = MaterialTheme.colorScheme.onPrimaryContainer,
)
}
Spacer(Modifier.height(Dimens.lg))
Text( Text(
text = "MyIceK", text = "MyIce",
style = MaterialTheme.typography.headlineLarge, style = MaterialTheme.typography.headlineLarge,
fontWeight = FontWeight.Bold, fontWeight = FontWeight.Bold,
) )
Text( Text(
text = "Games", text = "Votre calendrier hockey",
style = MaterialTheme.typography.titleMedium, style = MaterialTheme.typography.titleMedium,
color = MaterialTheme.colorScheme.onSurfaceVariant,
) )
Spacer(modifier = Modifier.height(32.dp)) Spacer(Modifier.height(Dimens.xxl))
if (state is AuthState.Loading) { if (state is AuthState.Loading) {
CircularProgressIndicator() CircularProgressIndicator()
} else { } else {
Button( Button(
onClick = { viewModel.login() }, onClick = { viewModel.login() },
modifier = Modifier.height(48.dp),
) { ) {
Icon(
imageVector = Icons.AutoMirrored.Filled.Login,
contentDescription = null,
)
Spacer(Modifier.size(Dimens.sm))
Text("Se connecter avec Infomaniak") Text("Se connecter avec Infomaniak")
} }
} }