Thank you for this! I was actually playing around with it to figure out how
to do just this
On Wednesday, December 15, 2021 at 12:25:11 PM UTC-5 Télumire wrote:
> I noticed that when the preview is closed, the toolbar come back to the
> top. This is because Tiddlywiki use two containers, one for the editor
> without the preview, and the second to display the editor with the preview.
>
> If you want the layout to stay the same with and without preview, use this
> :
>
> .tc-dropzone-editor>.tc-reveal,.tc-tiddler-preview{
> display:flex;
> flex-direction:column-reverse;
> }
>
> .tc-tiddler-preview>*
> {
> margin:0!important;
> width:auto!important;
> }
>
> /*optional : prevent scroll bar in the text editor*/
> .tc-edit-texteditor {
> object-fit: contain;
> overflow-y:hidden;
> }
>
>
> And if you want to support the code mirror addon too, use this :
>
> .tc-dropzone-editor>.tc-reveal,.tc-tiddler-preview,
> .tc-edit-tags~.tc-reveal{
> display:flex;
> flex-direction:column-reverse;
> }
>
> .tc-tiddler-preview>p {
> display:contents;
> }
>
> .tc-tiddler-preview>*,.tc-tiddler-preview>p>*{
> margin:0!important;
> width:100%!important;
> }
>
> /*optional : prevent scroll bar in the text editor*/
> .tc-edit-texteditor {
> object-fit: contain;
> overflow-y:hidden;
> }
>
> Le mardi 14 décembre 2021 à 14:36:32 UTC+1, [email protected] a
> écrit :
>
>> perfect! thank you :D
>>
>> On Sunday, December 12, 2021 at 4:48:23 PM UTC-5 Télumire wrote:
>>
>>> You can use this style :
>>>
>>> .tc-tiddler-preview{
>>> display:flex;
>>> flex-direction:column-reverse;
>>> }
>>>
>>> .tc-tiddler-preview>*
>>> {
>>> margin:0!important;
>>> width:100%!important;
>>> }
>>>
>>> In a tiddler with the tag $:/tags/Stylesheet.
>>> Enjoy ! :)
>>> Le samedi 11 décembre 2021 à 11:31:04 UTC+1, [email protected] a
>>> écrit :
>>>
>>>> I'm currently using the very basic version of JD's Mobile plugin, as I
>>>> aim to use my TW from my phone, but I'm not sure what I need to do in
>>>> order
>>>> to achieve what I've mocked up below.
>>>>
>>>> I'd like to just figure out a way to make a separate stylesheet to
>>>> apply these changes without having to make any changes to JD's plugin if
>>>> possible.
>>>>
>>>> any help with this would be greatly appreciated!
>>>>
>>>> [image: Before.PNG][image: After.PNG]
>>>>
>>>
--
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/fdca0615-2c11-4dd6-98d7-63fd6d0806a8n%40googlegroups.com.
