fix(ChatBot): Remove custom font size (#857)

Use PatternFly default of 14px rather than 16px.

Author: rebeccaalpert

packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/EmbeddedComparisonChatbot.tsx

@@ -18,7 +18,7 @@ import ChatbotFooter from '@patternfly/chatbot/dist/dynamic/ChatbotFooter';
 import MessageBar from '@patternfly/chatbot/dist/dynamic/MessageBar';
 import MessageBox from '@patternfly/chatbot/dist/dynamic/MessageBox';
 import Message, { MessageProps } from '@patternfly/chatbot/dist/dynamic/Message';
-import ChatbotHeader, { ChatbotHeaderMain } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader';
+import ChatbotHeader, { ChatbotHeaderMain, ChatbotHeaderTitle } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader';
 import Compare from '@patternfly/chatbot/dist/dynamic/Compare';
 import { BarsIcon } from '@patternfly/react-icons';
 import userAvatar from '../Messages/user_avatar.svg';
@@ -115,7 +115,9 @@ export const CompareChild = ({ name, input, hasNewInput, setIsSendButtonDisabled
   return (
     <Chatbot displayMode={displayMode}>
       <ChatbotHeader>
-        <ChatbotHeaderMain>{name}</ChatbotHeaderMain>
+        <ChatbotHeaderMain>
+          <ChatbotHeaderTitle>{name}</ChatbotHeaderTitle>
+        </ChatbotHeaderMain>
       </ChatbotHeader>
       <ChatbotContent>
         <MessageBox ariaLabel={`Scrollable message log for ${name}`} announcement={announcement}>

packages/module/src/Chatbot/Chatbot.scss

@@ -12,7 +12,6 @@
   background-color: var(--pf-t--global--background--color--floating--secondary--default);
   border-radius: var(--pf-t--global--border--radius--medium);
   box-shadow: var(--pf-t--global--box-shadow--lg);
-  font-size: var(--pf-t--global--font--size--md);
   z-index: var(--pf-t--global--z-index--md);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -178,9 +177,3 @@
   }
 }
 
-// ============================================================================
-// Information density styles
-// ============================================================================
-.pf-chatbot.pf-m-compact {
-  font-size: var(--pf-t--global--font--size--sm);
-}

packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.scss

@@ -48,7 +48,7 @@
 
   // Drawer menu
   // ----------------------------------------------------------------------------
-  .pf-v6-c-menu {
+  .pf-v6-c-menu.pf-chatbot__history-menu {
     --pf-v6-c-menu--PaddingBlockStart: 0;
     --pf-v6-c-menu--BackgroundColor: var(--pf-t--global--background--color--floating--default);
     // override high contrast style

packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx

@@ -290,7 +290,13 @@ export const ChatbotConversationHistoryNav: FunctionComponent<ChatbotConversatio
       return <HistoryEmptyState {...noResultsState} />;
     }
     return (
-      <Menu isPlain onSelect={onSelectActiveItem} activeItemId={activeItemId} {...menuProps}>
+      <Menu
+        className="pf-chatbot__history-menu"
+        isPlain
+        onSelect={onSelectActiveItem}
+        activeItemId={activeItemId}
+        {...menuProps}
+      >
         <MenuContent {...menuContentProps}>{buildConversations()}</MenuContent>
       </Menu>
     );

packages/module/src/ChatbotHeader/ChatbotHeader.scss

@@ -24,6 +24,7 @@
 
   // Title -or- Brand
   .pf-chatbot__title {
+    font-size:  var(--pf-t--global--font--size--body--lg);
     display: flex;
     align-items: center;
     flex: 1;