diff --git a/packages/dashboard-v2/src/components/Panel/Panel.js b/packages/dashboard-v2/src/components/Panel/Panel.js index 27551ecd..fe50cc89 100644 --- a/packages/dashboard-v2/src/components/Panel/Panel.js +++ b/packages/dashboard-v2/src/components/Panel/Panel.js @@ -14,8 +14,8 @@ const PanelTitle = styled.h6.attrs({ * * These additional props will be rendered onto the panel's body element. */ -export const Panel = ({ title, ...props }) => ( -
+export const Panel = ({ title, wrapperClassName, ...props }) => ( +
{title && {title}}
@@ -26,8 +26,13 @@ Panel.propTypes = { * Label of the panel */ title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), + /** + * CSS class to be applied to the external container + */ + wrapperClassName: PropTypes.string, }; Panel.defaultProps = { title: "", + wrapperClassName: "", }; diff --git a/packages/dashboard-v2/src/components/Slider/Slide.js b/packages/dashboard-v2/src/components/Slider/Slide.js index 42d354ff..eafbc563 100644 --- a/packages/dashboard-v2/src/components/Slider/Slide.js +++ b/packages/dashboard-v2/src/components/Slider/Slide.js @@ -2,7 +2,7 @@ import styled from "styled-components"; import PropTypes from "prop-types"; const Slide = styled.div.attrs(({ isVisible }) => ({ - className: `slider-slide transition-opacity ${isVisible ? "" : "opacity-50 cursor-pointer select-none"}`, + className: `slider-slide transition-opacity h-full ${isVisible ? "" : "opacity-50 cursor-pointer select-none"}`, }))``; Slide.propTypes = { diff --git a/packages/dashboard-v2/src/components/Slider/Slider.js b/packages/dashboard-v2/src/components/Slider/Slider.js index 33c3bc2a..5b902c58 100644 --- a/packages/dashboard-v2/src/components/Slider/Slider.js +++ b/packages/dashboard-v2/src/components/Slider/Slider.js @@ -62,7 +62,7 @@ const Slider = ({ slides, breakpoints, scrollerClassName, className }) => { const isVisible = index >= activeIndex && index < activeIndex + visibleSlides; return ( -
+