diff --git a/app/assets/stylesheets/card-columns.css b/app/assets/stylesheets/card-columns.css index d3daec9d3..ed7edab33 100644 --- a/app/assets/stylesheets/card-columns.css +++ b/app/assets/stylesheets/card-columns.css @@ -5,7 +5,7 @@ /* Card contents are resized via container queries. We're using #main here as the primary container so all cards have the same container reference */ #main:has(.card-columns) { - --cards-gap: min(2cqi, 1rem); + --cards-gap: min(1cqi, 0.7rem); --gradient-border: linear-gradient(to right,var(--color-canvas), var(--color-ink) 3%, var(--color-ink) 97%, var(--color-canvas)); --reserved-bubble-space: 0; --bubble-gap: 0.5rem; @@ -72,7 +72,7 @@ .card { --block-space: 1em; --block-space-half: 0.5em; - --text-xx-large: 2em; + --text-xx-large: 1.6em; --text-x-small: 1em; /* Set lower limit for font size */ @@ -145,7 +145,9 @@ justify-content: center; margin-block-start: 1px; margin-inline: -8px; /* enough to cover card shadows, but avoid overlapping bubbles */ - padding-block: var(--cards-gap); + padding-block: var(--cards-gap) 0; + position: sticky; + z-index: 3; /* Cover bubbles and cards on small viewports */ @media (max-width: 639px) { @@ -274,7 +276,7 @@ } .card__body { - padding-block-start: calc(var(--card-padding-block) / 2); + padding-block-start: 0; padding-inline: 0; } diff --git a/app/assets/stylesheets/cards.css b/app/assets/stylesheets/cards.css index 1c6fbc162..6191a28be 100644 --- a/app/assets/stylesheets/cards.css +++ b/app/assets/stylesheets/cards.css @@ -121,7 +121,7 @@ flex-grow: 1; gap: 1ch; inline-size: 100%; - padding-block: var(--card-padding-block); + padding-block: calc(var(--card-padding-block) / 2); @media (min-width: 640px) { gap: var(--card-padding-inline); diff --git a/app/assets/stylesheets/header.css b/app/assets/stylesheets/header.css index abe3dc6c6..2d5bc40a9 100644 --- a/app/assets/stylesheets/header.css +++ b/app/assets/stylesheets/header.css @@ -22,7 +22,7 @@ &:has(.header__actions > *:nth-child(3)) { --header-button-count: 3; } &:has(nav) { - row-gap: var(--block-space-half); + row-gap: 0; } &:has(~ #main .card-columns) { diff --git a/app/views/cards/display/common/_meta.html.erb b/app/views/cards/display/common/_meta.html.erb index 3aaa2741d..2a05a46ea 100644 --- a/app/views/cards/display/common/_meta.html.erb +++ b/app/views/cards/display/common/_meta.html.erb @@ -24,7 +24,7 @@ - <%= card.assignees.any? ? "Assigned to" : "Not assigned" %> + <%= "Assigned to" if card.assignees.any? %> <%= card.assignees.map { |assignee| "#{assignee.familiar_name}" }.to_sentence.html_safe %> diff --git a/app/views/cards/display/public_preview/_meta.html.erb b/app/views/cards/display/public_preview/_meta.html.erb index be50ac7f3..d47bd1eff 100644 --- a/app/views/cards/display/public_preview/_meta.html.erb +++ b/app/views/cards/display/public_preview/_meta.html.erb @@ -20,7 +20,7 @@ - <%= card.assignees.any? ? "Assigned to" : "Not assigned" %> + <%= "Assigned to" if card.assignees.any? %> <%= card.assignees.map { |assignee| "#{assignee.familiar_name}" }.to_sentence.html_safe %>