Skip to content

Commit e240897

Browse files
authored
Merge pull request #1772 from basecamp/andy-dec-1-25
Andy dec 1 25
2 parents 06a3951 + 220581c commit e240897

File tree

6 files changed

+29
-10
lines changed

6 files changed

+29
-10
lines changed

app/assets/stylesheets/base.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@
5353
}
5454

5555
::selection {
56-
background-color: var(--color-selected);
56+
background: var(--color-selected);
5757

5858
@media (prefers-color-scheme: dark) {
5959
background-color: var(--color-selected-dark);

app/assets/stylesheets/card-columns.css

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -486,7 +486,6 @@
486486
}
487487

488488
.card__title {
489-
line-height: 1.2;
490489
pointer-events: none;
491490
}
492491

@@ -728,8 +727,10 @@
728727
text-transform: uppercase;
729728

730729
@media (hover: hover) {
731-
&:hover {
732-
--btn-background: color(from var(--card-color) srgb r g b / 0.15);
730+
&:not(.card__column-name--current):hover {
731+
--btn-background: color(from var(--column-color) srgb r g b / 0.15);
732+
733+
color: var(--column-color);
733734
}
734735
}
735736
}

app/assets/stylesheets/cards.css

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -150,18 +150,29 @@
150150
color: var(--card-content-color);
151151
font-size: var(--text-xx-large);
152152
font-weight: 900;
153-
line-height: 1.3;
154-
/* We need a minimum line-height of 1.3 to avoid scrolling
155-
in the card title input and cut-off descenders on Windows */
153+
line-height: 1.15;
154+
margin-block-end: 1ch;
156155
text-wrap: balance;
157156

158-
@supports not (field-sizing: content) {
159-
&:has(textarea) {
157+
/* With tight line spacing, Windows will cover over adjacent lines of text
158+
* when input text is selected. Here, we're setting the selection color to a
159+
* transparent value so the overlapping text lines are at least visible. */
160+
::selection {
161+
background: oklch(var(--lch-blue-light) / 0.5);
162+
}
163+
164+
&:has(textarea) {
165+
margin-block-end: 0;
166+
167+
@supports not (field-sizing: content) {
160168
text-wrap: unset; /* Safari is annoying if you have text-wrap: balance in textareas */
161169
}
162170
}
163171

164172
.card-field__title {
173+
overflow: hidden; /* prevent scrolling on windows */
174+
padding-block-end: 1ch;
175+
165176
&:is(textarea)::placeholder {
166177
color: inherit;
167178
opacity: 0.66;
@@ -366,7 +377,6 @@
366377
color: var(--stamp-color);
367378
font-size: 1.3em;
368379
font-weight: 900;
369-
line-height: 1.2;
370380
position: relative;
371381
text-align: center;
372382
text-transform: uppercase;

app/assets/stylesheets/trays.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -405,6 +405,10 @@
405405
opacity: 1;
406406
}
407407
}
408+
409+
[aria-busy] & {
410+
position: absolute !important;
411+
}
408412
}
409413

410414
.avatar,

app/helpers/columns_helper.rb

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ def button_to_set_column(card, column)
55
card_triage_path(card, column_id: column),
66
method: :post,
77
class: [ "card__column-name btn", { "card__column-name--current": column == card.column && card.open? } ],
8+
style: "--column-color: #{column.color}",
89
form_class: "flex align-center gap-half",
910
data: { turbo_frame: "_top" }
1011
end

app/views/cards/columns/edit.html.erb

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,14 @@
44

55
<%= button_to "Not now", card_not_now_path(@card),
66
class: [ "card__column-name btn", { "card__column-name--current": @card.postponed? } ],
7+
style: "--column-color: var(--color-card-complete)",
78
role: "radio",
89
aria: { checked: @card.postponed? },
910
form_class: "flex align-center gap-half" %>
1011

1112
<%= button_to "Maybe?", card_triage_path(@card), method: :delete,
1213
class: [ "card__column-name card__column-name--stream btn", { "card__column-name--current": @card.awaiting_triage? } ],
14+
style: "--column-color: var(--color-card-default)",
1315
role: "radio",
1416
aria: { checked: @card.awaiting_triage? },
1517
form_class: "flex align-center gap-half" %>
@@ -20,6 +22,7 @@
2022

2123
<%= button_to "Done", card_closure_path(@card),
2224
class: [ "card__column-name btn", { "card__column-name--current": @card.closed? } ],
25+
style: "--column-color: var(--color-card-complete)",
2326
role: "radio",
2427
aria: { checked: @card.closed? },
2528
form_class: "flex align-center gap-half" %>

0 commit comments

Comments
 (0)