Differences between preview and actual

edited January 2014 in General Archive
Maybe someone can help.

The Title settings do not seem to correspond between the preview and the actual.

I have .jpgs of the differences, can I post them here somewhere so someone can explain what I am doing wrong?


  • Basileus
    Posts: 589 edited January 2014
    I know the preview doesn't display any custom styling you have for your campaign. The preview always looks like default Obsidian Portal styling. Is that what you are seeing?

    Edit: It also uses a much wider window than the actual content does.

    Also edit: So, in short, you aren't doing anything wrong. The preview is just of limited value, basically just to see if your Textile is doing what you expect it to, but not to see what the final product will look like after styling.
    Post edited by Basileus on
  • Craig_the_Lucky
    Posts: 3
    No, it's not custom. I'm using the online textile editor.

    Disappointing. I was hoping to get better functionality out of the new site.
  • GamingMegaverse
    Posts: 2,956
    Some of the preview definitely does not line up- but I have so much custom I always thought that was the problem.
    I would submit a bug report if I were you Craig the Lucky.
    "A God...Rebuilt":https://a-god-rebuilt.obsidianportal.com
    "OP's COTM April 2012":http://blog.obsidianportal.com/a-god-rebuilt-aprils-cotm/

    Just trying to help out.

  • Basileus
    Posts: 589 edited January 2014
    Some notes and a quick fix on the preview:

    The preview uses the .preview-content and .reveal-modal classes, rather than the .main-content and .main-content-container classes. So, theoretically one could structure one's CSS to reflect that and apply the same settings to both. Probably more trouble than it is worth in most cases though.

    To just fix the size of the preview box (which to me is probably the biggest issue), one can get pretty close by setting the width and left properties of the .reveal-modal class. For default width campaigns, this works pretty well:

    @.reveal-modal {width: 730px; left: 71%;}@

    Custom width campaigns may have to play with the numbers a bit, the width should equal roughly 58.33% of the total content width. For example, for my 1440px campaign I use this:

    @.reveal-modal {width: 840px; left: 68%;}@

    It isn't an exact match, but its much closer than the default (the preview still adds in an additional layer of padding that is not in the final content, just under 1em thick, so the preview is still slightly narrower than the final results). Does a better job of showing how the final layout will look (as far as positioning and sizes, not so much with colors and other styling).
    Post edited by Basileus on
  • Pils
    Posts: 149
    That's perfect! Thanks Basileus!

    "Dark Sun / La Décade des Héros":https://dark-sun-a-trova.obsidianportal.com/: Face the Fire of the Dark Sun... a World ravaged by Sorcery!
    "Al-Qadim / Golden Voyages":https://aq-golden-voyages.obsidianportal.com/: Who among you dares to challenge the high seas?


    Dark Sun ● La Décade des Héros : Face the Fire of the Dark Sun... a World ravaged by Sorcery! (CotM - Dec 2012)

    Les Royaumes Oubliés : A D&D 5e old school style Forgotten Realms campaign!

    (And I'm so soooorry for my poor english...)

  • Basileus
    Posts: 589
    Glad its helpful!

    And thanks for the favorite Pils :)
Sign In or Register to comment.

June 2022
Baldur's Gate

Read the feature post on the blog
Return to Obsidian Portal

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!