correct fonts on cards

Author: nielslyngsoe

packages/uui-card-content-node/lib/uui-card-content-node.element.ts

@@ -68,7 +68,7 @@ export class UUICardContentNodeElement extends UUICardElement {
 
   #renderContent() {
     return html`
-      <span id="content">
+      <span id="content" class="uui-text">
         <span id="item">
           <span id="icon">
             <slot name="icon" @slotchange=${this._onSlotIconChange}></slot>
@@ -167,7 +167,6 @@ export class UUICardContentNodeElement extends UUICardElement {
       #open-part {
         display: flex;
         position: relative;
-        font-weight: 700;
         align-items: center;
         cursor: pointer;
         flex-grow: 1;

packages/uui-card-media/lib/uui-card-media.element.ts

@@ -102,12 +102,12 @@ export class UUICardMediaElement extends UUICardElement {
 
   #renderContent() {
     return html`
-      <div id="content">
+      <div id="content" class="uui-text">
         <!--
         TODO: Implement info box when pop-out is ready
         -->
         <span id="name">${this.name}</span>
-        ${this.detail}<slot name="detail"></slot>
+        <small id="detail">${this.detail}<slot name="detail"></slot></small>
       </div>
     `;
   }
@@ -219,8 +219,8 @@ export class UUICardMediaElement extends UUICardElement {
         opacity: 0.96;
       }
 
-      #name {
-        font-weight: 700;
+      #detail {
+        opacity: 0.6;
       }
 
       :host(