is there a method of applying css to the .tc-edit-texteditor? I've tried a
few different ways to do that, but I can't seem to get anything to work,
only with the other scrollbars.
having the scrollbars hidden does look nice, but doesn't allow me to scroll
with the mousewheel unfortunately.
On Friday, January 7, 2022 at 4:20:16 AM UTC-5 Justin H. wrote:
> 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/6f8a3cda-ee26-48c7-9521-42ff92275dd1n%40googlegroups.com.
