Customizable fonts

[SankethBK]

Currently, static fonts are used throughout the app. An option to customize font family and font size in the settings page should be provided. When user changes font family / size, it can be stored in lib/features/auth/data/models/user_config_model.dart class. UserConfigModel will be persisted in shared preferences

[soam1]

@SankethBK I would like to do that customization of the font family or size, and store it in shared preferences. Please assign me this issue in hacktoberfest.

[SankethBK]

Sure, instead of storing it directly in shared preferences, i'd recommend using UserConfigModel where we store all the user settings. Add two new fields like preferredFontSize and preferredFontFamily and use UserConfigCubit to interact with it

[SankethBK]

Adding more details

1. Create an accordion "Font Customization" which has two dropdowns for Font size and Font style

font_customization.webm

2. Add two new fields like preferredFontSize and preferredFontFamily in UserConfigModel to store the values of these dropdowns and use UserConfigCubit to interact with it

3. Apply preferredFontSize and preferredFontFamily only for text at these places a. title and plainText in NotePreviewCard. b. title in NoteTitleInputField c. title in NotesReadOnlyPage. d. DefaultTextStyle in GlassPaneForEditor and ReadOnlyEditor.

[SankethBK]

@soam1 please confirm if you're working on this

[soam1]

@SankethBK really sorry for the delay, i got ill; I am working and will not disappoint you

[SankethBK]

@soam1 No worries, I was just checking up. Thanks for confirming. Take care.

[nandhagobal]

hi @SankethBK what are the font size of small, medium and large?

[SankethBK]

Hi @nandhagobal, we need to apply fontSize and fontFamily at only these places

Apply preferredFontSize and preferredFontFamily only for text at these places
a. title and plainText in NotePreviewCard.
b. title in NoteTitleInputField
c. title in NotesReadOnlyPage.
d. DefaultTextStyle in GlassPaneForEditor and ReadOnlyEditor.

The problem is we are using different font sizes at different places. Give me some time, i'll simplify the issue

[nandhagobal]

sure @SankethBK .i already understood partially.let me know once it is done, i will take this issue.

[nandhagobal]

hi @SankethBK, you said you will simplify this issue. i have implemented this font customization but that font size is not changing for notes(defaultTextStyle widget) section in both read mode and write mode.

[SankethBK]

Hi @nandhagobal , sorry couldn't prioritize this. Can you raise the PR with your current changes, I'll check and let you know

[nandhagobal]

yeah sure.

[ChiefMikeK]

:shipit:

I'm unshure as to how you could to create a monospaced text in a single note, and then sync it to another device🤔

[SankethBK]

Hi @ChiefMikeK , font is used as one of the attributes of rich text, we store rich text in delta format. For example if your note has two different fonts like

Hello (in monospace) World (in Roboto)

It would be internally represented as something like this

[{"text": "Hello", "attributes": {"font-family": "Monospace"}}, 
{"text": "World", "attributes": {"font-family": "Roboto"}}]

Font-family is just one of the many properties along with bold, italics, underline, etc.

This feature is almost ready, I'll add it in next release

[SankethBK]

This feature is added in the lastest release