github-mirrors/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2025-04-24 14:47:13 -04:00
Code Issues Projects Releases Packages Wiki Activity

feat: add shadow tokens (#7726)

Browse source
This commit is contained in:
Richard Shiue 2025-04-11 11:14:28 +08:00
parent 64a2d2de32
commit 6d45c20153
3 changed files with 62 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

40
frontend/appflowy_flutter/packages/appflowy_ui/lib/src/theme/data/builder.dart
View file

@ -8,6 +8,7 @@ import 'package:appflowy_ui/src/theme/color_scheme/icon/icon_color_theme.dart';
import 'package:appflowy_ui/src/theme/color_scheme/surface/surface_color_scheme.dart';
import 'package:appflowy_ui/src/theme/color_scheme/text/text_color_scheme.dart';
import 'package:appflowy_ui/src/theme/dimensions.dart';
import 'package:appflowy_ui/src/theme/shadow/shadow.dart';
import 'package:appflowy_ui/src/theme/spacing/spacing.dart';
import 'package:flutter/material.dart';
@ -321,4 +322,43 @@ class AppFlowyThemeBuilder {
xxl: AppFlowySpacingConstant.spacing600,
);
}
AppFlowyShadow buildShadow(
Brightness brightness,
) {
return switch (brightness) {
Brightness.light => AppFlowyShadow(
small: [
BoxShadow(
offset: Offset(0, 2),
blurRadius: 16,
color: Color(0x1F000000),
),
],
medium: [
BoxShadow(
offset: Offset(0, 4),
blurRadius: 32,
color: Color(0x1F000000),
),
],
),
Brightness.dark => AppFlowyShadow(
small: [
BoxShadow(
offset: Offset(0, 2),
blurRadius: 16,
color: Color(0x7A000000),
),
],
medium: [
BoxShadow(
offset: Offset(0, 4),
blurRadius: 32,
color: Color(0x7A000000),
),
],
),
};
}
}

11
frontend/appflowy_flutter/packages/appflowy_ui/lib/src/theme/data/data.dart
View file

@ -8,6 +8,7 @@ import 'package:appflowy_ui/src/theme/color_scheme/icon/icon_color_theme.dart';
import 'package:appflowy_ui/src/theme/color_scheme/surface/surface_color_scheme.dart';
import 'package:appflowy_ui/src/theme/color_scheme/text/text_color_scheme.dart';
import 'package:appflowy_ui/src/theme/data/builder.dart';
import 'package:appflowy_ui/src/theme/shadow/shadow.dart';
import 'package:appflowy_ui/src/theme/spacing/spacing.dart';
import 'package:appflowy_ui/src/theme/text_style/text_style.dart';
import 'package:flutter/material.dart';
@ -35,6 +36,8 @@ abstract class AppFlowyBaseTheme {
AppFlowySpacing get spacing;
AppFlowyShadow get shadow;
AppFlowyBrandColorScheme get brandColorScheme;
}
@ -70,6 +73,7 @@ class AppFlowyThemeData extends AppFlowyBaseTheme {
final brandColorScheme = themeBuilder.buildBrandColorScheme(colorScheme);
final borderRadius = themeBuilder.buildBorderRadius(colorScheme);
final spacing = themeBuilder.buildSpacing(colorScheme);
final shadow = themeBuilder.buildShadow(Brightness.light);
return AppFlowyThemeData(
colorScheme: colorScheme,
@ -82,6 +86,7 @@ class AppFlowyThemeData extends AppFlowyBaseTheme {
surfaceColorScheme: surfaceColorScheme,
borderRadius: borderRadius,
spacing: spacing,
shadow: shadow,
brandColorScheme: brandColorScheme,
);
}
@ -116,6 +121,7 @@ class AppFlowyThemeData extends AppFlowyBaseTheme {
final brandColorScheme = themeBuilder.buildBrandColorScheme(colorScheme);
final borderRadius = themeBuilder.buildBorderRadius(colorScheme);
final spacing = themeBuilder.buildSpacing(colorScheme);
final shadow = themeBuilder.buildShadow(Brightness.dark);
return AppFlowyThemeData(
colorScheme: colorScheme,
@ -128,6 +134,7 @@ class AppFlowyThemeData extends AppFlowyBaseTheme {
surfaceColorScheme: surfaceColorScheme,
borderRadius: borderRadius,
spacing: spacing,
shadow: shadow,
brandColorScheme: brandColorScheme,
);
}
@ -141,6 +148,7 @@ class AppFlowyThemeData extends AppFlowyBaseTheme {
required this.surfaceColorScheme,
required this.borderRadius,
required this.spacing,
required this.shadow,
required this.brandColorScheme,
required this.iconColorTheme,
required this.backgroundColorScheme,
@ -175,6 +183,9 @@ class AppFlowyThemeData extends AppFlowyBaseTheme {
@override
final AppFlowySpacing spacing;
@override
final AppFlowyShadow shadow;
@override
final AppFlowyBrandColorScheme brandColorScheme;

11
frontend/appflowy_flutter/packages/appflowy_ui/lib/src/theme/shadow/shadow.dart Normal file
View file

@ -0,0 +1,11 @@
import 'package:flutter/widgets.dart';
class AppFlowyShadow {
AppFlowyShadow({
required this.small,
required this.medium,
});
final List<BoxShadow> small;
final List<BoxShadow> medium;
}