svelte-ionic-app icon indicating copy to clipboard operation
svelte-ionic-app copied to clipboard

Bug - can only use one ion-content

Open Tommertom opened this issue 2 years ago • 2 comments

When having a page with ion-content and doing a modal with another ion-content, the view will be totally messed up.

So need to look into ion-content - is there something like framework overlay needed or so?

If that is the case, a custom IonContent.svelte will be needed....

Tommertom avatar Mar 08 '23 02:03 Tommertom

For now workaround could be like this (wrapping in a scrollable div):

<div class="scrollable">
	{#each transactions as transaction}
		<ion-item>
			<ion-label>
				<h2>{transTypeMap[transaction.entryType]}</h2>
				<h3>
					Tokens {transaction.usage.prompt_tokens} prompt {transaction.usage.completion_tokens} response
					- total {transaction.usage.total_tokens}
				</h3>
				<p>{transaction.content}</p>
			</ion-label>
		</ion-item>
	{/each}
</div>

<style>
	.scrollable {
		overflow: auto;
		max-height: 100vh;
	}
</style>

Tommertom avatar Mar 08 '23 02:03 Tommertom

Probably solved when wrapping the main pagein in div with ion-page

Demo for the rebuild has multiple ion-contents and that seems to work https://github.com/Tommertom/svelte-ionic-app/issues/93

Tommertom avatar Jan 07 '24 18:01 Tommertom