0
1

[–] wouldntsavezion 0 points 1 points (+1|-0) ago  (edited ago)

Hey, nice theme and sub and yeah. I toyed with it a bit ; I totally hate these headers and that huge sidebar I barely ever use, so I got them out of the way.

body{
  overflow-x: hidden;
}

#container{
  display: table-row;
}

.content{
  width: calc(100% - 64px);
  transition: width 0.25s ease-in-out;
}

.side{
  position: absolute;
  right: -300px;
  transition: right 0.25s ease-in-out;
  margin-bottom: 64px;
}

.side:hover{
  position: absolute;
  right: -10px;
}

.side:hover + style + .content{
  width: calc(100% - 364px);
}

.side:before{
  content: "«";
  font-size: 1.5em;
  padding: 8px 16px;
  width: 32px;
  height: calc(100% + 2px);
  background: inherit;
  position: absolute;
  left: -25px;
  top: -1px;
  border-radius: 1em 0 0 1em;
}

Tell me what you think !

0
0

[–] Azo [S] 0 points 0 points (+0|-0) ago 

That's brilliant, I love minimal CSS, it really helps with readibility and content. That's a good bit of CSS to inject for everyone who likes this stuff.

On my browser If the sidebar has more content than the subverse, the content will get chopped vertically to fit the height of the links. Changing the sidebar from absolute to fixed aleviates the chopping problem but it overflows the browser window.

If you want to share with the subverse make a post, it's a great snippet!

[–] [deleted] 0 points 0 points (+0|-0) ago  (edited ago)

[Deleted]

0
0

[–] wouldntsavezion 0 points 0 points (+0|-0) ago  (edited ago)

Since it's pretty general I already posted it on /v/CustomizingVoat ;

I'll check that issue out.

EDIT: I changed the code, try this out (It's no longer adapted for your theme, removed the borders and such, it's more universal this way.)

The fix involved using a table-row display which also forces the content to always be 100% of the width, regardless of the user zoom.

Which is f***ing gorgeous.

EDIT: Seems to be having issues with the defaul theme. For some reason it works here but not with the default one. I can't see what in your css would make it work, is that 100% of what's used here ?

EDIT: Well what's here works with VSS and it's sublime ; I updated my post on /v/CustomizingVoat but I can't get the same efficiency with the default theme, the header kind of has to be fixed for some reason. It's wierd.