doc updates (#195)

Adds in a few minor updates for documentation and component changes.

src/components/mediaObject/CdrMediaObject.vue

@@ -8,7 +8,7 @@ import { getLayoutStyling } from '../../utils/mediaObject';
 import CdrLayout from '../layout/CdrLayout.vue';
 import { breakpoints, spacing } from '../../utils/other';
 
-/** Component for buttons that have a checked state. */
+/** Component that pairs images or videos with related text in a consistent way */
 
 defineOptions({ name: 'CdrMediaObject' });
 

src/components/mediaObject/styles/vars/CdrMediaObject.vars.scss

@@ -6,6 +6,10 @@ $media-object-component: 'media-object';
 @mixin cdr-media-object-base-mixin($component) {
   & > .cdr-#{$component}__media {
     grid-area: media;
+
+    & > :first-child {
+      display: block;
+    }
   }
 
   & > .cdr-#{$component}__content {

src/types/interfaces.ts

@@ -16,6 +16,7 @@ import type {
   QueryType,
   Position,
   Alignment,
+  AlignmentValue,
   MediaMeasurement,
 } from './other';
 
@@ -338,6 +339,7 @@ export interface MediaObject extends Layout {
   align?: Alignment;
   /**
    * The position of the media, in relation to the content. This can be an object with values for each Cedar breakpoint (xs, sm, md, lg).
+   * @demoSelectMultiple false
    * @values top, right, bottom, left
    */
   mediaPosition?: Position;
@@ -363,12 +365,12 @@ export interface MediaObject extends Layout {
    * The alignment of the content along the x axis.
    * @values start, center, end
    */
-  overlayRowAlign?: Alignment;
+  overlayRowAlign?: AlignmentValue;
   /**
    * The alignment of the content along the y axis.
    * @values start, center, end
    */
-  overlayColumnAlign?: Alignment;
+  overlayColumnAlign?: AlignmentValue;
   /**
    * The spacing token to use for padding around the content. This can be an object with values for each Cedar breakpoint (xs, sm, md, lg).
    * @demoSelectMultiple false