From 817a867309760e613400a7119a48e4f833822ce7 Mon Sep 17 00:00:00 2001 From: MM20 <15646950+MM2-0@users.noreply.github.com> Date: Sun, 26 Sep 2021 00:28:42 +0200 Subject: [PATCH] Update typography --- .../java/de/mm20/launcher2/ui/AppTheme.kt | 39 ++++++++++++++--- .../de/mm20/launcher2/ui/LegacyAppTheme.kt | 43 ++++++++++++++----- .../de/mm20/launcher2/ui/component/Clocks.kt | 8 ++-- .../mm20/launcher2/ui/component/SearchBar.kt | 5 ++- .../de/mm20/launcher2/ui/component/Toolbar.kt | 15 +++++-- .../launcher2/ui/search/ApplicationItem.kt | 2 +- .../launcher2/ui/search/CalculatorItem.kt | 2 +- .../de/mm20/launcher2/ui/search/FileItem.kt | 2 +- .../mm20/launcher2/ui/search/GridItemLabel.kt | 2 +- .../mm20/launcher2/ui/search/WikipediaItem.kt | 2 +- .../ui/searchable/CalendarEventItem.kt | 2 +- .../launcher2/ui/widget/CalendarWidget.kt | 9 ++-- .../mm20/launcher2/ui/widget/MusicWidget.kt | 2 +- .../mm20/launcher2/ui/widget/WeatherWidget.kt | 10 ++--- .../launcher2/ui/widget/parts/DatePart.kt | 2 +- 15 files changed, 103 insertions(+), 42 deletions(-) diff --git a/ui/src/main/java/de/mm20/launcher2/ui/AppTheme.kt b/ui/src/main/java/de/mm20/launcher2/ui/AppTheme.kt index 76da3b8f..7a928549 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/AppTheme.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/AppTheme.kt @@ -12,7 +12,6 @@ import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import de.mm20.launcher2.ui.locals.LocalColorScheme -import de.mm20.launcher2.ui.locals.LocalWallpaperColors val lightPalette = lightColors( primary = Color(0, 114, 255) @@ -37,25 +36,51 @@ val Inter = FontFamily( val typography = Typography( h1 = TextStyle( - fontSize = 18.sp, - fontWeight = FontWeight.ExtraBold, + fontSize = 96.sp, + fontWeight = FontWeight.Light, fontFamily = Inter ), h2 = TextStyle( - fontSize = 15.sp, - fontWeight = FontWeight.Bold, + fontSize = 60.sp, + fontWeight = FontWeight.Light, fontFamily = Inter ), h3 = TextStyle( - fontSize = 13.sp, + fontSize = 48.sp, + fontWeight = FontWeight.Normal, + fontFamily = Inter + ), + h4 = TextStyle( + fontSize = 34.sp, + fontWeight = FontWeight.Normal, + fontFamily = Inter + ), + h5 = TextStyle( + fontSize = 24.sp, + fontWeight = FontWeight.Medium, + fontFamily = Inter + ), + h6 = TextStyle( + fontSize = 20.sp, + fontWeight = FontWeight.Bold, fontFamily = Inter ), caption = TextStyle( fontFamily = Inter, fontSize = 13.sp ), + subtitle1 = TextStyle( + fontFamily = Inter, + fontSize = 16.sp, + fontWeight = FontWeight.Bold, + ), + subtitle2 = TextStyle( + fontFamily = Inter, + fontWeight = FontWeight.SemiBold, + fontSize = 14.sp, + ), body1 = TextStyle( - fontSize = 13.sp + fontSize = 14.sp ), body2 = TextStyle( fontSize = 13.sp diff --git a/ui/src/main/java/de/mm20/launcher2/ui/LegacyAppTheme.kt b/ui/src/main/java/de/mm20/launcher2/ui/LegacyAppTheme.kt index 4932ce78..95253be8 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/LegacyAppTheme.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/LegacyAppTheme.kt @@ -12,21 +12,42 @@ import androidx.compose.ui.unit.sp val legacyTypography = Typography( h1 = TextStyle( - fontSize = 18.sp, - fontWeight = FontWeight.Medium, + fontSize = 96.sp, + fontWeight = FontWeight.Light, ), h2 = TextStyle( - fontSize = 15.sp, - fontWeight = FontWeight.Bold, + fontSize = 60.sp, + fontWeight = FontWeight.Light, ), h3 = TextStyle( - fontSize = 13.sp, + fontSize = 48.sp, + fontWeight = FontWeight.Normal, + ), + h4 = TextStyle( + fontSize = 34.sp, + fontWeight = FontWeight.Normal, + ), + h5 = TextStyle( + fontSize = 24.sp, + fontWeight = FontWeight.Medium, + ), + h6 = TextStyle( + fontSize = 20.sp, + fontWeight = FontWeight.Bold, ), caption = TextStyle( fontSize = 13.sp ), + subtitle1 = TextStyle( + fontSize = 16.sp, + fontWeight = FontWeight.Bold, + ), + subtitle2 = TextStyle( + fontWeight = FontWeight.SemiBold, + fontSize = 14.sp, + ), body1 = TextStyle( - fontSize = 13.sp + fontSize = 14.sp ), body2 = TextStyle( fontSize = 13.sp @@ -35,9 +56,9 @@ val legacyTypography = Typography( @Composable fun LegacyLauncherTheme(content: @Composable () -> Unit) { - MaterialTheme( - typography = legacyTypography, - content = content, - colors = if(isSystemInDarkTheme()) darkColors() else lightColors() - ) + MaterialTheme( + typography = legacyTypography, + content = content, + colors = if (isSystemInDarkTheme()) darkColors() else lightColors() + ) } \ No newline at end of file diff --git a/ui/src/main/java/de/mm20/launcher2/ui/component/Clocks.kt b/ui/src/main/java/de/mm20/launcher2/ui/component/Clocks.kt index 83bc3a73..a080300f 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/component/Clocks.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/component/Clocks.kt @@ -109,7 +109,7 @@ fun AnalogClock(time: Long) { Text( text = "12", - style = MaterialTheme.typography.h1.copy( + style = MaterialTheme.typography.subtitle1.copy( fontSize = 32.sp, lineHeight = 32.sp, ), @@ -120,7 +120,7 @@ fun AnalogClock(time: Long) { ) Text( text = "3", - style = MaterialTheme.typography.h1.copy( + style = MaterialTheme.typography.subtitle1.copy( fontSize = 32.sp ), color = textColor, @@ -130,7 +130,7 @@ fun AnalogClock(time: Long) { ) Text( text = "6", - style = MaterialTheme.typography.h1.copy( + style = MaterialTheme.typography.subtitle1.copy( fontSize = 32.sp ), color = textColor, @@ -140,7 +140,7 @@ fun AnalogClock(time: Long) { ) Text( text = "9", - style = MaterialTheme.typography.h1.copy( + style = MaterialTheme.typography.subtitle1.copy( fontSize = 32.sp ), color = textColor, diff --git a/ui/src/main/java/de/mm20/launcher2/ui/component/SearchBar.kt b/ui/src/main/java/de/mm20/launcher2/ui/component/SearchBar.kt index 966aa08d..5b18a561 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/component/SearchBar.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/component/SearchBar.kt @@ -132,7 +132,10 @@ fun SearchBar( DropdownMenuItem(onClick = { navController?.navigate("settings") }) { - Text(stringResource(id = R.string.title_activity_settings)) + Text( + stringResource(id = R.string.title_activity_settings), + style = MaterialTheme.typography.subtitle2 + ) } } } diff --git a/ui/src/main/java/de/mm20/launcher2/ui/component/Toolbar.kt b/ui/src/main/java/de/mm20/launcher2/ui/component/Toolbar.kt index 980c464b..0b3bf3e4 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/component/Toolbar.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/component/Toolbar.kt @@ -100,7 +100,10 @@ fun ColumnScope.OverflowMenuItems(items: List, onDismiss: () -> U DropdownMenuItem( onClick = { selectedSubMenu = i }, ) { - Text(action.label, modifier = Modifier.weight(1f)) + Text( + action.label, modifier = Modifier.weight(1f), + style = MaterialTheme.typography.subtitle2 + ) Icon(imageVector = Icons.Rounded.ArrowRight, contentDescription = null) } } @@ -108,7 +111,10 @@ fun ColumnScope.OverflowMenuItems(items: List, onDismiss: () -> U DropdownMenuItem( onClick = { action.onCheckedChange(!action.isChecked) }, ) { - Text(action.label) + Text( + action.label, + style = MaterialTheme.typography.subtitle2 + ) } } is DefaultToolbarAction -> { @@ -116,7 +122,10 @@ fun ColumnScope.OverflowMenuItems(items: List, onDismiss: () -> U action.action onDismiss() }) { - Text(action.label) + Text( + action.label, + style = MaterialTheme.typography.subtitle2 + ) } } } diff --git a/ui/src/main/java/de/mm20/launcher2/ui/search/ApplicationItem.kt b/ui/src/main/java/de/mm20/launcher2/ui/search/ApplicationItem.kt index a1ac8e74..fe32898d 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/search/ApplicationItem.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/search/ApplicationItem.kt @@ -62,7 +62,7 @@ fun ApplicationItem( Column { Text( text = app.label, - style = MaterialTheme.typography.h1, + style = MaterialTheme.typography.subtitle1, maxLines = 1, overflow = TextOverflow.Ellipsis, ) diff --git a/ui/src/main/java/de/mm20/launcher2/ui/search/CalculatorItem.kt b/ui/src/main/java/de/mm20/launcher2/ui/search/CalculatorItem.kt index 9fdbcf83..29432c5b 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/search/CalculatorItem.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/search/CalculatorItem.kt @@ -37,7 +37,7 @@ fun calculatorItem(): LazyListScope.() -> Unit { } Text( text = "= ${it.formattedString}", - style = MaterialTheme.typography.h1, + style = MaterialTheme.typography.subtitle1, modifier = Modifier.align(Alignment.End), ) if (it.term.matches(Regex("(0x|0b)?[0-9]+"))) { diff --git a/ui/src/main/java/de/mm20/launcher2/ui/search/FileItem.kt b/ui/src/main/java/de/mm20/launcher2/ui/search/FileItem.kt index 4550ba20..f956385b 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/search/FileItem.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/search/FileItem.kt @@ -74,7 +74,7 @@ fun FileItem( Column { Text( text = file.label, - style = MaterialTheme.typography.h2, + style = MaterialTheme.typography.subtitle2, maxLines = 1, overflow = TextOverflow.Ellipsis, ) diff --git a/ui/src/main/java/de/mm20/launcher2/ui/search/GridItemLabel.kt b/ui/src/main/java/de/mm20/launcher2/ui/search/GridItemLabel.kt index a00a9411..bc2e6aff 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/search/GridItemLabel.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/search/GridItemLabel.kt @@ -22,7 +22,7 @@ fun ColumnScope.GridItemLabel( maxLines = 1, overflow = TextOverflow.Ellipsis, textAlign = TextAlign.Center, - style = MaterialTheme.typography.body1, + style = MaterialTheme.typography.body2, softWrap = false, modifier = Modifier .fillMaxWidth() diff --git a/ui/src/main/java/de/mm20/launcher2/ui/search/WikipediaItem.kt b/ui/src/main/java/de/mm20/launcher2/ui/search/WikipediaItem.kt index f3bd8f85..1eff2002 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/search/WikipediaItem.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/search/WikipediaItem.kt @@ -36,7 +36,7 @@ fun WikipediaItem( ) { Text( text = wikipedia.label, - style = MaterialTheme.typography.h1, + style = MaterialTheme.typography.subtitle1, ) CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) { Text( diff --git a/ui/src/main/java/de/mm20/launcher2/ui/searchable/CalendarEventItem.kt b/ui/src/main/java/de/mm20/launcher2/ui/searchable/CalendarEventItem.kt index fa1110e0..8a26ca8b 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/searchable/CalendarEventItem.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/searchable/CalendarEventItem.kt @@ -80,7 +80,7 @@ fun CalendarEventItem( ) { Text( text = event.label, - style = MaterialTheme.typography.h2 + style = MaterialTheme.typography.subtitle2 ) AnimatedVisibility( representation == Representation.List diff --git a/ui/src/main/java/de/mm20/launcher2/ui/widget/CalendarWidget.kt b/ui/src/main/java/de/mm20/launcher2/ui/widget/CalendarWidget.kt index c9261b05..c040b2ad 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/widget/CalendarWidget.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/widget/CalendarWidget.kt @@ -122,7 +122,7 @@ fun CalendarWidget() { if (pinnedEvents.isNotEmpty()) { Text( text = stringResource(id = R.string.calendar_widget_pinned_events), - style = MaterialTheme.typography.h1 + style = MaterialTheme.typography.subtitle1 ) DeprecatedSearchableList( items = pinnedEvents, @@ -178,7 +178,7 @@ fun DaySelector( modifier = Modifier .wrapContentWidth(), text = formatDay(LocalContext.current, selectedDay), - style = MaterialTheme.typography.h1 + style = MaterialTheme.typography.subtitle1 ) Icon( imageVector = Icons.Rounded.ArrowDropDown, @@ -196,7 +196,10 @@ fun DaySelector( menuExpanded = false onSelectDay(selectedDay) }) { - Text(text = formatDay(LocalContext.current, day)) + Text( + text = formatDay(LocalContext.current, day), + style = MaterialTheme.typography.subtitle2 + ) } } } diff --git a/ui/src/main/java/de/mm20/launcher2/ui/widget/MusicWidget.kt b/ui/src/main/java/de/mm20/launcher2/ui/widget/MusicWidget.kt index a2d39a11..48f3b836 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/widget/MusicWidget.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/widget/MusicWidget.kt @@ -67,7 +67,7 @@ fun MusicWidget() { ) { Text( text = title ?: "---", - style = MaterialTheme.typography.h1, + style = MaterialTheme.typography.subtitle1, maxLines = 1, overflow = TextOverflow.Ellipsis ) diff --git a/ui/src/main/java/de/mm20/launcher2/ui/widget/WeatherWidget.kt b/ui/src/main/java/de/mm20/launcher2/ui/widget/WeatherWidget.kt index 0140b49e..ae7d94fd 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/widget/WeatherWidget.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/widget/WeatherWidget.kt @@ -81,7 +81,7 @@ fun WeatherWidget() { ) { Text( text = selectedForecast.location, - style = MaterialTheme.typography.h1 + style = MaterialTheme.typography.subtitle1 ) Text( text = convertTemperature( @@ -239,7 +239,7 @@ fun WeatherDaySelector( CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) { Text( text = dateFormat.format(selectedDay.timestamp), - style = MaterialTheme.typography.h2, + style = MaterialTheme.typography.subtitle2, modifier = Modifier .align(Alignment.CenterVertically) .padding(start = 16.dp, end = 8.dp) @@ -279,7 +279,7 @@ fun WeatherDaySelector( CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) { Text( text = dateFormat.format(d.timestamp), - style = MaterialTheme.typography.h2, + style = MaterialTheme.typography.subtitle2, softWrap = false, modifier = Modifier .align(Alignment.CenterVertically) @@ -330,7 +330,7 @@ fun WeatherTimeSelector( CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) { Text( text = dateFormat.format(selectedForecast.timestamp), - style = MaterialTheme.typography.h2, + style = MaterialTheme.typography.subtitle2, modifier = Modifier.align(Alignment.CenterVertically) ) } @@ -356,7 +356,7 @@ fun WeatherTimeSelector( CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) { Text( text = dateFormat.format(fc.timestamp), - style = MaterialTheme.typography.h2, + style = MaterialTheme.typography.subtitle2, softWrap = false, modifier = Modifier .align(Alignment.CenterVertically) diff --git a/ui/src/main/java/de/mm20/launcher2/ui/widget/parts/DatePart.kt b/ui/src/main/java/de/mm20/launcher2/ui/widget/parts/DatePart.kt index c5fedb49..91dcf1df 100644 --- a/ui/src/main/java/de/mm20/launcher2/ui/widget/parts/DatePart.kt +++ b/ui/src/main/java/de/mm20/launcher2/ui/widget/parts/DatePart.kt @@ -9,6 +9,6 @@ import de.mm20.launcher2.ui.component.TextClock fun DatePart() { TextClock( formatFlags = DateUtils.FORMAT_SHOW_WEEKDAY or DateUtils.FORMAT_SHOW_DATE or DateUtils.FORMAT_SHOW_YEAR, - style = MaterialTheme.typography.h2 + style = MaterialTheme.typography.subtitle1 ) } \ No newline at end of file