I love how compact this code is, and how it relies on nothing other than css!
Some kind of visible "affordance-cue" seems needed, to invite the hovering. Very slightly tweaked (without any delay), I like: ``` <style> .pop div {display:none; ; background-color:#ffd;} .pop:hover {background-color:#ffa; border-right: 6px solid #ffa;} .pop:hover div {display:block;} </style> <$list filter="[tag[Articles]]"> <div class="pop" style="border-top: 6px solid #ffd; border-left: 6px solid #ffd;"> {{!!title}} <div style="border-left:2em solid #ffa; padding-left:1em; max-height:100px;overflow:auto;"> <$transclude mode="block"> </div></div> </$list> ``` On Thursday, June 29, 2023 at 12:12:50 AM UTC-4 Charlie Veniot wrote: > Nothing revolutionary here. Just the result of some goofing around with > CSS. > > Give it a spin at TiddlyWiki.com. > > ```` > <style> > .ch1 div {display:none;} > .ch1:hover {background-color:#F5F5F5;border:1px solid gray;} > .ch1:hover div {display:block;} > </style> > > <$list filter="[tag[Articles]]"> > <div class="ch1"> > {{!!title}}<br> > <div style="max-height:100px;overflow:auto;"> > <$transclude mode="block"> > </div> > </div> > </$list> > ``` > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/637f5745-6eee-409a-9543-c31e22ecb3bcn%40googlegroups.com.