naturalcrit / homebrewery

Create authentic looking D&D homebrews using only markdown
https://homebrewery.naturalcrit.com
MIT License
1.07k stars 326 forks source link

Increasing number of columns #235

Closed dmmagic closed 7 years ago

dmmagic commented 7 years ago

I'd like to be able to increase the number of columns and have control over their width. Is there any easy way of doing this?

dmmagic commented 7 years ago

Ah ha! I found the CSS file (https://github.com/stolksdorf/homebrewery/blob/master/phb.standalone.css) and with it I've been able to do all sorts of amazing things. Looks like you can increase the number of columns by changing the column-count. For example:

.phb {
  column-count: 4;
  } 

If the page size is edited to be large enough, the extra columns show. This piece of code has done what I want:

.phb {
  width: 16.063in;
  height: 8.5in;
  column-count: 4;
  } 

Link to my brew: http://homebrewery.naturalcrit.com/share/rJVBg_qJx

stolksdorf commented 7 years ago

Haha I was just writing a comment to you. If you modify column-width you'll be able to change the widht of your columns to fit your page better.

I just needed to do this the other day for a magic item in homebrewery. I'll add it in as a snippet :)

dmmagic commented 7 years ago

Okay, a problem has cropped up. Not sure if I should add it to this thread or make a new one -- so I'll do the former for now.

Starting with page 6 and after, none of the pages load. I've tried three different browsers (newest version of Chrome, Internet Explorer 11, and Mobile Safari) on three different devices (two computers, each running Windows 7, and an iPhone).

Link to my brew: http://homebrewery.naturalcrit.com/share/rJVBg_qJx

dmmagic commented 7 years ago

I've found that increasing the page height (currently at 8.5 inches) to 11 inches fixes the problem. For some reason, any size smaller creates the spinning icon and pages 6 and later don't load.

stolksdorf commented 7 years ago

Can you make a new brew that does that weird spinning thing and link it to me? Definitely a bug.

Edit: I know what's happening. You changing the height of the pages messes up the partial page renderer, since it's expecting the pages to be taller, so it thinks you are looking at the wrong page. Hmmm interesting bug.

dmmagic commented 7 years ago

Edit: See below.

dmmagic commented 7 years ago

Here is a test brew that recreates the problem: http://homebrewery.naturalcrit.com/edit/HJxqFfOe7e

stolksdorf commented 7 years ago

I honestly think I might disable partial page rendering. It's bitten a few user's in the ass several times. I might make it automatically kick on when your brew gets massive....

Okay, quick fix for you.

.phb {
  width: 16.063in;
  height: 8.5in;
  margin-bottom: 2.5in !important;
  column-count: 4;
  } 

That will make the pages be the height the site is expecting. I'll push out an update today that will fix your problem. you can remove that line of css in v2.6.0

dmmagic commented 7 years ago

That fixed it! You're a scholar and a gentleman!

As an aside, what is partial page rendering?

PS: I'm the Christopher Green that reached out to you on Facebook recently. And I definitely subscribed to your Patreon. Thanks very much for the help!

stolksdorf commented 7 years ago

Live re-rendering of your brew's HTML can be very taxing on the browser when you have many pages (like 100+). A number of my users write incredibly large brews, so I implemented a technique where the site only renders the content of a brew page if it knows you are looking at it. It does this by looking at your scroll position.

There's been a bunch of issues with it, say if you have an html error on page 2 that would make the rest of the brew not render right, that might not be rendered while editing, but when you try and print it, it will ruin your whole brew.

Thanks for the support man, I need people like you when I wake up on a Saturday to like half a dozen new issues on the site :P

stolksdorf commented 7 years ago

Okay, PPR now kicks in when you have over 75 pages in your brew, and has a lil message letting you what's going on. The brew renderer now uses the height of the first page to determine the page heights, so that should fix your issue. Fixed in v2.6.0.

Racaoma commented 6 years ago

An easy solution, albeit without any control of the column width, is to use the following:

<div style='column-count:2'>
Your Text
</div>

The number of columns can be increased easily by changing the value 2 to any other number.