feat: Implement microphone monitoring feature; enhance text overflow handling and line height across components

src/app/styles/CustomHtml.css.ts

@@ -16,13 +16,21 @@ export const MarginSpaced = style({
   },
 });
 
-export const Paragraph = style([DefaultReset]);
+export const Paragraph = style([
+  DefaultReset,
+  {
+    overflow: 'hidden',
+    lineHeight: '1.5',
+  },
+]);
 
 export const Heading = style([
   DefaultReset,
   MarginSpaced,
   {
     marginTop: config.space.S400,
+    overflow: 'hidden',
+    lineHeight: '1.5',
     selectors: {
       '&:first-child': {
         marginTop: 0,
@@ -38,6 +46,8 @@ export const BlockQuote = style([
     paddingLeft: config.space.S200,
     borderLeft: `${config.borderWidth.B700} solid ${color.SurfaceVariant.ContainerLine}`,
     fontStyle: 'italic',
+    overflow: 'hidden',
+    lineHeight: '1.5',
   },
 ]);
 
@@ -63,6 +73,8 @@ export const Code = style([
   {
     padding: `0 ${config.space.S100}`,
     display: 'inline-block',
+    overflow: 'hidden',
+    lineHeight: '1.5',
   },
 ]);
 
@@ -108,6 +120,8 @@ export const Spoiler = recipe({
       padding: `0 ${config.space.S100}`,
       backgroundColor: color.SurfaceVariant.ContainerActive,
       borderRadius: config.radii.R300,
+      overflow: 'hidden',
+      lineHeight: '1.5',
       selectors: {
         '&[aria-pressed=true]': {
           color: 'transparent',
@@ -132,6 +146,7 @@ export const CodeBlock = style([
     fontStyle: 'normal',
     position: 'relative',
     overflow: 'hidden',
+    lineHeight: '1.5',
   },
 ]);
 export const CodeBlockHeader = style([
@@ -167,6 +182,8 @@ export const List = style([
   {
     padding: `0 ${config.space.S100}`,
     paddingLeft: config.space.S600,
+    overflow: 'hidden',
+    lineHeight: '1.5',
   },
 ]);
 
@@ -194,6 +211,8 @@ export const Mention = recipe({
       padding: `0 ${toRem(2)}`,
       borderRadius: config.radii.R300,
       fontWeight: config.fontWeight.W500,
+      overflow: 'hidden',
+      lineHeight: '1.5',
     },
   ],
   variants: {
@@ -219,6 +238,8 @@ export const Command = recipe({
       padding: `0 ${toRem(2)}`,
       borderRadius: config.radii.R300,
       fontWeight: config.fontWeight.W500,
+      overflow: 'hidden',
+      lineHeight: '1.5',
     },
   ],
   variants: {
@@ -287,5 +308,7 @@ export const highlightText = style([
   {
     backgroundColor: 'yellow',
     color: 'black',
+    overflow: 'hidden',
+    lineHeight: '1.5',
   },
 ]);