memspace / zefyr

Soft and gentle rich text editing for Flutter applications.
https://zefyr-editor.gitbook.io
2.22k stars 550 forks source link

Added inline code formatting #534

Closed Amir-P closed 3 years ago

pulyaevskiy commented 3 years ago

Can I ask you to merge latest 1.0-dev and resolve conflicts? Wanted to check it out locally but it seems to be based on a pretty old version of the dev branch.

Amir-P commented 3 years ago

Done @pulyaevskiy .

Amir-P commented 3 years ago

LGTM, but I noticed that if inline code is used on a heading it results in a very ugly layout...

We might want to make inline code fontSize be a fraction of the line's own fontSize... or not set it at all so that it inherits the size.

WDYT?

We could merge it as it is now, but we'll likely have a breaking change to address when we figure out how to fix this issue.

Or we can brainstorm a little bit how to make inline code's font size scale with the line's own font size?

Let me know if you have any ideas.

I think the easiest way would be to not set font size. If we set a fraction then we need to provide a way for user to customize it too. I'm okay with not setting font size for now until we come up with better solution.

WDYT? @pulyaevskiy

pulyaevskiy commented 3 years ago

I think the easiest way would be to not set font size. If we set a fraction then we need to provide a way for user to customize it too. I'm okay with not setting font size for now until we come up with better solution.

Yeah, this works for me.

I better long term approach would be to add inlineCode style to

  1. ZefyrThemeData, this style would define the default theme for inline code, this must always be defined an a theme.
  2. TextBlockTheme, any inline code style set here will override the default from (1), can be null. We can specify inline code appearance for any block/line type this way, including headings.

There is a bit of an issue that there will also be a way to specify inline code theme for codeblocks, but it'll really not have any effect. But I think it's fine, as long as we document this exception properly.

For now, it's ok not to set fontSize at all.

Oh, one more thing, When we introduce theming for inline code it would be nice for it to be a custom Dart class which only provides TextStyle for now. E.g.

class InlineCodeTheme {
  final TextStyle style;
  // etc...
}

The reason is that I'd eventually like to be able to customize inline code with background color, padding and some border decorations, similar to how github does it. And to avoid a breaking change it'd be nice to model it this way from the start.