TW5: How to move the sidebar from the right side to the left

[Jared Sackett]

Hi

Is there a way to simply move the sidebar from the right to the left? I'd really rather not have to completely reconstruct the main sidebar from scratch, and I don't like having both a right and a left sidebar. I was reading a thread where someone constructed a new sidebar, called the LeftBar, but that's a seperate thing from the normal right sidebar. The topbar was nice too, but I never figured out how to customize it, and it was a bit clunky (especially when there would be popups appearing underneath it instead of below it.

Thanks a bunch!
Jared

[Diego Mesa]

Hello - did you ever figure this out?

Thanks

[Arlen Beiler]

Just checked here. It's just a matter of switching the sidebar from right to left in the css. The story river needs to be moved as well. Sorry, that's obvious from an end user standpoint, but I mean that in CSS terms. 

Apparently the CSS for that is around line 750 in $:/themes/tiddlywiki/vanilla/base

I'm sure you'll have some tweaking to do. But that looks like the way you would do it.

--
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+unsubscribe@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/6ddeb404-ad6d-4a6a-a8cc-00fe9adc428c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Birthe C]

I tried that long ago. I just upgraded and cleaned out at least most of my notes. Find it here: http://leftie.tiddlyspot.com/

Hope you will get some ideas,
Birthe

[Sylvain Naudin]

Hello,

You can check Riz work here with a ready to use json : https://tesseract-index.bitbucket.io/UI/leftsidebar.html


Cheers,
Sylvain

[Khalfani Wadlington]

That link is broken. It is moved to here  https://ibnishak.github.io/Tesseract/UI/leftsidebar.html

Download the json file I attached and drag it into your wiki like any other tiddler

Or copy this and write it in a json file then drag that to the tiddler.

[
    {
        "created": "20170108111615683",
        "text": ".tc-sidebar-scrollable {\n\tposition: fixed;\n\ttop: 0px;\n\tleft: 0;\n\tbottom: 0;\n\tmargin: 0 0 0 10px;\n\tpadding: 70px 0 28px 40px;\n}\n.tc-story-river {\n\tleft: 340px;\n\tbackground: #F4F4F4;\n\twidth: calc(100% - 400px);\n}\n<$reveal state=\"$:/state/sidebar\" type=\"match\" text=\"no\">\n.tc-story-river {\n\tleft: 0px;\n        width:100%;\n}\n</$reveal>\n",
        "title": "$:/tesseract/LeftSidebar",
        "tags": "$:/tags/Stylesheet",
        "modified": "20170118131732168"
    },
    {
        "created": "20170118132617891",
        "title": "$:/core/ui/TopBar/menu",
        "text": "<$reveal state=\"$:/state/sidebar\" type=\"nomatch\" text=\"no\">\n<$button set=\"$:/state/sidebar\" setTo=\"no\" tooltip={{$:/language/Buttons/HideSideBar/Hint}} aria-label={{$:/language/Buttons/HideSideBar/Caption}} class=\"tc-btn-invisible\">{{$:/core/images/chevron-right}}</$button>\n</$reveal>\n<$reveal state=\"$:/state/sidebar\" type=\"match\" text=\"no\">\n<$button set=\"$:/state/sidebar\" setTo=\"yes\" tooltip={{$:/language/Buttons/ShowSideBar/Hint}} aria-label={{$:/language/Buttons/ShowSideBar/Caption}} class=\"tc-btn-invisible\">{{$:/core/images/chevron-left}}</$button>\n</$reveal>\n",
        "modified": "20170118132617891",
        "tags": "$:/tags/TopLeftBar"
    }
]

Note this guy has a ton of other tiddlywiki plugins here

https://ibnishak.github.io/Tesseract/

[Khalfani Wadlington]

Note: When you move the sidebar  you should change the tiddler width to fill the extra space.

You can find this setting under Appearance --> Theme Tweaks  and scroll down to Sizes

There is a setting called "Tiddler width" I set it to 920px

[TonyM]

Khalfani,

Thanks for sharing this, simple but useful option. Its something I would like to have in the standard distribution, with a toggle. 

The fact is a lot of us have wide screen computers now so I would be nice if we could introduce a custom sidebar to either (or both) sides, 

in addition to choosing how the tiddlywiki sidebar appears, something which a sophisticated wiki may want to hide altogether and emulating a regular website

If you feel confident making such a thing please contribute more

Love your work

Tony