Sha256: 0e5b5c66102aeda3f873a726035ed8a2edbdb1dc4043b7f5f971f0907aaeb6ac

Contents?: true

Size: 718 Bytes

Versions: 1007

Compression:

Stored size: 718 Bytes

Contents

import React from 'react'
import {
    Overlay,
    Card,
    Flex,
    FlexItem,
} from 'playbook-ui'

const InlineCardsExample = () => {
    return (
        <Flex
            columnGap="lg"
            orientation="row"
            overflowX="auto"
        >
            {Array.from({ length: 15 }, (_, index) => (
                <FlexItem key={index}>
                    <Card>{"Card Content"}</Card>
                </FlexItem>
            ))}
        </Flex>
    )
}

const OverlayMultiDirectional = () => (
    <>
        <Overlay
            color="card_light"
            layout={{"x": "xl"}}
        >
            <InlineCardsExample />
        </Overlay>
    </>
)

export default OverlayMultiDirectional

Version data entries

1,007 entries across 1,007 versions & 2 rubygems

Version Path
playbook_ui_docs-14.12.0.pre.alpha.testingwithfas5689 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.alpha.testingwithfas5689 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.12.0.pre.alpha.testingwithfas5686 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.alpha.testingwithfas5686 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.12.0.pre.alpha.play1828updateviteversion5680 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.alpha.play1828updateviteversion5680 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5673 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5673 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobug5655 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobug5655 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.12.0.pre.alpha.PBNTR720railscarddraggable5649 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.alpha.PBNTR720railscarddraggable5649 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobug5646 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobug5646 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.11.1.pre.alpha.PBNTR440enableglobalpropspbformwith5624 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.11.1.pre.alpha.PBNTR440enableglobalpropspbformwith5624 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.12.0.pre.rc.12 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui-14.12.0.pre.rc.12 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx
playbook_ui_docs-14.11.1.pre.alpha.PLAY17445539 app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx