message: feat(pattern): utilizing the ContentSection in CardSection pattern
diff: * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
  -
  import React, { useEffect, useRef } from 'react';
  import { ArrowRight20 } from '@carbon/icons-react';
  import { Card } from '../../sub-patterns/Card';
  import classNames from 'classnames';
  -import { settings as ddsSettings } from '@carbon/ibmdotcom-utilities';
  +import { ContentSection } from '../../sub-patterns/ContentSection';
  import PropTypes from 'prop-types';
  import root from 'window-or-global';
  import { sameHeight } from '@carbon/ibmdotcom-utilities';
  import { settings } from 'carbon-components';
  -const { stablePrefix } = ddsSettings;
  const { prefix } = settings;
  -
  /**
  * Card section Component
  *
  @@ -64,17 +61,27 @@ const CardSection = ({ heading, cards, theme }) => {
  };
  return (
  - <section
  - data-autoid={`${stablePrefix}--card-section`}
  - className={classNames(`${prefix}--card-section`, _setTheme(theme))}>
  - <div className={`${prefix}--card-section__container`}>
  - <div className={`${prefix}--card-section__row`}>
  - <h2 className={`${prefix}--card-section__heading`}>{heading}</h2>
  - <div className={`${prefix}--card-section__cards`} ref={containerRef}>
  + <ContentSection
  + heading={heading}
  + customClassName={classNames(`${prefix}--card-section`, _setTheme(theme))}
  + ref={containerRef}>
  + {_renderCards(cards)}
  + </ContentSection>
  + );
  +};
  +
  +/**
  + * Renders the cards based on the CardSection entries
  + *
  + * @param {Array} cards objects array
  + * @returns {*} CardSection JSX objects
  + */
  +const _renderCards = cards => (
  <div
  className={`${prefix}--card-section__cards__row ${prefix}--row--condensed`}>
  {cards.map((card, index) => {
  return (
  + <div className={`${prefix}--card-section__cards__col`}>
  <div className={`${prefix}--card-section__cards__col`}>
  <Card
  key={index}
  @@ -92,15 +99,11 @@ const CardSection = ({ heading, cards, theme }) => {
  type="link"
  />
  </div>
  + </div>
  );
  })}
  </div>
  - </div>
  - </div>
  - </div>
  - </section>
  );
  -};
  CardSection.propTypes = {
  theme: PropTypes.string,
  