mirror of
https://github.com/pds-nest/nest.git
synced 2025-02-16 20:53:57 +00:00
🚧 Add BoxFullScrollable (still WIP, doesn't support auto resizing)
Is it even possible?
This commit is contained in:
parent
6d6825874f
commit
ff35676781
2 changed files with 34 additions and 0 deletions
29
code/frontend/src/components/BoxFullScrollable.js
Normal file
29
code/frontend/src/components/BoxFullScrollable.js
Normal file
|
@ -0,0 +1,29 @@
|
||||||
|
import React from "react"
|
||||||
|
import Style from "./BoxFullScrollable.module.css"
|
||||||
|
import classNames from "classnames"
|
||||||
|
import BoxFull from "./BoxFull"
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A {@link BoxFull} whose body does not grow automatically but instead supports scrolling.
|
||||||
|
*
|
||||||
|
* @todo Is there a way to allow the box body to grow automatically...?
|
||||||
|
*
|
||||||
|
* @param children - The contents of the box body.
|
||||||
|
* @param childrenClassName - Additional class(es) added to the inner `<div>` acting as the body.
|
||||||
|
* @param height - The fixed height of the box body.
|
||||||
|
* @param props - Additional props to pass to the box.
|
||||||
|
* @returns {JSX.Element}
|
||||||
|
* @constructor
|
||||||
|
*/
|
||||||
|
export default function BoxFullScrollable({ children, childrenClassName, height, ...props }) {
|
||||||
|
return (
|
||||||
|
<BoxFull
|
||||||
|
childrenClassName={classNames(Style.ScrollableBody, childrenClassName)}
|
||||||
|
childrenProps={{"style": {"height": height}}}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</BoxFull>
|
||||||
|
)
|
||||||
|
}
|
|
@ -0,0 +1,5 @@
|
||||||
|
.ScrollableBody {
|
||||||
|
flex-grow: 0;
|
||||||
|
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
Loading…
Add table
Reference in a new issue