diff --git a/src/core/client/stream/App/TabBar.tsx b/src/core/client/stream/App/TabBar.tsx
index d270b1557..f0a2e9aa4 100644
--- a/src/core/client/stream/App/TabBar.tsx
+++ b/src/core/client/stream/App/TabBar.tsx
@@ -1,4 +1,5 @@
 import { Localized } from "@fluent/react/compat";
+import cn from "classnames";
 import React, { FunctionComponent } from "react";
 
 import { GQLSTORY_MODE } from "coral-framework/schema";
@@ -22,7 +23,12 @@ const AppTabBar: FunctionComponent<Props> = props => {
       activeTab={props.activeTab}
       onTabClick={props.onTabClick}
     >
-      <Tab className={CLASSES.tabBar.comments} tabID="COMMENTS">
+      <Tab
+        className={cn(CLASSES.tabBar.comments, {
+          [CLASSES.tabBar.activeTab]: props.activeTab === "COMMENTS",
+        })}
+        tabID="COMMENTS"
+      >
         {props.mode === GQLSTORY_MODE.QA ? (
           <Localized id="general-tabBar-qaTab">
             <span>Q&A</span>
@@ -34,7 +40,12 @@ const AppTabBar: FunctionComponent<Props> = props => {
         )}
       </Tab>
       {props.showProfileTab && (
-        <Tab className={CLASSES.tabBar.myProfile} tabID="PROFILE">
+        <Tab
+          className={cn(CLASSES.tabBar.myProfile, {
+            [CLASSES.tabBar.activeTab]: props.activeTab === "PROFILE",
+          })}
+          tabID="PROFILE"
+        >
           <Localized id="general-tabBar-myProfileTab">
             <span>My Profile</span>
           </Localized>
diff --git a/src/core/client/stream/classes.ts b/src/core/client/stream/classes.ts
index 4887da9cc..09fbe8353 100644
--- a/src/core/client/stream/classes.ts
+++ b/src/core/client/stream/classes.ts
@@ -36,7 +36,7 @@ const CLASSES = {
   rte: {
     $root: "coral coral-rte",
     content: "coral coral-rte-content",
-    placeholder: "coral coral-rte-placholder",
+    placeholder: "coral coral-rte-placeholder",
     toolbar: "coral coral-rte-toolbar",
   },
 
@@ -63,6 +63,8 @@ const CLASSES = {
      * configure is the button for the "Configure" tab.
      */
     configure: "coral coral-tabBar-tab coral-tabBar-configure",
+
+    activeTab: "coral-tabBar-tab-active",
   },
 
   /**
@@ -89,6 +91,8 @@ const CLASSES = {
      * featuredTooltip is the tooltip next to the featured tab.
      */
     featuredTooltip: "coral coral-tabBarComments-featuredTooltip",
+
+    activeTab: "coral-tabBarSecondary-tab-active",
   },
 
   /**
@@ -118,6 +122,7 @@ const CLASSES = {
     notifications:
       "coral coral-tabBarSecondary-tab coral-tabBarMyProfile-notifications",
 
+    active: "coral-tabBarSecondary-tab-active",
     /**
      * settings is the button for the "Settings" tab.
      */
@@ -307,6 +312,9 @@ const CLASSES = {
        */
       commentTag: "coral coral-commentTag coral-comment-commentTag",
 
+      featuredTag:
+        "coral coral-commentTag coral-comment-commentTag coral-featuredTag coral-comment-featuredTag",
+
       /**
        * caretButton can be used to target the caret that opens the moderation dropdown.
        */
@@ -470,6 +478,11 @@ const CLASSES = {
        */
       replies: "coral coral-featuredComment-replies",
 
+      /**
+       * replies indicates the amount of replies this comment has.
+       */
+      repliesDivider: "coral coral-featuredComment-replies-divider",
+
       /**
        * reactButton is the reaction button.
        */
@@ -741,6 +754,7 @@ const CLASSES = {
     replies: "coral coral-myComment-replies",
     reactions: "coral coral-myComment-reactions",
     viewConversationButton: "coral coral-myComment-viewConversationButton",
+    commentOn: "coral coral-myComment-commentOn",
   },
 
   /**
diff --git a/src/core/client/stream/tabs/Comments/Comment/CommentContainer.tsx b/src/core/client/stream/tabs/Comments/Comment/CommentContainer.tsx
index 9478c6223..208dbb0a6 100644
--- a/src/core/client/stream/tabs/Comments/Comment/CommentContainer.tsx
+++ b/src/core/client/stream/tabs/Comments/Comment/CommentContainer.tsx
@@ -234,7 +234,7 @@ export class CommentContainer extends Component<Props, State> {
       <>
         {hasFeaturedTag && !isQA && (
           <Tag
-            className={CLASSES.comment.topBar.commentTag}
+            className={CLASSES.comment.topBar.featuredTag}
             color="primary"
             variant="pill"
           >
diff --git a/src/core/client/stream/tabs/Comments/RTE/__snapshots__/RTE.spec.tsx.snap b/src/core/client/stream/tabs/Comments/RTE/__snapshots__/RTE.spec.tsx.snap
index 168fce62b..84e780673 100644
--- a/src/core/client/stream/tabs/Comments/RTE/__snapshots__/RTE.spec.tsx.snap
+++ b/src/core/client/stream/tabs/Comments/RTE/__snapshots__/RTE.spec.tsx.snap
@@ -62,7 +62,7 @@ exports[`renders correctly 1`] = `
       ]
     }
     placeholder="Post a comment"
-    placeholderClassName="coral coral-rte-placholder RTE-placeholder"
+    placeholderClassName="coral coral-rte-placeholder RTE-placeholder"
     placeholderClassNameDisabled=""
     toolbarClassName="coral coral-rte-toolbar RTE-toolbar"
     toolbarClassNameDisabled=""
diff --git a/src/core/client/stream/tabs/Comments/Stream/FeaturedComments/FeaturedCommentContainer.tsx b/src/core/client/stream/tabs/Comments/Stream/FeaturedComments/FeaturedCommentContainer.tsx
index 2a4b68588..44c0bf5b9 100644
--- a/src/core/client/stream/tabs/Comments/Stream/FeaturedComments/FeaturedCommentContainer.tsx
+++ b/src/core/client/stream/tabs/Comments/Stream/FeaturedComments/FeaturedCommentContainer.tsx
@@ -84,7 +84,7 @@ const FeaturedCommentContainer: FunctionComponent<Props> = props => {
             settings={settings}
           />
         </Box>
-        <Box ml={2} clone>
+        <Box ml={2}>
           <Timestamp className={CLASSES.featuredComment.authorBar.timestamp}>
             {comment.createdAt}
           </Timestamp>
@@ -116,7 +116,12 @@ const FeaturedCommentContainer: FunctionComponent<Props> = props => {
                 </Localized>
                 <Box>{comment.replyCount}</Box>
               </Flex>
-              <Box mx={2}>|</Box>
+              <Box
+                className={CLASSES.featuredComment.actionBar.repliesDivider}
+                mx={2}
+              >
+                |
+              </Box>
             </Flex>
           )}
           <div>
diff --git a/src/core/client/stream/tabs/Comments/Stream/StreamContainer.tsx b/src/core/client/stream/tabs/Comments/Stream/StreamContainer.tsx
index b358741e4..74f9f4226 100644
--- a/src/core/client/stream/tabs/Comments/Stream/StreamContainer.tsx
+++ b/src/core/client/stream/tabs/Comments/Stream/StreamContainer.tsx
@@ -76,7 +76,8 @@ const TabWithFeaturedTooltip: FunctionComponent<TooltipTabProps> = ({
       className={cn(
         styles.fixedTab,
         CLASSES.tabBarComments.featured,
-        styles.featuredCommentsTab
+        styles.featuredCommentsTab,
+        { [CLASSES.tabBarComments.activeTab]: props.active }
       )}
     />
     <FeaturedCommentTooltip
@@ -280,6 +281,8 @@ export const StreamContainer: FunctionComponent<Props> = props => {
                 className={cn(
                   {
                     [styles.fixedTab]: featuredCommentsCount > 0,
+                    [CLASSES.tabBarComments.activeTab]:
+                      local.commentsTab === "ALL_COMMENTS",
                   },
                   CLASSES.tabBarComments.allComments
                 )}
diff --git a/src/core/client/stream/tabs/Profile/MyComments/HistoryComment.tsx b/src/core/client/stream/tabs/Profile/MyComments/HistoryComment.tsx
index 8ab523a1d..a86aaf7ee 100644
--- a/src/core/client/stream/tabs/Profile/MyComments/HistoryComment.tsx
+++ b/src/core/client/stream/tabs/Profile/MyComments/HistoryComment.tsx
@@ -42,7 +42,7 @@ const HistoryComment: FunctionComponent<HistoryCommentProps> = props => {
       className={cn(styles.root, CLASSES.myComment.$root)}
       data-testid={`historyComment-${props.id}`}
     >
-      <div>
+      <div className={CLASSES.myComment.commentOn}>
         <Localized id="profile-historyComment-comment-on">
           <Typography variant="detail" className={styles.commentOn}>
             Comment on:
diff --git a/src/core/client/stream/tabs/Profile/MyComments/__snapshots__/HistoryComment.spec.tsx.snap b/src/core/client/stream/tabs/Profile/MyComments/__snapshots__/HistoryComment.spec.tsx.snap
index 8cebbd2c5..b0bff02c6 100644
--- a/src/core/client/stream/tabs/Profile/MyComments/__snapshots__/HistoryComment.spec.tsx.snap
+++ b/src/core/client/stream/tabs/Profile/MyComments/__snapshots__/HistoryComment.spec.tsx.snap
@@ -5,7 +5,9 @@ exports[`renders correctly 1`] = `
   className="HistoryComment-root coral coral-myComment"
   data-testid="historyComment-comment-id"
 >
-  <div>
+  <div
+    className="coral coral-myComment-commentOn"
+  >
     <Localized
       id="profile-historyComment-comment-on"
     >
diff --git a/src/core/client/stream/tabs/Profile/Profile.tsx b/src/core/client/stream/tabs/Profile/Profile.tsx
index f116f1414..c5af133b3 100644
--- a/src/core/client/stream/tabs/Profile/Profile.tsx
+++ b/src/core/client/stream/tabs/Profile/Profile.tsx
@@ -1,4 +1,5 @@
 import { Localized } from "@fluent/react/compat";
+import cn from "classnames";
 import React, { FunctionComponent, useCallback, useMemo } from "react";
 
 import { useViewerEvent } from "coral-framework/lib/events";
@@ -79,21 +80,35 @@ const Profile: FunctionComponent<ProfileProps> = props => {
         onTabClick={onTabClick}
         className={CLASSES.tabBarMyProfile.$root}
       >
-        <Tab tabID="MY_COMMENTS" className={CLASSES.tabBarMyProfile.myComments}>
+        <Tab
+          tabID="MY_COMMENTS"
+          className={cn(CLASSES.tabBarMyProfile.myComments, {
+            [CLASSES.tabBarMyProfile.active]:
+              local.profileTab === "MY_COMMENTS",
+          })}
+        >
           <Localized id="profile-myCommentsTab-comments">
             <span>My comments</span>
           </Localized>
         </Tab>
         <Tab
           tabID="PREFERENCES"
-          className={CLASSES.tabBarMyProfile.preferences}
+          className={cn(CLASSES.tabBarMyProfile.preferences, {
+            [CLASSES.tabBarMyProfile.active]:
+              local.profileTab === "PREFERENCES",
+          })}
         >
           <Localized id="profile-preferencesTab">
             <span>Preferences</span>
           </Localized>
         </Tab>
         {showAccountTab && (
-          <Tab tabID="ACCOUNT" className={CLASSES.tabBarMyProfile.settings}>
+          <Tab
+            tabID="ACCOUNT"
+            className={cn(CLASSES.tabBarMyProfile.settings, {
+              [CLASSES.tabBarMyProfile.active]: local.profileTab === "ACCOUNT",
+            })}
+          >
             <Localized id="profile-accountTab">
               <span>Account</span>
             </Localized>
diff --git a/src/core/client/stream/test/comments/featured/__snapshots__/renderFeaturedStream.spec.tsx.snap b/src/core/client/stream/test/comments/featured/__snapshots__/renderFeaturedStream.spec.tsx.snap
index ea472c406..d1527f5fe 100644
--- a/src/core/client/stream/test/comments/featured/__snapshots__/renderFeaturedStream.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/featured/__snapshots__/renderFeaturedStream.spec.tsx.snap
@@ -22,7 +22,7 @@ exports[`renders comment stream 1`] = `
         <button
           aria-controls="tabPane-COMMENTS"
           aria-selected={true}
-          className="BaseButton-root Tab-button Tab-primary Tab-active coral coral-tabBar-tab coral-tabBar-comments"
+          className="BaseButton-root Tab-button Tab-primary Tab-active coral coral-tabBar-tab coral-tabBar-comments coral-tabBar-tab-active"
           onBlur={[Function]}
           onClick={[Function]}
           onFocus={[Function]}
@@ -118,7 +118,7 @@ exports[`renders comment stream 1`] = `
                     />
                     <div
                       aria-hidden="true"
-                      className="RTE-placeholder coral coral-rte-placholder RTE-placeholder"
+                      className="RTE-placeholder coral coral-rte-placeholder RTE-placeholder"
                     >
                       Post a comment
                     </div>
@@ -264,7 +264,7 @@ exports[`renders comment stream 1`] = `
                   <button
                     aria-controls="tabPane-FEATURED_COMMENTS"
                     aria-selected={true}
-                    className="BaseButton-root Tab-button Tab-secondary StreamContainer-featuredCommentsTabButton Tab-active StreamContainer-fixedTab coral coral-tabBarSecondary-tab coral-tabBarComments-featured StreamContainer-featuredCommentsTab"
+                    className="BaseButton-root Tab-button Tab-secondary StreamContainer-featuredCommentsTabButton Tab-active StreamContainer-fixedTab coral coral-tabBarSecondary-tab coral-tabBarComments-featured StreamContainer-featuredCommentsTab coral-tabBarSecondary-tab-active"
                     onBlur={[Function]}
                     onClick={[Function]}
                     onFocus={[Function]}
@@ -429,24 +429,28 @@ exports[`renders comment stream 1`] = `
                       className="Box-root Flex-root Flex-flex Flex-alignCenter"
                     />
                   </span>
-                  <button
-                    className="BaseButton-root Timestamp-root"
-                    onBlur={[Function]}
-                    onClick={[Function]}
-                    onFocus={[Function]}
-                    onMouseOut={[Function]}
-                    onMouseOver={[Function]}
-                    onTouchEnd={[Function]}
-                    type="button"
+                  <div
+                    className="Box-root Box-ml-2"
                   >
-                    <time
-                      className="RelativeTime-root Timestamp-text Box-root Box-ml-2"
-                      dateTime="2018-07-06T18:24:00.000Z"
-                      title="2018-07-06T18:24:00.000Z"
+                    <button
+                      className="BaseButton-root Timestamp-root"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onMouseOut={[Function]}
+                      onMouseOver={[Function]}
+                      onTouchEnd={[Function]}
+                      type="button"
                     >
-                      2018-07-06T18:24:00.000Z
-                    </time>
-                  </button>
+                      <time
+                        className="RelativeTime-root Timestamp-text coral coral-timestamp coral-comment-timestamp"
+                        dateTime="2018-07-06T18:24:00.000Z"
+                        title="2018-07-06T18:24:00.000Z"
+                      >
+                        2018-07-06T18:24:00.000Z
+                      </time>
+                    </button>
+                  </div>
                 </div>
                 <div
                   className="Box-root Flex-root coral coral-featuredComment-actionBar Flex-flex Flex-justifySpaceBetween Box-mt-2"
@@ -546,24 +550,28 @@ exports[`renders comment stream 1`] = `
                       className="Box-root Flex-root Flex-flex Flex-alignCenter"
                     />
                   </span>
-                  <button
-                    className="BaseButton-root Timestamp-root"
-                    onBlur={[Function]}
-                    onClick={[Function]}
-                    onFocus={[Function]}
-                    onMouseOut={[Function]}
-                    onMouseOver={[Function]}
-                    onTouchEnd={[Function]}
-                    type="button"
+                  <div
+                    className="Box-root Box-ml-2"
                   >
-                    <time
-                      className="RelativeTime-root Timestamp-text Box-root Box-ml-2"
-                      dateTime="2018-07-06T18:24:00.000Z"
-                      title="2018-07-06T18:24:00.000Z"
+                    <button
+                      className="BaseButton-root Timestamp-root"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onMouseOut={[Function]}
+                      onMouseOver={[Function]}
+                      onTouchEnd={[Function]}
+                      type="button"
                     >
-                      2018-07-06T18:24:00.000Z
-                    </time>
-                  </button>
+                      <time
+                        className="RelativeTime-root Timestamp-text coral coral-timestamp coral-comment-timestamp"
+                        dateTime="2018-07-06T18:24:00.000Z"
+                        title="2018-07-06T18:24:00.000Z"
+                      >
+                        2018-07-06T18:24:00.000Z
+                      </time>
+                    </button>
+                  </div>
                 </div>
                 <div
                   className="Box-root Flex-root coral coral-featuredComment-actionBar Flex-flex Flex-justifySpaceBetween Box-mt-2"
diff --git a/src/core/client/stream/test/comments/stream/__snapshots__/postLocalReply.spec.tsx.snap b/src/core/client/stream/test/comments/stream/__snapshots__/postLocalReply.spec.tsx.snap
index 34c3d8d2a..05f9c6ccc 100644
--- a/src/core/client/stream/test/comments/stream/__snapshots__/postLocalReply.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/stream/__snapshots__/postLocalReply.spec.tsx.snap
@@ -345,7 +345,7 @@ exports[`post a reply: open reply form 1`] = `
                   />
                   <div
                     aria-hidden="true"
-                    className="RTE-placeholder coral coral-rte-placholder RTE-placeholder"
+                    className="RTE-placeholder coral coral-rte-placeholder RTE-placeholder"
                   >
                     Write a reply
                   </div>
diff --git a/src/core/client/stream/test/comments/stream/__snapshots__/postReply.spec.tsx.snap b/src/core/client/stream/test/comments/stream/__snapshots__/postReply.spec.tsx.snap
index 66a8ba3f0..8d7b78ecd 100644
--- a/src/core/client/stream/test/comments/stream/__snapshots__/postReply.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/stream/__snapshots__/postReply.spec.tsx.snap
@@ -301,7 +301,7 @@ exports[`post a reply: open reply form 1`] = `
                   />
                   <div
                     aria-hidden="true"
-                    className="RTE-placeholder coral coral-rte-placholder RTE-placeholder"
+                    className="RTE-placeholder coral coral-rte-placeholder RTE-placeholder"
                   >
                     Write a reply
                   </div>
diff --git a/src/core/client/stream/test/comments/stream/__snapshots__/renderCommunityGuidelines.spec.tsx.snap b/src/core/client/stream/test/comments/stream/__snapshots__/renderCommunityGuidelines.spec.tsx.snap
index 235187427..f931a3d65 100644
--- a/src/core/client/stream/test/comments/stream/__snapshots__/renderCommunityGuidelines.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/stream/__snapshots__/renderCommunityGuidelines.spec.tsx.snap
@@ -96,7 +96,7 @@ exports[`renders comment stream with community guidelines 1`] = `
                 />
                 <div
                   aria-hidden="true"
-                  className="RTE-placeholder coral coral-rte-placholder RTE-placeholder"
+                  className="RTE-placeholder coral coral-rte-placeholder RTE-placeholder"
                 >
                   Post a comment
                 </div>
@@ -239,7 +239,7 @@ exports[`renders comment stream with community guidelines 1`] = `
             <button
               aria-controls="tabPane-ALL_COMMENTS"
               aria-selected={true}
-              className="BaseButton-root Tab-button Tab-secondary Tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
+              className="BaseButton-root Tab-button Tab-secondary Tab-active coral-tabBarSecondary-tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
               onBlur={[Function]}
               onClick={[Function]}
               onFocus={[Function]}
diff --git a/src/core/client/stream/test/comments/stream/__snapshots__/renderMessageBox.spec.tsx.snap b/src/core/client/stream/test/comments/stream/__snapshots__/renderMessageBox.spec.tsx.snap
index 3b439cdca..69e57e3aa 100644
--- a/src/core/client/stream/test/comments/stream/__snapshots__/renderMessageBox.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/stream/__snapshots__/renderMessageBox.spec.tsx.snap
@@ -160,7 +160,7 @@ exports[`renders message box when commenting disabled 1`] = `
             <button
               aria-controls="tabPane-ALL_COMMENTS"
               aria-selected={true}
-              className="BaseButton-root Tab-button Tab-secondary Tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
+              className="BaseButton-root Tab-button Tab-secondary Tab-active coral-tabBarSecondary-tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
               onBlur={[Function]}
               onClick={[Function]}
               onFocus={[Function]}
@@ -340,7 +340,7 @@ exports[`renders message box when logged in 1`] = `
                   />
                   <div
                     aria-hidden="true"
-                    className="RTE-placeholder coral coral-rte-placholder RTE-placeholder"
+                    className="RTE-placeholder coral coral-rte-placeholder RTE-placeholder"
                   >
                     Post a comment
                   </div>
@@ -488,7 +488,7 @@ exports[`renders message box when logged in 1`] = `
             <button
               aria-controls="tabPane-ALL_COMMENTS"
               aria-selected={true}
-              className="BaseButton-root Tab-button Tab-secondary Tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
+              className="BaseButton-root Tab-button Tab-secondary Tab-active coral-tabBarSecondary-tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
               onBlur={[Function]}
               onClick={[Function]}
               onFocus={[Function]}
@@ -645,7 +645,7 @@ exports[`renders message box when not logged in 1`] = `
                 />
                 <div
                   aria-hidden="true"
-                  className="RTE-placeholder coral coral-rte-placholder RTE-placeholder"
+                  className="RTE-placeholder coral coral-rte-placeholder RTE-placeholder"
                 >
                   Post a comment
                 </div>
@@ -788,7 +788,7 @@ exports[`renders message box when not logged in 1`] = `
             <button
               aria-controls="tabPane-ALL_COMMENTS"
               aria-selected={true}
-              className="BaseButton-root Tab-button Tab-secondary Tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
+              className="BaseButton-root Tab-button Tab-secondary Tab-active coral-tabBarSecondary-tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
               onBlur={[Function]}
               onClick={[Function]}
               onFocus={[Function]}
@@ -997,7 +997,7 @@ exports[`renders message box when story isClosed 1`] = `
             <button
               aria-controls="tabPane-ALL_COMMENTS"
               aria-selected={true}
-              className="BaseButton-root Tab-button Tab-secondary Tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
+              className="BaseButton-root Tab-button Tab-secondary Tab-active coral-tabBarSecondary-tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
               onBlur={[Function]}
               onClick={[Function]}
               onFocus={[Function]}
diff --git a/src/core/client/stream/test/comments/stream/__snapshots__/renderStream.spec.tsx.snap b/src/core/client/stream/test/comments/stream/__snapshots__/renderStream.spec.tsx.snap
index d3a70d4ed..06f59c66a 100644
--- a/src/core/client/stream/test/comments/stream/__snapshots__/renderStream.spec.tsx.snap
+++ b/src/core/client/stream/test/comments/stream/__snapshots__/renderStream.spec.tsx.snap
@@ -22,7 +22,7 @@ exports[`renders comment stream 1`] = `
         <button
           aria-controls="tabPane-COMMENTS"
           aria-selected={true}
-          className="BaseButton-root Tab-button Tab-primary Tab-active coral coral-tabBar-tab coral-tabBar-comments"
+          className="BaseButton-root Tab-button Tab-primary Tab-active coral coral-tabBar-tab coral-tabBar-comments coral-tabBar-tab-active"
           onBlur={[Function]}
           onClick={[Function]}
           onFocus={[Function]}
@@ -118,7 +118,7 @@ exports[`renders comment stream 1`] = `
                     />
                     <div
                       aria-hidden="true"
-                      className="RTE-placeholder coral coral-rte-placholder RTE-placeholder"
+                      className="RTE-placeholder coral coral-rte-placeholder RTE-placeholder"
                     >
                       Post a comment
                     </div>
@@ -261,7 +261,7 @@ exports[`renders comment stream 1`] = `
                 <button
                   aria-controls="tabPane-ALL_COMMENTS"
                   aria-selected={true}
-                  className="BaseButton-root Tab-button Tab-secondary Tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
+                  className="BaseButton-root Tab-button Tab-secondary Tab-active coral-tabBarSecondary-tab-active coral coral-tabBarSecondary-tab coral-tabBarComments-allComments"
                   onBlur={[Function]}
                   onClick={[Function]}
                   onFocus={[Function]}
diff --git a/src/core/client/stream/test/profile/__snapshots__/myComments.spec.tsx.snap b/src/core/client/stream/test/profile/__snapshots__/myComments.spec.tsx.snap
index f185e5200..9465a7177 100644
--- a/src/core/client/stream/test/profile/__snapshots__/myComments.spec.tsx.snap
+++ b/src/core/client/stream/test/profile/__snapshots__/myComments.spec.tsx.snap
@@ -10,7 +10,9 @@ exports[`renders profile 1`] = `
     className="Box-root HorizontalGutter-root HistoryComment-root coral coral-myComment HorizontalGutter-full"
     data-testid="historyComment-comment-0"
   >
-    <div>
+    <div
+      className="coral coral-myComment-commentOn"
+    >
       <p
         className="Box-root Typography-root Typography-detail Typography-colorTextPrimary HistoryComment-commentOn"
       >
@@ -71,7 +73,9 @@ exports[`renders profile 1`] = `
     className="Box-root HorizontalGutter-root HistoryComment-root coral coral-myComment HorizontalGutter-full"
     data-testid="historyComment-comment-1"
   >
-    <div>
+    <div
+      className="coral coral-myComment-commentOn"
+    >
       <p
         className="Box-root Typography-root Typography-detail Typography-colorTextPrimary HistoryComment-commentOn"
       >