diff options
Diffstat (limited to 'openecomp-ui/src/nfvo-components/grid')
-rw-r--r-- | openecomp-ui/src/nfvo-components/grid/GridItem.jsx | 21 | ||||
-rw-r--r-- | openecomp-ui/src/nfvo-components/grid/GridSection.jsx | 35 |
2 files changed, 38 insertions, 18 deletions
diff --git a/openecomp-ui/src/nfvo-components/grid/GridItem.jsx b/openecomp-ui/src/nfvo-components/grid/GridItem.jsx index c62e042bf4..9723cde2c0 100644 --- a/openecomp-ui/src/nfvo-components/grid/GridItem.jsx +++ b/openecomp-ui/src/nfvo-components/grid/GridItem.jsx @@ -15,12 +15,21 @@ */ import React from 'react'; -const GridItem = ({colSpan = 1, children, lastColInRow = false, stretch = false, className = ''}) => ( - <div className={`grid-col-${colSpan} ${lastColInRow ? 'last-col-in-row' : ''} ${className}`}> - <div className={`grid-item${stretch ? '-stretch' : ''}`}> - {children} - </div> - </div> +const GridItem = ({ + colSpan = 1, + children, + lastColInRow = false, + stretch = false, + className = '' +}) => ( + <div + className={`grid-col-${colSpan} ${ + lastColInRow ? 'last-col-in-row' : '' + } ${className}`}> + <div className={`grid-item${stretch ? '-stretch' : ''}`}> + {children} + </div> + </div> ); export default GridItem; diff --git a/openecomp-ui/src/nfvo-components/grid/GridSection.jsx b/openecomp-ui/src/nfvo-components/grid/GridSection.jsx index 8f4a024fdb..f2e3588d9e 100644 --- a/openecomp-ui/src/nfvo-components/grid/GridSection.jsx +++ b/openecomp-ui/src/nfvo-components/grid/GridSection.jsx @@ -17,21 +17,32 @@ import React from 'react'; import PropTypes from 'prop-types'; import classnames from 'classnames'; -const GridSection = ({title, children, className = '', titleClassName, hasLastColSet = false}) => { - return ( - <div className={classnames('grid-section', className, {'has-last-col-set': hasLastColSet})}> - {title && <div className={`section-title ${titleClassName || ''}`}>{title}</div>} - <div className='grid-items'> - {children} - </div> - </div> - ); +const GridSection = ({ + title, + children, + className = '', + titleClassName, + hasLastColSet = false +}) => { + return ( + <div + className={classnames('grid-section', className, { + 'has-last-col-set': hasLastColSet + })}> + {title && ( + <div className={`section-title ${titleClassName || ''}`}> + {title} + </div> + )} + <div className="grid-items">{children}</div> + </div> + ); }; GridSection.propTypes = { - title: PropTypes.string, - titleClassName: PropTypes.string, - hasLastColSet: PropTypes.bool + title: PropTypes.string, + titleClassName: PropTypes.string, + hasLastColSet: PropTypes.bool }; export default GridSection; |