fix: fix in a better way

wireapp · Jan 30, 2025 · d1b4854 · d1b4854
1 parent f03a922
commit d1b4854
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 10 deletions.
diff --git a/src/script/page/RightSidebar/MessageDetails/MessageDetails.tsx b/src/script/page/RightSidebar/MessageDetails/MessageDetails.tsx
@@ -151,7 +151,7 @@ const MessageDetails: FC<MessageDetailsProps> = ({
   const onParticipantClick = (userEntity: User) => togglePanel(PanelState.GROUP_PARTICIPANT_USER, userEntity);
 
   return (
-    <div id="message-details" className="panel__page message-details">
+    <div id="message-details" className="panel__page panel__message-details">
       <PanelHeader
         onClose={onClose}
         title={panelTitle}
@@ -203,23 +203,23 @@ const MessageDetails: FC<MessageDetailsProps> = ({
         )}
 
         {messageState === MESSAGE_STATES.NO_RECEIPTS && (
-          <div className="message-details__empty" data-uie-name="message-details-no-receipts-placeholder">
-            <Icon.ReadIcon className="message-details__empty__icon" />
-            <p className="message-details__empty__text">{t('messageDetailsNoReceipts')}</p>
+          <div className="panel__message-details__empty" data-uie-name="message-details-no-receipts-placeholder">
+            <Icon.ReadIcon className="panel__message-details__empty__icon" />
+            <p className="panel__message-details__empty__text">{t('messageDetailsNoReceipts')}</p>
           </div>
         )}
 
         {messageState === MESSAGE_STATES.NO_REACTIONS && (
-          <div className="message-details__empty" data-uie-name="message-details-no-reactions-placeholder">
-            <Icon.LikeIcon className="message-details__empty__icon" />
-            <p className="message-details__empty__text">{t('messageDetailsNoReactions')}</p>
+          <div className="panel__message-details__empty" data-uie-name="message-details-no-reactions-placeholder">
+            <Icon.LikeIcon className="panel__message-details__empty__icon" />
+            <p className="panel__message-details__empty__text">{t('messageDetailsNoReactions')}</p>
           </div>
         )}
 
         {messageState === MESSAGE_STATES.RECEIPTS_OFF && (
           <div className="message-details__empty" data-uie-name="message-details-receipts-off-placeholder">
-            <Icon.ReadIcon className="message-details__empty__icon" />
-            <p className="message-details__empty__text">{t('messageDetailsReceiptsOff')}</p>
+            <Icon.ReadIcon className="panel__message-details__empty__icon" />
+            <p className="panel__message-details__empty__text">{t('messageDetailsReceiptsOff')}</p>
           </div>
         )}
       </FadingScrollbar>

diff --git a/src/style/content/conversation/message-list.less b/src/style/content/conversation/message-list.less
@@ -582,6 +582,7 @@
 }
 
 .message-details {
+  margin-left: var(--conversation-message-sender-width);
   font-size: var(--font-size-small);
 }
 

diff --git a/src/style/panel/message-details.less b/src/style/panel/message-details.less
@@ -17,7 +17,7 @@
  *
  */
 
-.message-details {
+.panel__message-details {
   &__empty {
     position: absolute;
     display: flex;
-Original file line number
+Diff line change
@@ Expand Up / @@ -582,6 +582,7 @@ @@
     }
     .message-details {
+      margin-left: var(--conversation-message-sender-width);
       font-size: var(--font-size-small);
     }
@@ Expand Down @@