From 55b76442370bb742029244a8acc5ecf0bfa6da2c Mon Sep 17 00:00:00 2001
From: Domagoj Kriskovic <dom.kriskovic@overleaf.com>
Date: Mon, 10 Jul 2023 15:31:10 +0200
Subject: [PATCH] [visual] fix styling for showing authors (#13772)

* [visual] fix styling for showing authors

* add horizontal padding

* use gap

* prettier

* maxWidth and flex wrap

* min-width

* use only min-width

GitOrigin-RevId: 1fdc1baac6fd98ee909f847716f6aedf88e96aec
---
 .../extensions/visual/visual-theme.ts           | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts
index 6264749781..82ac7cf1f2 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts
@@ -88,17 +88,16 @@ export const visualTheme = EditorView.theme({
     padding: '0.5em',
     lineHeight: 'calc(var(--line-height) * 5/6)',
   },
-  '.ol-cm-author': {
-    display: 'inline-block',
-    maxWidth: '45%',
-    minWidth: '200px',
-    verticalAlign: 'top',
-    cursor: 'pointer',
+  '.ol-cm-authors': {
+    display: 'flex',
+    justifyContent: 'space-evenly',
+    gap: '0.5em',
+    flexWrap: 'wrap',
   },
-  '.ol-cm-author:not(:first-child)': {
+  '.ol-cm-author': {
+    cursor: 'pointer',
     display: 'inline-block',
-    marginLeft: '5%',
-    maxWidth: '45%',
+    minWidth: '150px',
   },
   '.ol-cm-icon-brace': {
     filter: 'grayscale(1)',