Give a conversation's name its own line
Name, membership and unread count shared one line, which the list pane at 320 points has no room for: the name takes what it likes, the badges are left the remainder, and a long channel name squeezed them into a status reading "joine/d" and a count split down two lines — while the card, sized to a row that no longer fitted, stuck out past the cards above and below it. The badges go on the line under the name, where the width they need is their own and the card's edge stays where every other card's is. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
4c8b0c4 parent: 59b4b76 modified
src/frq/app.jolt +11 -6 | @@ -138,14 +138,19 @@ | ||
| 138 | 138 | (let [name (:name buffer) |
| 139 | 139 | unread (:unread buffer)] |
| 140 | 140 | [:card {:key name} |
| 141 | - ;; Name, membership and unread count on one line — they describe the same | |
| 142 | - ;; thing, and the row below is for the button alone. | |
| 143 | - [:hbox {:spacing 12} | |
| 144 | - [:title-2 {:label name}] | |
| 141 | + ;; The name gets the line, and membership and unread count the one under | |
| 142 | + ;; it. All three on one line is what the list pane has no room for: the | |
| 143 | + ;; name takes what it likes, the badges are left the remainder, and a | |
| 144 | + ;; long name squeezes them into a status reading "joine/d" and a count | |
| 145 | + ;; split down two lines — while the card, sized to a row that no longer | |
| 146 | + ;; fits, sticks out past the cards above and below it. | |
| 147 | + ;; | |
| 148 | + ;; `:wrap false` on the badges: they sit beside each other or not at all. | |
| 149 | + [:title-2 {:label name}] | |
| 150 | + [:hbox {:spacing 12 :wrap false} | |
| 145 | 151 | [:status {:label (if (:joined? buffer) "joined" "not joined") |
| 146 | 152 | :live (boolean (:joined? buffer))}] |
| 147 | - [:vbox {:key :unread} | |
| 148 | - (when (pos? unread) [:label {:label (str "● " unread)}])]] | |
| 153 | + (when (pos? unread) [:label {:label (str "● " unread)}])] | |
| 149 | 154 | [:dim-label {:label (s/last-preview buffer)}] |
| 150 | 155 | [:button {:label "Open" :kind :primary :on-click #(s/open-channel! name)}]])) |
| 151 | 156 | |
| @@ -138,14 +138,19 @@ | |||
| 138 | (let [name (:name buffer) | 138 | (let [name (:name buffer) |
| 139 | unread (:unread buffer)] | 139 | unread (:unread buffer)] |
| 140 | [:card {:key name} | 140 | [:card {:key name} |
| 141 | - ;; Name, membership and unread count on one line — they describe the same | 141 | + ;; The name gets the line, and membership and unread count the one under |
| 142 | - ;; thing, and the row below is for the button alone. | 142 | + ;; it. All three on one line is what the list pane has no room for: the |
| 143 | - [:hbox {:spacing 12} | 143 | + ;; name takes what it likes, the badges are left the remainder, and a |
| 144 | - [:title-2 {:label name}] | 144 | + ;; long name squeezes them into a status reading "joine/d" and a count |
| 145 | + ;; split down two lines — while the card, sized to a row that no longer | ||
| 146 | + ;; fits, sticks out past the cards above and below it. | ||
| 147 | + ;; | ||
| 148 | + ;; `:wrap false` on the badges: they sit beside each other or not at all. | ||
| 149 | + [:title-2 {:label name}] | ||
| 150 | + [:hbox {:spacing 12 :wrap false} | ||
| 145 | [:status {:label (if (:joined? buffer) "joined" "not joined") | 151 | [:status {:label (if (:joined? buffer) "joined" "not joined") |
| 146 | :live (boolean (:joined? buffer))}] | 152 | :live (boolean (:joined? buffer))}] |
| 147 | - [:vbox {:key :unread} | 153 | + (when (pos? unread) [:label {:label (str "● " unread)}])] |
| 148 | - (when (pos? unread) [:label {:label (str "● " unread)}])]] | ||
| 149 | [:dim-label {:label (s/last-preview buffer)}] | 154 | [:dim-label {:label (s/last-preview buffer)}] |
| 150 | [:button {:label "Open" :kind :primary :on-click #(s/open-channel! name)}]])) | 155 | [:button {:label "Open" :kind :primary :on-click #(s/open-channel! name)}]])) |
| 151 | 156 | ||