DS-679 Profile view

[mikemai2awesome]

Jira

https://pegadigitalit.atlassian.net/browse/DS-679

Spawned from: https://pegadigitalit.atlassian.net/browse/DS-590

Summary

Added Profile and Info Section components.

Details

1. Profile component created to handle user profiles
2. Info Section component created to handle sections within a user profile
3. Removes text-align behaviors in Tooltip component to simplify the code and make the behavior more predictable
4. Misc. docs changes that enhance or re-organize existing docs
5. Fixes Image element CSS so that when fill prop is used, the image's display is set to block, which removes undesired white space from inline-block

How to test

Run the branch locally and check the Profile and Info Section component docs. There's also a Profile View demo under Pages > User > User Profile, Drupal devs will use this mockup to build out the page. Review it as well.

[mikemai2awesome]

@danielamorse Need JS help with the Info Section component, convert the JS in index.js to be production ready in info-section.js.

const infoSectionToggleButtons = document.querySelectorAll(
  '.js-bolt-info-section-toggle-button',
);

infoSectionToggleButtons.forEach(button => {
  button.addEventListener('click', e => {
    const el = e.target;
    const isExpanded = el.getAttribute('aria-expanded') === 'true';
    const otherButtons = [...infoSectionToggleButtons].filter(
      button => button !== el,
    );

    if (isExpanded) {
      el.setAttribute('aria-expanded', false);
    } else {
      otherButtons.forEach(el => {
        el.setAttribute('aria-expanded', false);
      });
      el.setAttribute('aria-expanded', true);
    }
  });
});