BUG? Icon for Markdown documents

Since the latest update to DEVONthink (3.8.7) icons for plain text documents and markdown documents are the same and not distinguishable any more:
Pasted Graphic

Can you please reset that behaviour?

The icon might be determined by the default app for this file type, which is set in Finder.

DEVONthink indeed gets the icon from the operating system. Otherwise, it renders a thumbnail of the document if Settings > Files > Thumbnails > Markdown is enabled.

Yes, it looks like a MacOS problem as the icons in Finder are corrupt, too. Been searching for a solution since yesterday but nothing worked (clear icon cache, reboot in safe mode, reinstalling the default apps etc.).

Not sure if this will help but worth having a read of this thread:

Re your thumbnails, if you have a CSS for rendering your markdown, the thumbnail will show you the rendered version of the file. E.g. my css makes the background off-white (sort of a parchment colour), which means my thumbnails are easy to spot due to the colour.

That thread described exactly my problem, thanks a lot! Now I activated the Markdown preview in DevonThink. At least Markdowns now look a bit different from plain text icons and that already helps a lot. Would you mind posting the background part from your CSS?

Sure, are you only wanting to put in a CSS style for background colour? That is very simple to do, for background colour you just need:

body {
background-color: #HTMLCOLOURCODE;
}

Where the bit in bold is the colour code for the HTML colour you want. You can view HTML colour codes here. It should be a 6 character alphanumeric code, and you need to preface it with the hashtag. So for example the ivory colour I use is #F5ECCE, so my background colour code looks like this:

body {
background-color: #F5ECCE;
}

Be warned though, once you start tinkering with CSS you’ll fancy changing more variables, and before you know it your CSS stylesheet will be very long and unique :wink:

2 Likes

Those things (background_color, in this case) are attributes, namely of HTML elements. body is an element selector.

CSS variables exist, but they’re something else.

Keeping the terminology clear makes it easier to find and understand related information.

Quite right, thank you for flagging that.

1 Like

I 100% relate to this. :heart:

1 Like

I use a custom CSS for Markdown since DEVONthink offered that option. It was very useful to me to change the format of blockquote parts. Sometimes I format some text in italic inside blockquotes which was not visible because the default DEVONthink CSS displayed blockquotes in italics completely.

I also have heavily styled blockquotes. I get worried about not noticing quotes that aren’t my words (which feature a lot in my notes), so mine are coded into pink boxes with a big quotation mark :joy:

My blockquotes look like this:

Is it intentional that you use justification but not hyphenation? That makes the 2nd line visually unpleasing (I find) because of the huge inter-word spacing. Using
blockquote: { hyphens: auto};
should alleviate that, provided the lang attribute for the document is set correctly. You wouldn’t want English hyphenation with a German text.

I like it. I suppose mine are kind of a similar style to yours, in that we’ve both pulled them out into standalone boxes with a quote mark. Mine look like this (text above is regular text):

[Completely unrelated, but as a dual citizen (British/French) living in the UK I can confirm the doctor situation is as crap as advertised in your quote :roll_eyes: My town no longer has a functioning hospital due to lack of doctors and nurses, so we are now 45 minutes from the nearest hospital that will accept emergencies and referrals. Doesn’t really matter though, the waiting times are so long that any broken bones will probably have already healed by the time you can see a doctor.]

1 Like

Very good point! So I played around with this (using different values for text-align and lang):

blockquote{
  lang: de-*;
  text-align: justify;
  hyphens: auto;
}

but it did not work, no hyphenation is happening (at least not in DEVONthink).

First, lang is not a CSS attribute, you have to set it directly in the MD/HTML file. Unfortunately, DT does not provide for a language setting anywhere (@cgrunenberg?). It should, though, given that lang is considered more or less indispensable nowadays. As is, btw, the dir attribute to indicate writing/reading direction.

Regardless: DT caches style information, so you should restart DT. And Webview, the underlying HTML engine, does definitely support hyphenation. As an aside: Where/how are you defining your styles?

I tried to coerce Safari into using hyphenation: No success. I have no idea what’s wrong with my approach, which works in Firefox. Even the Net thinks that Safari knows about hyphens, so I can’t really tell what’s wrong here.

it looks like Firefox is the only browser that support hyphens for German language (see hyphens - CSS: Cascading Style Sheets | MDN).

Now I tried this in a Markdown document:

<div lang="en" hyphens="auto" align="justify">
Dinosaurs are dangerous creatures and they died several million years ago. Donald Trump knowingly led a dangerously dangerously dangerously dangerously dangerously dangerously dangerous conspiracy to overturn the 2020 election and should be held criminally responsible for the violent attack on the Capitol on Jan. 6, 2021.</>

And again the result returned no hyphenations:

It’s text-align, not align. But when I tried English hyphenation on Safari, it didn’t look very promising, either.

OTOH: I just looked at my blog (Barranco: Lima nutzt die zweite Chance) which is in German. There, I use these settings:

p {
text-align: justify;
-webkit-hyphens: auto;
hyphens: auto;
font-size: 1.15em;
}

and apparently Safari ignores the un-prefixed hyphens (WTF? 2022? They should really get their act together). lang is set to “de-de”, and hyphenation works ok.

it is text-align in CSS, and align in HTML (as used in my example)