CSS Fixes Part 2 - Onenote/Evernote Style bulleting

🌈Share & Showcase
5

@Kevin_Murray -it is possible to see if a 1st or 2nd (etc) order item is collapsed or not. I am posting the CSS in the Share~Showcase forum. I will add a link later.

Thank you @Vincent_Tang for your effort. It helped me investigate a methodology for

  • customizing the bullets at any level
    –while also–
  • tracking the tree for allowing to create a visual que on any collapsed bullet, including plus~minus hovering ques.

Concept coding

  • There are two methods I found for identifying “a level”, each with its own limitations.
  • There are two methods I found for identifying/tracking "the “is-parent” (level has children) and “collapsed-or-not” states.
    ISSUE:
    I identified a problem where cascading CSS stopped properly propagating the affect when applying a simple ‘.Node thru .Node’ coding method (as Vincent uses above). I was unable to identify why this happens, the .Nodes cascade logically throughout, and the traversing logic is sound.

Thing is, this broke the is-parent/collapsed states tracking no matter what approach I used.

=========================
THEN (ISSUE 2)…
…I worked the problem by tracking the cascade of nodes via explicit parent element (">") identification of the target nodes.

This worked really well, but then it broke the simplified css code application in the “is-parent/collapsed states” tracking code.

::sigh::
After fiddling with this for way too log a time, what I discovered is that I could use the simplified .Node to .Node traversal code-method (as Vincent does above) for assigning custom bullets to the Levels, and then I used a combination (kludge) of “explicit parent element (”>") identification" with .Node-to-.Node tracking logic and achieved a semblance of explicit level tracking that allows “is-parent/collapsed states” to cascade as deep as you may go.

My CSS skills aren’t what they once were, i.e., a more professional modern-day css coder would likely do better, but the solution is usable now at least.

LIMITATION
At the end of the last “level-defined bullet style” in the CSS code one creates (from what I will post), any levels added in your Dynalist beyond that point have the same bullet icon as that last one in your CSS, but, as mentioned above, the “is-parent/collapsed states” fully cascade …so you can always readily identify is a node has children or not ;^).

You may check out the code here: Readily Identify Any Collapsed Level while also Allowing Custome Bullet-Icons

Cheers.