Hi there!
Love the idea of being able to use BuJo-style lists on Obsidian, so far the plugin has been very useful.
I noticed a minor inconvenience with it however, where the signifiers are not coloured in live preview mode.
To reproduce:
- create a new sandbox vault
- install the "BuJo Bullets" community plugin (v 1.2.1)
- open a new note, start typing:
- ! signifier on a list item
- [ ] ? signifier on a checkbox
What I expected: the two signifiers ! and ? should appear red (it's the --text-error color for the default theme).
What I see: the signifiers stay black.
If however I toggle the reading view, I can see the signifiers turn red.
(Toggling back to live view, the signifiers are black again.)
It would be nice if signifiers were more prominent in live view mode (especially since I'd guess most users will often use a BuJo-like page in live view: pretty, but easily editable).
I noticed a couple things that looked weird to me and that I thought I'd mention too:
- In reading view, the
<span class="bujo-bullet-signifier"> wrapper is wrapped twice around the signifier:
<span class="bujo-bullet-signifier"><span class="bujo-bullet-signifier">?</span></span>
- I think this piece of code generates duplicates:
|
const renderedNotes = element.findAll('ul > li') |
|
const renderedCheckboxes = element.findAll('.task-list-item') |
|
const renderedBullets = [...renderedNotes, ...renderedCheckboxes] |
The task-list-item class is applied on <li> tags. As a result, the items in renderedCheckboxes were also included in renderedNotes, making renderedBullets contain all checkbox items twice. (This is probably what causes the double wrapping I mentioned above.) A more correct way would be, I think, to write the following:
// const renderedNotes = // not needed anymore
const renderedCheckboxes = element.findAll('.task-list-item')
const renderedBullets = element.findAll('ul > li')You might also want to rely on the has-list-bullet class placed on the ul tag (eg. using the CSS selector 'ul.has-list-bullet > li'), though I'm not 100% sure about how that class is used by Obsidian.
I don't think these two things are related to the live preview thing, but it's worth mentioning since they're in a the same code area.
Would be nice if we could get a pretty live view of signifiers!
Hi there!
Love the idea of being able to use BuJo-style lists on Obsidian, so far the plugin has been very useful.
I noticed a minor inconvenience with it however, where the signifiers are not coloured in live preview mode.
To reproduce:
What I expected: the two signifiers
!and?should appear red (it's the--text-errorcolor for the default theme).What I see: the signifiers stay black.
If however I toggle the reading view, I can see the signifiers turn red.
(Toggling back to live view, the signifiers are black again.)
It would be nice if signifiers were more prominent in live view mode (especially since I'd guess most users will often use a BuJo-like page in live view: pretty, but easily editable).
I noticed a couple things that looked weird to me and that I thought I'd mention too:
<span class="bujo-bullet-signifier">wrapper is wrapped twice around the signifier:obsidian-bujo-bullets/src/index.ts
Lines 34 to 36 in 46eb512
The
task-list-itemclass is applied on<li>tags. As a result, the items inrenderedCheckboxeswere also included inrenderedNotes, makingrenderedBulletscontain all checkbox items twice. (This is probably what causes the double wrapping I mentioned above.) A more correct way would be, I think, to write the following:You might also want to rely on the
has-list-bulletclass placed on theultag (eg. using the CSS selector'ul.has-list-bullet > li'), though I'm not 100% sure about how that class is used by Obsidian.I don't think these two things are related to the live preview thing, but it's worth mentioning since they're in a the same code area.
Would be nice if we could get a pretty live view of signifiers!