[Fix] Social wall HTML and CSS style - refs #5637

main/inc/lib/social.lib.php

@@ -1296,7 +1296,7 @@ class SocialManager extends UserManager
 
         $visibility = (api_get_user_id() == $userId  && $userId == $friendId);
         $messages = self::getWallMessages($userId, MESSAGE_STATUS_WALL, $idMessage, $start, $limit);
-        $formattedList = '<div>';
+        $formattedList = '<div class="mediaPost" style="width: calc(100% - 14px); display:inline-block; padding-left:14px">';
         $users = array();
 
         foreach ($messages as $message) {
@@ -1312,29 +1312,42 @@ class SocialManager extends UserManager
             $url = api_get_path(WEB_PATH).'main/social/profile.php?u='.$userIdLoop;
 
             $media = '';
-            $media .= '<div class="media">';
+            $media .= '<div class="media" style="width:100%; display:inline-block; margin-bottom:5px;">';
-            $media .= '<a href="'.$url.'" class="pull-left">'
+                $media .= '<div class="media-body" style="width: 100%; height: 32px;">';
+                    $media .= '<div class="pull-left" style="width: 32px; height: 100%;">';
+                    $media .= '<a href="'.$url.'" >'
                         . '<img class="" src="'. $users[$userIdLoop]['avatar'] .'" '
-                . 'width="32" height="32" alt="'.$users[$userIdLoop]['complete_name'].'" style="width: 32px; height: 32px;"> '
+                        . 'alt="'.$users[$userIdLoop]['complete_name'].'" style="width: 32px; height: 32px;"> '
                         . '</a>';
-
+                    $media .= '</div>';
-            $media .= '<div class="media-body">'
+                    $media .= '<div class="pull-left" style="padding-left:4px;width: calc(100% - 36px);height: 100%;">';
-                . '<h4 class="media-heading">'
+                        $media .= '<div style="width: 100%; height: 50%;">';
-                . '<a href="'.$url.'">' . $nameComplete . '</a> '
+                            $media .= '<h4 class="media-heading" style="width: inherit;">'
-                . '<small><span class="time" title="' . $date . '">' . $date . '</span></small>'
+                            . '<a href="'.$url.'">'.$nameComplete.'</a></h4>';
-                . '</h4>'
+                        $media .= '</div>';
-                . '</div>';
+                        $media .= '<div style="width: 100%; height: 50%;">';
-
+                        $media .= '<div class="pull-left" style="height: 100%;">';
-            $media .= '<span class="content">'.Security::remove_XSS($message['content']).'</span>';
+                        $media .= '<small><span class="time" title="'.$date.'">'.$date.'</span></small>';
-
+                        $media .= '</div>';
+                        $media .= '<div class="pull-right" style="height: 100%;">';
                         if ($visibility) {
                             $media .= '<div><a href="'.api_get_path(WEB_PATH).'main/social/profile.php?messageId=' . $message['id'].'">'.get_lang('SocialMessageDelete').'</a></div>';
                         }
+                        $media .= '</div>';
+                        $media .= '</div>';
+                    $media .= '</div>';
+                $media .= '</div>';
+                $media .= '<div class="pull-left" style="width: 100%;">';
+                    $media .= '<span class="content">'.Security::remove_XSS($message['content']).'</span>';
+                $media .= '</div>';
             $media .= '</div>'; // end media
 
             $formattedList .= $media;
         }
 
+        $formattedList .= '</div>';
+
+        $formattedList .= '<div class="mediaPost" style="display:inline-block;">';
             $formattedList .= '<form name="social_wall_message" method="POST">
                 <label for="social_wall_new_msg" class="hide">' . get_lang('SocialWriteNewComment') . '</label>
                 <input type="hidden" name = "messageId" value="'.$idMessage.'" />
@@ -1343,7 +1356,6 @@ class SocialManager extends UserManager
                 <input type="submit" name="social_wall_new_msg_submit" value="'.get_lang('Post').'" />
                 </form>';
         $formattedList .= '</div>';
-
         return $formattedList;
     }
 
@@ -1378,7 +1390,6 @@ class SocialManager extends UserManager
 
             $html = '';
             $html .= self::_headerMessagePost($message['user_sender_id'], $message['user_receiver_id'], $users, $message, $visibility);
-            $html .= '<hr>';
 
             $data[$key]['id'] = $message['id'];
             $data[$key]['html'] = $html;
@@ -1424,16 +1435,31 @@ class SocialManager extends UserManager
         }
 
         $html = '';
-        $html .= '<div class="mediaPost">';
+        $html .= '<div class="mediaPost" style="width: 100%; display:inline-block; margin-bottom:5px;">';
-        $html .= '<a href="'.$urlAuthor.'" class="pull-left">'
+        $html .= '<div class="media-body" style="width: 100%; height: 40px;">';
-            . '<img class="" src="'. $avatarAuthor .'"  width="40" height="40" alt="'.$nameCompleteAuthor.'" style="width: 40px; height: 40px;"></a>';
+        $html .= '<div class="pull-left" style="width: 40px; height: 100%;">';
-        $html .= '<div class="media-body">';
+        $html .= '<a href="'.$urlAuthor.'">'.'<img class="" src="'.$avatarAuthor.
-        $html .= '<h4 class="media-heading"> <a href="'.$urlAuthor.'">' . $nameCompleteAuthor . '</a> ' . $htmlReciber;
+        '" alt="'.$nameCompleteAuthor.'" style="width: 40px; height: 40px;"></a>';
-        $html .= '<small><span class="time" title="' . $date . '">' . $date . '</span></small></h4>';
+        $html .= '</div>';
+        $html .= '<div class="pull-left" style="padding-left:4px; width: calc(100% - 44px);height: 100%;">';
+        $html .= '<div style="width: 100%; height: 50%;">';
+        $html .= '<h4 class="media-heading" style="width: inherit;">';
+        $html .= '<a href="'.$urlAuthor.'">'.$nameCompleteAuthor.'</a>'.$htmlReciber.'</h4>';
+        $html .= '</div>';
+        $html .= '<div style="width: 100%; height: 50%;">';
+        $html .= '<div class="pull-left" style="height: 100%;">';
+        $html .= '<small><span class="time" title="'.$date.'">'.$date.'</span></small>';
+        $html .= '</div>';
+        $html .= '<div class="pull-right" style="height: 100%;">';
         $html .= $htmlDelete;
+        $html .= '</div>';
+        $html .= '</div>';
+        $html .= '</div>';
         $html .= $wallImage;
         $html .= '</div>';
+        $html .= '<div class="pull-left" style="width: 100%;">';
         $html .= '<span class="content">'.Security::remove_XSS(self::readContentWithOpenGraph($message['content'])).'</span>';
+        $html .= '</div>';
         $html .= '</div>'; // end mediaPost
 
         return $html;