FeatureRequest - change colour of text inside code block
Closed this issue · 21 comments
It would be nice to be able to change the colour of the text inside the codeblock - to overwrite syntax highlighting if desired
I want to use code blocks in some cases for copy+pasting only and want a specific colour of the text
Unless there is something I'm missing in the settings that it can be done already
No, that is not possible currently. How would you want to overwrite the color exactly? For whole code blocks? or just specific lines? Let's say, you define a color yellow, for code blocks with a code block language "abcd". This would mean, that every code block with this language defined will have it's text colored to yellow. Is this what you mean?
Exactly! yeah like in previous note tools, I like to use light green for text with commands to paste into console.
I would like to have a code block that then just the text is green. Currently we can edit all aspects of the code block except controlling the colour of the text within it
ok, I just didn't know if you wanted specific lines or the whole text in the code block. But the whole text is easier to implement :) I will look into it, because I am not sure what happens if you define colors for a language, which applies syntax highlighting. I look into, and get back to you.
hey @mugiwara85, do you think this is possible?
Yes, I think, it will work. I will start to work on it at this weekend.
hey man, any progress on this one?
Yeah, I am working on it. I think it will be ready on the weekend in worst case
hi, I just pushed it. It is not yet released, but you can just take the main.js file, and overwrite yours with it. In the "Language specific colors" tab you can now select "codeblock textcolor" and set a color. However, I just realized, that there is no way to set the colors for code blocks without a language specified. I have to add that as well.
Please test it and give a feedback! Thanks!
I really like it thank you!
Is there a way for the colours to also show when in editing mode? I only see it applying in reading mode
I have the setting enabled "Enable plugin in source mode", and I can see the codeblock border colours in editing mode for example but not the changes to the text colour
Hmm. It should apply to editing view as well.
Could you check in the console please, if you get any errors?
weird I dont see any errors in the console
and then when I switch to reading mode:
That's interesting.
It works on my machine
Could you send me your data.json file from your vault folder inside the plugins folder?
data.json
thanks for taking a look. I have saved my custom settings as theme with name Daniel
yeah, no problem. That's why I wanted you to test it.
But interestingly it is still green on my machine:
Could you please check in the inspector, if you select one line, which should be colored, and then check if the marked style is applied to cm-hmd-codeblock? Or if it is even applied at all? Probably not, and that's the problem. The question is why? The line should have the class codeblock-customizer-languageSpecific-credential (credential or run, or what language you specified)
huh yeah its crossed out in the source view weird
and then if i look in the reading view, its not crossed out
ah ok. So it is applied, but something overwrites it. What Obsidian Theme are you using? Maybe that causes the problem.
ah yeah I am using the Atom theme, if I change to default it works perfectly :(
I guess I have to try tweak something with Atom theme, thanks for helping me troubleshoot. I'll close the issue I guess
No, don't worry. I just have to add the !important flag, and then it will work :). I push it in a few seconds
I pushed it. Take the main.js, and it should work now, but please give a feedback :)
wohoo it works! you're an absolute legend
Glad I could help :)