LYDR3X
I am the founder and maintainer of Moccato and I created this style. The style of my forum is a large set of rules working together. It was a lot of customizing necessary to achieve this look.
The way I moved the sidebar to the right is certainly not the only way of doing it, probably nxta's approach is a more elegant one. But I can show you how I did it (not the whole thing, just the first steps).
Start with moving the sideNav bar to the right:
.sideNavContainer {
display: block;
}
.IndexPage-nav:not(.TagsPage-nav),
.DiscussionPage-nav,
.UserPage-nav {
float: right;
width: 8.5vw;
}
.IndexPage-nav:not(.TagsPage-nav) > ul > li,
.DiscussionPage-nav > ul > li,
.UserPage-nav > ul > li {
margin-left: -60px;
}
Note: I have disabled the display: flex of the .sideNavContainer replacing it with old school block. Furthermore I adressed only certain types of sideNav: .IndexPage-nav (except .TagsPage-nav),
.DiscussionPage-nav and .UserPage-nav. The width of the sideNav is a combination of fixed values (-60px) and relative values (8.5vw).
Then provide the div with the results space on the right side, again a combined effect of padding (fixed value) and margin (relative value):
.sideNavOffset {
padding-right: 100px;
margin-right: 12vw;
}
Et voilà, doesn't look too bad... but it's just a start.
