fix: text overflow issue of font family dropdown (#3348)

* fixed text overflow issue of font family dropdown

* added tooltip delay

* code review fixes: unwanted key removed; tooltip added for all fonts;
delay time reduces;

* Update frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_appearance/font_family_setting.dart

---------

Co-authored-by: Lucas.Xu <lucas.xu@appflowy.io>
This commit is contained in:
Aslam 2023-12-21 07:01:37 +05:30 committed by GitHub
parent 6ecc3c9076
commit 366e28752c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -173,37 +173,43 @@ class _FontFamilyDropDownState extends State<FontFamilyDropDown> {
TextStyle style,
) {
final buttonFontFamily = parseFontFamilyName(style.fontFamily!);
return SizedBox(
key: UniqueKey(),
height: 32,
child: FlowyButton(
key: Key(buttonFontFamily),
onHover: (_) => FocusScope.of(context).unfocus(),
text: FlowyText.medium(
parseFontFamilyName(style.fontFamily!),
fontFamily: style.fontFamily!,
),
rightIcon:
buttonFontFamily == parseFontFamilyName(widget.currentFontFamily)
? const FlowySvg(
FlowySvgs.check_s,
)
: null,
onTap: () {
if (widget.onFontFamilyChanged != null) {
widget.onFontFamilyChanged!(style.fontFamily!);
} else {
final fontFamily = style.fontFamily!.parseFontFamilyName();
if (parseFontFamilyName(widget.currentFontFamily) !=
buttonFontFamily) {
context.read<AppearanceSettingsCubit>().setFontFamily(fontFamily);
context
.read<DocumentAppearanceCubit>()
.syncFontFamily(fontFamily);
return Tooltip(
message: buttonFontFamily,
waitDuration: const Duration(milliseconds: 150),
child: SizedBox(
key: ValueKey(buttonFontFamily),
height: 32,
child: FlowyButton(
onHover: (_) => FocusScope.of(context).unfocus(),
text: FlowyText.medium(
parseFontFamilyName(style.fontFamily!),
fontFamily: style.fontFamily!,
),
rightIcon:
buttonFontFamily == parseFontFamilyName(widget.currentFontFamily)
? const FlowySvg(
FlowySvgs.check_s,
)
: null,
onTap: () {
if (widget.onFontFamilyChanged != null) {
widget.onFontFamilyChanged!(style.fontFamily!);
} else {
final fontFamily = style.fontFamily!.parseFontFamilyName();
if (parseFontFamilyName(widget.currentFontFamily) !=
buttonFontFamily) {
context
.read<AppearanceSettingsCubit>()
.setFontFamily(fontFamily);
context
.read<DocumentAppearanceCubit>()
.syncFontFamily(fontFamily);
}
}
}
PopoverContainer.of(context).close();
},
PopoverContainer.of(context).close();
},
),
),
);
}