Improved bubbles

1 files changed, 14 insertions, 7 deletions

diff --git a/src/layouts/_bubble-group.scss b/src/layouts/_bubble-group.scss
index 4db70d0..7593881 100644
--- a/src/layouts/_bubble-group.scss
+++ b/src/layouts/_bubble-group.scss
@@ -14,7 +14,6 @@
         grid-template-columns: auto 1fr;
         grid-auto-rows:        auto;
         grid-template-areas:   'avatar bubble';
-        justify-items:         start;
         align-items:           flex-start;
         gap:                   fn.dim(--spacing-y) fn.dim(--spacing-x);
         
@@ -23,16 +22,24 @@
             position:     sticky;
             top:          0;
             justify-self: end;
-        
-            @include iro.bem-next-elem('bubble') {
-                &::before {
-                    display: block;
-                }
-            }
         }
         
         @include iro.bem-elem('bubble') {
             grid-column: bubble;
         }
+        
+        @include iro.bem-modifier('compact') {
+            justify-items: start;
+        }
+        
+        @include iro.bem-modifier('arrow') {
+            @include iro.bem-elem('avatar') {
+                @include iro.bem-next-elem('bubble') {
+                    &::before {
+                        display: block;
+                    }
+                }
+            }
+        }
     }
 }