main area of FastListTemplate does not stretch when main_layout=None

[MarcSkovMadsen]

I would like to be able to use the FastListTemplate with main_layout=None some more. Because it is really nicely styled when #6023 is merged.

But currently sizing_mode="stretch_both" does not make things stretch. It does when I don't use main_layout=None.

import panel as pn

CSS_FIXES_TO_BE_UPSTREAMED_TO_PANEL = """
#sidebar {
    padding-left: 5px !important;
    background-color: var(--panel-surface-color);
}
.bk-active.bk-btn-primary {border-color: var(--accent-fill-active)}
.bk-btn-primary:hover {border-color: var(--accent-fill-hover)}
.bk-btn-primary {border-color: var(--accent-fill-rest)}
a {color: var(--accent-fill-rest) !important;}
a:hover {color: var(--accent-fill-hover) !important;}
"""
# .pn-wrapper {
#     height: calc( 100vh - 150px);
# }

pn.extension(sizing_mode="stretch_width", inline=True, raw_css=[CSS_FIXES_TO_BE_UPSTREAMED_TO_PANEL])

ACCENT = "#da1a5f"

def even_or_odd(contents, user, instance):
    if len(contents) % 2 == 0:
        return "Even number of characters."
    return "Odd number of characters."

chat = pn.chat.ChatInterface(callback=even_or_odd, sizing_mode="stretch_both")

pn.template.FastListTemplate(
       title="Test App", 
       sidebar="## Settings",
       main=[chat],
       accent=ACCENT,
       main_layout=None,
).servable()

Works when I use default value for main_layout.

[MarcSkovMadsen]

I can see that this can be fixed by adding

div.pn-wrapper {
  height: 100%;
}