Communication: Fix padding issues in channel search and post componen…

…ts (#9927)
ls1intum · Dec 2, 2024 · 0bfacf8 · 0bfacf8
1 parent c0f2cec
commit 0bfacf8
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 9 deletions.
diff --git a/...ew/course-conversations/layout/conversation-messages/conversation-messages.component.html b/...ew/course-conversations/layout/conversation-messages/conversation-messages.component.html
@@ -1,7 +1,7 @@
 @if (course) {
     <div class="py-3 pt-0 justify-content-center conversation-messages">
         <div class="justify-content-center">
-            <div class="row justify-content-center p-0">
+            <div class="justify-content-center px-3 py-0">
                 <!-- search bar -->
                 @if (!searchbarCollapsed) {
                     <div class="input-group ps-0" [class.search-active]="!!searchText">

diff --git a/src/main/webapp/app/shared/metis/post/post.component.html b/src/main/webapp/app/shared/metis/post/post.component.html
@@ -21,23 +21,23 @@
         </div>
     }
     <div class="align-items-center">
-        <div class="col">
-            <div>
+        <div>
+            <div class="post-context-information-wrap post-content-padding" [ngClass]="{ 'is-saved': isConsecutive() && posting.isSaved }">
                 @if (showAnnouncementIcon) {
                     <fa-icon
                         [icon]="faBullhorn"
                         iconSize="xs"
-                        class="col-auto pe-0 announcement-icon"
+                        class="pe-0 ms-1 announcement-icon"
                         [ngbTooltip]="'artemisApp.metis.post.postMarkedAsAnnouncementTooltip' | artemisTranslate"
                     />
                 }
                 <!-- in the course all-messages as well as in the preview mode during similarity check, the context (lecture, exercise, course-wide topic) is shown -->
                 <!-- not shown in course messages page -->
                 @if (showChannelReference && (pageType === PageType.OVERVIEW || previewMode)) {
-                    <span class="col-auto">
+                    <span>
                         @if (contextInformation.routerLinkComponents) {
                             <a
-                                class="linked-context-information post-content-padding ms-1"
+                                class="linked-context-information ms-1"
                                 [routerLink]="contextInformation.routerLinkComponents"
                                 [queryParams]="contextInformation.queryParams"
                                 (click)="onNavigateToContext($event)"
@@ -46,15 +46,15 @@
                             >
                         }
                         @if (!contextInformation.routerLinkComponents) {
-                            <span class="context-information post-content-padding ms-1">{{ contextInformation.displayName }}:</span>
+                            <span class="context-information ms-1">{{ contextInformation.displayName }}:</span>
                         }
                     </span>
                 }
                 <!-- post title not shown for plagiarism cases -->
                 @if (pageType !== PageType.PLAGIARISM_CASE_INSTRUCTOR && pageType !== PageType.PLAGIARISM_CASE_STUDENT) {
-                    <span class="col-auto">
+                    <span>
                         @if (posting.title?.length) {
-                            <span class="post-title post-content-padding ms-1">{{ posting.title }}</span>
+                            <span class="post-title ms-1">{{ posting.title }}</span>
                         }
                     </span>
                 }

diff --git a/src/main/webapp/app/shared/metis/post/post.component.scss b/src/main/webapp/app/shared/metis/post/post.component.scss
@@ -48,6 +48,7 @@
 .post-is-saved-message,
 .message-container,
 .post-reactions-bar,
+.post-context-information-wrap,
 .post {
     background-color: transparent;