From cc69d84c96ff95a194365ddcd704104366392ec4 Mon Sep 17 00:00:00 2001
From: Jason Zimdars <jz@37signals.com>
Date: Thu, 12 Sep 2024 16:32:31 -0500
Subject: [PATCH] Ensure bubbles are nicely sized on perma

---
 app/assets/stylesheets/bubbles.css  | 9 ++++++++-
 app/assets/stylesheets/comments.css | 4 ++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/bubbles.css b/app/assets/stylesheets/bubbles.css
index 3a3efaa47..cd8d781af 100644
--- a/app/assets/stylesheets/bubbles.css
+++ b/app/assets/stylesheets/bubbles.css
@@ -65,7 +65,9 @@
   }
 
   .bubble__perma & {
-    --bubble-size: 65vh !important;
+    --bubble-size: 100% !important;
+
+    z-index: 1;
   }
 }
 
@@ -216,6 +218,11 @@
   position: relative;
 }
 
+.bubble__perma {
+  block-size: 65cqb;
+  max-inline-size: 100%;
+}
+
 .bubble__svg {
   fill: var(--color-bg);
   pointer-events: none;
diff --git a/app/assets/stylesheets/comments.css b/app/assets/stylesheets/comments.css
index 9944621b2..52ca936d7 100644
--- a/app/assets/stylesheets/comments.css
+++ b/app/assets/stylesheets/comments.css
@@ -6,6 +6,10 @@
   font-size: clamp(1rem, 1.6cqi, 2rem);
   max-inline-size: 70ch;
   row-gap: var(--comment-padding-block);
+
+  > :first-child {
+    margin-block-start: var(--comment-padding-block);
+  }
 }
 
 .comment__avatar {