Change subapp style to keep its header fixed on the screen.
This commit is contained in:
parent
8b57732722
commit
7386c55952
3 changed files with 30 additions and 1 deletions
|
@ -500,6 +500,28 @@ export function DemoApp()
|
|||
<button onClick={easySubapp}>
|
||||
Easy with callable subapp
|
||||
</button>
|
||||
|
||||
<button onClick={() => {
|
||||
subapps.open(
|
||||
<Subapp title={"Very long subapp"}>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
<Card><p>A test content.</p></Card>
|
||||
</Subapp>
|
||||
)
|
||||
}}>A long subapp
|
||||
</button>
|
||||
</Card>
|
||||
|
||||
<h3>Modals</h3>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"version": "1.3.1",
|
||||
"version": "1.3.2",
|
||||
"name": "@kernelui/core",
|
||||
"description": "Kernel UI Core.",
|
||||
"scripts": {
|
||||
|
|
|
@ -7,6 +7,9 @@
|
|||
top: @subapp-margin;
|
||||
left: @subapp-margin;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
width: calc(100% - (2 * @subapp-margin));
|
||||
height: calc(100% - (2 * @subapp-margin));
|
||||
border-radius: 0.25em;
|
||||
|
@ -64,6 +67,10 @@
|
|||
|
||||
> main
|
||||
{
|
||||
flex: 1;
|
||||
|
||||
padding: 1em;
|
||||
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue