Hi Saq, That's pretty amazing -- only two little changes and it basically works.
The main difference is the positioning. The original position for the controls would have been over in the margin and would not have affected the wrapping of the items on the toolbar. But the real problem is that the "float right" isn't honoured if the toolbar is suppressed (which you can do down in the settings) So then it ends up looking like (there should be two screenshots here) : Even though the toolbar has been set to "display: none", the cog controls are acting like they're still there. Thanks! On Wednesday, July 22, 2020 at 11:10:19 AM UTC-7, Saq Imtiaz wrote: > > Hi Mark, > > OK I just tested those modifications I mentioned above on Noto and I > believe they accomplish what you need, unless I have misunderstood the > visual design you want. > > Have a look: > https://saqimtiaz.github.io/sq-tw/notowritey.html > > To move the gear icon etc more to the right use > margin-right: -1em; > on the parent. > > I'm not sure what you mean by "popup handle", but the launch button is in >> a div that uses absolute positioning, and the "popup" box uses absolute >> positioning. Are you saying that the absolute positioning interferes with >> "tc-popup-keep" ? > > > Yes, use float:right instead of position:absolute on the div containing > the button that triggers the popup. Then type=popup will position the popup > correctly. > > If you then use the reveal widget with the attributes I posted, the popup > should appear just underneath the button, and to the left. It also will not > close when clicked upon. > > Saq > > On Wednesday, July 22, 2020 at 7:55:57 PM UTC+2, Mark S. wrote: >> >> Hi Saq, >> >> The problem with type="popup" is that it puts the box offscreen and to >> the right. I needed to control where the box goes. Attempting to use >> "aboveright" didn't do anything -- it still put the box "belowleft". The >> problem is that the reveal widget with type="popup" hardcodes the position >> in the style attribute. The technique Eric suggested fixed the problem of >> positioning by not using type="popup" >> >> > I want my popup icon to float in the margin between the tiddler content >> and the edge of the tiddler river. Absolute positioning seemed to be the >> only way I could achieve this. The popup then floats just to the left of >> that. Everything looks nice (well, I'm not very fussy re UI), but now the >> popup wants to close as soon as I enter an edit field inside it. >> >> Thanks! >> >> On Wednesday, July 22, 2020 at 10:12:34 AM UTC-7, Saq Imtiaz wrote: >>> >>> Edited to highlight that you need to use type="popup" >>> >>> <$reveal type="popup" state=<<state-editor-settings>> text="" >>> class="tc-popup-keep" >>> position="belowleft"> >>> >>> >>> On Wednesday, July 22, 2020 at 7:11:28 PM UTC+2, Saq Imtiaz wrote: >>>> >>>> @Mark try this: >>>> >>>> <$reveal type="popup" state=<<state-editor-settings>> text="" >>>> class="tc-popup-keep" >>>> position="belowleft"> >>>> >>>> Make sure the popup handle or its parent div, meaning button in this, >>>> is not using position:absolute. >>>> You can probably use float:right instead. >>>> >>> -- 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 [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/56a418a7-96c5-48bc-894d-cc1bb9849c27o%40googlegroups.com.
