Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Custom CSS inconsistently applied to HTML notes #9570

Closed
personalizedrefrigerator opened this issue Dec 20, 2023 · 4 comments
Closed

Custom CSS inconsistently applied to HTML notes #9570

personalizedrefrigerator opened this issue Dec 20, 2023 · 4 comments
Labels
bug It's a bug stale An issue that hasn't been active for a while...

Comments

@personalizedrefrigerator
Copy link
Collaborator

personalizedrefrigerator commented Dec 20, 2023

Operating system

Linux

Joplin version

2.13.9

Desktop version info

Joplin 2.13.9 (prod, linux)

Client ID: 24b2a961cccf40fe8448cdc0930b6fce
Sync Version: 3
Profile Version: 44
Keychain Supported: No

Revision: 1bbec44

Freehand Drawing: 2.7.1
RevealJS Integration: 0.6.1
Simple Backup: 1.3.4
Work tracker: 0.0.1

Current behaviour

  1. Add custom CSS
  2. Open an HTML note
  3. Compare rendered version to a markdown note with the same content
  4. Re-open the HTML note
  5. Switch to the rich text editor
  6. Open a markdown note
  7. Switch back to the rich text editor

Currently, custom CSS is only applied after switching from a markdown note to an HTML note (rich text editor).

Edited: Edited to reflect that custom CSS sometimes loads.

Expected behaviour

  • Custom CSS should be applied to HTML notes consistently.

Logs

No response

@personalizedrefrigerator personalizedrefrigerator added the bug It's a bug label Dec 20, 2023
@laurent22
Copy link
Owner

It was enabled before but later disabled because it caused too many conflicts with the html's own css.

In general html notes come from web pages which are all very different, so trying to apply a uniform style to all of them is not doable. You can imagine for example a div with a black background, and a css that forces the font to be black too, making the text unreadable

@personalizedrefrigerator
Copy link
Collaborator Author

personalizedrefrigerator commented Dec 21, 2023

This was originally requested on the forum, for Evernote imports: https://discourse.joplinapp.org/t/feature-request-use-custom-css-userstyle-css-in-evernote-notes-imported-as-html-shown-in-iframe/34531/7.

(I'm unsure why users are importing as HTML instead of as markdown).

You can imagine for example a div with a black background, and a css that forces the font to be black too, making the text unreadable

As custom CSS is set by the user, we could add an additional class to <html> in the markdown viewer (e.g. markdown-viewer. Users could then write custom CSS similar to the following:

:root.markdown-viewer {
    /*Styles to apply to markdown only*/
}

As such, it should be possible to support this (and allow users to have different custom CSS for HTML and markdown notes).

Currently custom CSS is only sometimes applied (in the rich text editor after switching from a markdown note, presumably because state is not being cleared). I've updated the issue to reflect this.

@personalizedrefrigerator personalizedrefrigerator changed the title Custom CSS not loading in HTML notes Custom CSS inconsistently applied to HTML notes Dec 21, 2023
Copy link
Contributor

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? If you require support or are requesting an enhancement or feature then please create a topic on the Joplin forum. This issue may be closed if no further activity occurs. You may comment on the issue and I will leave it open. Thank you for your contributions.

@github-actions github-actions bot added the stale An issue that hasn't been active for a while... label Jan 20, 2024
Copy link
Contributor

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, feel free to create a new issue with up-to-date information.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug It's a bug stale An issue that hasn't been active for a while...
Projects
None yet
Development

No branches or pull requests

2 participants