Merge pull request #813 from basecamp/event-summary-tweaks

Event summary tweaks

app/assets/stylesheets/_global.css

@@ -48,7 +48,7 @@
 
   /* Z-index */
   --z-events-column-header: 1;
-  --z-events-day-header: 2;
+  --z-events-day-header: 3;
   --z-popup: 10;
   --z-terminal: 20;
   --z-tray: 21;

app/assets/stylesheets/events.css

@@ -18,17 +18,16 @@
   }
 
   .events__activity-summary {
-    --border-color: var(--color-selected);
-
-    background-color: var(--color-selected-light);
     font-style: italic;
     inline-size: auto;
     line-height: 1.3;
+    margin-block-end: calc(var(--block-space) * -1);
     margin-inline: auto;
     max-inline-size: 80ch;
     padding: 1.3lh 1lh 1lh;
     position: relative;
     text-align: start;
+    z-index: 2;
 
     &:has(.events__activity--generating) {
       --border-color: var(--color-selected-dark);
@@ -57,9 +56,6 @@
     }
 
     .btn {
-      --btn-background: var(--color-selected-light);
-      --btn-border-color: var(--color-selected-dark);
-
       inset: auto 1em 1em auto;
       position: absolute;
     }
@@ -104,6 +100,7 @@
   .events__columns {
     border-block-start: var(--events-border);
     position: relative;
+    z-index: 1;
 
     @media (min-width: 640px) {
       align-items: end;

app/views/events/day_timeline/_summary.html.erb

@@ -1,4 +1,4 @@
-<div class="events__activity-summary margin-block txt-small border border-radius">
+<div class="events__activity-summary txt-small fill-white border border-radius">
   <% if day_timeline.summarized? %>
     <%= render "events/day_timeline/activity_summary", summary: day_timeline.summary %>