How can you fill window with Page Add-in

Scott Belina
Scott Belina
Fourth Anniversary Facilitator 1
in SKY Developer General Discussions

With a page add-in that does not have enough content to fill the vertical space in the browser window, there is a space below the iframe that does not match the background of the add-in, if there is any, like:

8b570b4dcb35a06b4ea47128d701debe-huge-im
white area at the bottom is outside of page add-in iframe

Is there any way to

(1) format the area outside the iframe,

(2) request the iframe have a minimum height of the host window,

or (3) request the height from the host to resize the document in the iframe from script inside the iframe

?

TIA

Comments

  • Ben Lambert
    Ben Lambert
    Ninth Anniversary Kudos 5 Name Dropper Participant

    Hi Scott,

    Good question and thanks for reaching out!

    Let me investigate this and I'll report back - in the meantime, is it possible to set your backcolor to white so it's indistinguishable from the host page?

    As an example - while building the full-page add-in feature we created a few demo pages (with fake/sample data) just to show the art of the possible. Here's a custom “Patron page” one might envision accessing from the RENXT Constituent page via the “Add-ins” button in the toolbar:

    d4c193e3f7c48fb47e9578f1deb97abb-origina

    Here's another example (with less content) showing a “Sponsor page":

    8b01524a2774dfe87a3f5f7fda689178-origina

    Both pages have a white background so it blends well with the host page.

    Let me know if setting the backcolor is an option for you.

  • Scott Belina
    Scott Belina
    Fourth Anniversary Facilitator 1

    Thanks for your quick reply, Ben. We could set the background to white if necessary, but if you want to try to provide a streamlined experience with the tiled UX elsewhere, the white background is pretty limiting. Your first example, the "Patron page" would demonstrate this same issue if you reduced height of the page enough that the aggregate height of the header plus the tiles to be less than the height of the browser window. In this case, you would have the white space below the bottom most tile like my (not nearly as cool) sample.

    Setting the background to white along with some style changes to the borders on the tiles could be passable, but to the user it would be a bit jarring from the experience in other similar view layouts.

    Thanks again for the quick response.

Categories