How to remove strikethrough for checkboxes?

Help
1

After updating to 0.8.14, I found that the checkboxes have been modified, added a strikethrough and looked more muted. However, I use checkboxes for answers of questions rather than to-do lists. It seems weird to strikethrough the right answer, for example

image
image1430Ă—417 46.9 KB

Is it possible that I can restore the old checkboxes style???

4 Likes
2

Put this in obsidian.css:

.markdown-preview-view ul > li.task-list-item.is-checked {
  text-decoration:none;
  color:var(--text-normal);
}

.markdown-preview-view ol > li.task-list-item.is-checked {
  text-decoration:none;
  color:var(--text-normal);
}
20 Likes
3

Thanks a lot @conname , I was also looked for this. :pray:

4

It works for me!!! Thanks a lot!!

5

Works like a charm. Thanks a lot @conname !

6

where is obsidian.css i can’t find it

7

Hi jack, the method described above has changed. It’s recommended now to put your custom CSS files into .obsidian/snippets and then activate them in the Settings->Appearance page.

More info here: Add custom styles

8

i’m not great with this stuff where is that?

9

The easiest way to get to the folder where your CSS files go is to:

  1. Go to Settings → Appearance.
  2. click the folder icon, and put your CSS file in the folder that opens up.
  3. Click the “Refresh” button to make your new file appear in Obsidian.
  4. Activate the CSS file by clicking the toggle button next to the name.

image
image783Ă—835 98.7 KB

2 Likes
10

how do I turn this code into a CSS file?

11

Open your favorite text editor (for example, “Notepad” if you’re using Microsoft Windows), and paste the text into the editor. Then click File → Save As, and save it into the vault/.obsidian/snippets directory as a file ending with “.css”, for example “checkboxes.css”.

1 Like
12

this code doesn’t seem to be working for me

13

should it still work on mac if not how could i modify it to work there if not why else could it not be working?

14

i figured it out i accidentally added some extra characters to the word i fixed the problem thanks for your help craig

1 Like
15

Based on this code, is it possible to strike through checked tasks in edit mode?

2 Likes
16

Unfortunately, I don’t think it’s possible to style completed checklist text in edit mode.

In preview mode, the task text has a CSS tag marking it as completed, “task-list-item-is-checked”:

image
image718Ă—415 20.1 KB

However in edit mode, it is simply marked as a list item “cm-list-1”:

image
image734Ă—432 22 KB

Because there’ no class or id that marks this as a completed task in edit mode, it looks to me like there’s nothing to target with CSS, so there’s no way to style it.

I hope someone can prove otherwise!

Hope this helps,

Craig

1 Like
17

Thanks a lot for the detailed explanations!

I was hoping that maybe checked tasks in edit mode can display like what a strikethrough command can do.

18

If anyone is looking to remove strikethroughs on checked boxes in the new live preview editing mode, using this as a snippet like above worked for me:

.markdown-source-view.mod-cm6 .HyperMD-task-line[data-task]:not([data-task=" "]) {
    text-decoration:none;
    color: var(--text-normal);
}
22 Likes
19

This works for me as well (v.0.13.19), thanks!

20

thanks a lot