Fix misalignment with Event List Summaries (#7865)

* Fix misalignment with Event List Summaries

* simplify styling

Author: t3chguy

res/css/views/messages/_ViewSourceEvent.scss

@@ -19,6 +19,7 @@ limitations under the License.
     opacity: 0.6;
     font-size: $font-12px;
     width: 100%;
+    margin-left: 20px;
 
     pre, code {
         flex: 1;

res/css/views/rooms/_EventTile.scss

@@ -280,11 +280,6 @@ $left-gutter: 64px;
     }
 }
 
-.mx_EventTile:not([data-layout=bubble]).mx_EventTile_info .mx_EventTile_line,
-.mx_GenericEventListSummary:not([data-layout=bubble]) > :not(.mx_EventTile) .mx_EventTile_avatar ~ .mx_EventTile_line {
-    padding-left: calc($left-gutter + 18px);
-}
-
 .mx_GenericEventListSummary:not([data-layout=bubble]) .mx_EventTile_line {
     padding-left: $left-gutter;
 }

src/components/views/elements/GenericEventListSummary.tsx

@@ -81,7 +81,9 @@ const GenericEventListSummary: React.FC<IProps> = ({
     if (expanded) {
         body = <React.Fragment>
             <div className="mx_GenericEventListSummary_line">&nbsp;</div>
-            { children }
+            <ol className="mx_GenericEventListSummary_unstyledList">
+                { children }
+            </ol>
         </React.Fragment>;
     } else {
         const uniqueMembers = uniqBy(summaryMembers.filter(member => {