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.

Sign up for GitHub

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

Jump to bottom

markdown support ? #6

Closed
shodanx2 opened this issue Sep 13, 2023 · 3 comments
Closed

markdown support ? #6

shodanx2 opened this issue Sep 13, 2023 · 3 comments

Comments

@shodanx2
Copy link

Markdown seems like it would be a great fit for an output format, maybe even "copy to clipboard as markdown", the whole image, or just a selection
@1j01
Copy link
Owner

1j01 commented Sep 19, 2023

Markdown doesn't support color, except when using HTML tags. I actually did try to support Markdown as a read/write format, and that work is on a branch called markdown. For writing, it was just the same as the HTML export except without the boilerplate (<!doctype html>, etc.). For reading, I tried to use Textual's built-in MarkdownViewer component, but I realized it can't actually read the HTML that I was outputting, which made it pretty silly to have around — read and write, but not reading what it can write? Ever seen a program like that? 😆

@shodanx2
Copy link
Author

I am very disappointed that markdown doesn't support color

I want a markdown with colors and sixel support !

I found this discussion

https://stackoverflow.com/questions/35465557/how-to-apply-color-on-text-in-markdown

They suggest using unicode emoji for adding a little color

Like 🔴🟠⚫⚪🟣🟢🟡🔵

They also suggest using CSS ?

<style> r { color: Red } o { color: Orange } g { color: Green } </style>

TODOs:

  • TODO: Important thing to do
  • TODO: Less important thing to do
  • DONE: Breath deeply and improve karma
    // resets
    s { text-decoration:none; } //strike-through
    em { font-style: normal; font-weight: bold; } //italic emphasis

// colors
s { color: green }
em { color: blue }

I don't understand how that would work as I don't understand CSS

Maybe they can be hidden in a collapsible section and still work somehow ?

collapsed section <style> r { color: Red } o { color: Orange } g { color: Green } </style>

TODOs:

  • TODO: Important thing to do
  • TODO: Less important thing to do
  • DONE: Breath deeply and improve karma
    // resets
    s { text-decoration:none; } //strike-through
    em { font-style: normal; font-weight: bold; } //italic emphasis

// colors
s { color: green }
em { color: blue }

@1j01
Copy link
Owner

1j01 commented Jan 13, 2025

Yeah, unfortunately most sites that support markdown don't allow CSS (whether inline or with <style> tags).
And, to be clear, if the <style> tag was working, you wouldn't need to hide it in a collapsed section. It's only because it's not supported that it appears as literal text.

Blogging platforms tend to give you more control over markdown than comments sections, and in that case you could save as .html from Textual Paint, and then copy the content from the saved file, removing boilerplate like <!doctype html>.

However, the best option is really SVG export, because .svg files can often be included as image attachments, in markdown or other rich text comment systems. Also if you open up an SVG file directly you can still select the text and copy and paste from it, unlike a simple screenshot.

And if SVG isn't supported, your best bet is probably a simple screenshot.

Side note: another thing that doesn't work

Perhaps an SVG data URL could work for markdown? I'm not sure how widely that's supported...
Eh, it doesn't work here on GitHub, so it probably won't work other places either.

![image alt text](data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' width='400' height='400'%3E%3Crect width='200' height='200' fill='%23f0f8ff' /%3E%3Ccircle cx='50' cy='50' r='20' fill='%231e90ff' /%3E%3Ccircle cx='150' cy='50' r='20' fill='%231e90ff' /%3E%3Ccircle cx='100' cy='100' r='20' fill='%231e90ff' /%3E%3Ccircle cx='50' cy='150' r='20' fill='%231e90ff' /%3E%3Ccircle cx='150' cy='150' r='20' fill='%231e90ff' /%3E%3Cline x1='50' y1='50' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='150' y1='50' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='50' y1='150' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='150' y1='150' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='50' y1='50' x2='50' y2='150' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='150' y1='50' x2='150' y2='150' stroke='%234682b4' stroke-width='10' /%3E%3C/svg%3E)

<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' width='400' height='400'%3E%3Crect width='200' height='200' fill='%23f0f8ff' /%3E%3Ccircle cx='50' cy='50' r='20' fill='%231e90ff' /%3E%3Ccircle cx='150' cy='50' r='20' fill='%231e90ff' /%3E%3Ccircle cx='100' cy='100' r='20' fill='%231e90ff' /%3E%3Ccircle cx='50' cy='150' r='20' fill='%231e90ff' /%3E%3Ccircle cx='150' cy='150' r='20' fill='%231e90ff' /%3E%3Cline x1='50' y1='50' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='150' y1='50' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='50' y1='150' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='150' y1='150' x2='100' y2='100' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='50' y1='50' x2='50' y2='150' stroke='%234682b4' stroke-width='10' /%3E%3Cline x1='150' y1='50' x2='150' y2='150' stroke='%234682b4' stroke-width='10' /%3E%3C/svg%3E">

@1j01 1j01 closed this as not planned Won't fix, can't repro, duplicate, stale Jan 13, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@1j01 @shodanx2