How do I make this css snippet work for Live Preview edit mode?

How do I make this CSS snippet work in live preview’s edit mode?
As of now it only works in reading mode.

.markdown-preview-view ul > li.task-list-item.is-checked {
    color: var(--text-faint);
}
.checklist-plugin-main .group .compact > .toggle .checked,
.is-flashing input[type=checkbox]:checked,
input[type=checkbox]:checked {
  background-color:var(--text-faint) !important;
  border:1px solid var(--text-faint);
  background-position:center;
  background-size:70%;
  background-repeat:no-repeat;
  background-image:url('data:image/svg+xml; utf8, <svg width="12px" height="10px" viewBox="0 0 12 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-4.000000, -6.000000)" fill="%23ffffff"><path d="M8.1043257,14.0367999 L4.52468714,10.5420499 C4.32525014,10.3497722 4.32525014,10.0368095 4.52468714,9.8424863 L5.24777413,9.1439454 C5.44721114,8.95166768 5.77142411,8.95166768 5.97086112,9.1439454 L8.46638057,11.5903727 L14.0291389,6.1442083 C14.2285759,5.95193057 14.5527889,5.95193057 14.7522259,6.1442083 L15.4753129,6.84377194 C15.6747499,7.03604967 15.6747499,7.35003511 15.4753129,7.54129009 L8.82741268,14.0367999 C8.62797568,14.2290777 8.3037627,14.2290777 8.1043257,14.0367999"></path></g></g></svg>');
}
2 Likes

+1
I’m also looking for a solution to that. :+1:t2:

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.